@skbkontur/react-ui 6.4.2-static-css.0 → 6.4.3-5e1c3.0

package/components/Button/Button.styles.d.ts

@@ -1,111 +1,95 @@
+import type { Theme } from '../../lib/theming/Theme.js';
 import { globalClasses } from './Button.classes.js';
 export { globalClasses };
-/** Правила — в `Button.css`; здесь только имена классов. */
-export declare const getActiveStyles: (ignored?: unknown) => import("../../lib/theming/staticStyles.js").StaticStyles<{
-    default: string;
-    defaultBorderAboveBg: string;
-    accent: string;
-    accentBorderAboveBg: string;
-    success: string;
-    successBorderAboveBg: string;
-    danger: string;
-    dangerBorderAboveBg: string;
-    pay: string;
-    payBorderAboveBg: string;
-    link: string;
-    text: string;
-    outline: string;
-    outlineBorderAboveBg: string;
-    fill: string;
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
+    root(t: Theme): string;
+    withArrowIconRightSmall(t: Theme): string;
+    withArrowIconRightMedium(t: Theme): string;
+    withArrowIconRightLarge(t: Theme): string;
+    withArrowIconLeftSmall(t: Theme): string;
+    withArrowIconLeftMedium(t: Theme): string;
+    withArrowIconLeftLarge(t: Theme): string;
+    simulatedPress(): string;
+    /** @deprecated */
+    outlineDefault(): string;
+    /** @deprecated */
+    outlineWarning(t: Theme): string;
+    /** @deprecated */
+    outlineError(t: Theme): string;
+    /** @deprecated */
+    outlineLink(): string;
+    /** @deprecated */
+    outlineLinkWarning(t: Theme): string;
+    /** @deprecated */
+    outlineLinkError(t: Theme): string;
+    sizeSmall(t: Theme): string;
+    sizeMedium(t: Theme): string;
+    sizeLarge(t: Theme): string;
+    sizeSmallWithIcon(t: Theme): string;
+    sizeMediumWithIcon(t: Theme): string;
+    sizeLargeWithIcon(t: Theme): string;
+    sizeSmallWithRightIcon(t: Theme): string;
+    sizeMediumWithRightIcon(t: Theme): string;
+    sizeLargeWithRightIcon(t: Theme): string;
+    sizeSmallWithIconWithoutText(t: Theme): string;
+    sizeMediumWithIconWithoutText(t: Theme): string;
+    sizeLargeWithIconWithoutText(t: Theme): string;
+    /** @deprecated */
+    link(t: Theme): string;
+    /** @deprecated */
+    linkLineHeight(): string;
+    /** @deprecated */
+    linkLineHeightSafariFallback(): string;
+    /** @deprecated */
+    linkFocus(t: Theme): string;
+    /** @deprecated */
+    linkDisabled(t: Theme): string;
+    focus(t: Theme): string;
+    disabled(t: Theme): string;
+    disabledWithoutOutline(t: Theme): string;
+    arrowIconRoot(): string;
+    arrowIconRootSmall(t: Theme): string;
+    arrowIconRootMedium(t: Theme): string;
+    arrowIconRootLarge(t: Theme): string;
+    arrowIconLeft(): string;
+    default(t: Theme): string;
+    accent(t: Theme): string;
+    success(t: Theme): string;
+    danger(t: Theme): string;
+    pay(t: Theme): string;
+    text(t: Theme): string;
+    outline(t: Theme): string;
+    fill(t: Theme): string;
+    checked(t: Theme): string;
+    checkedFocused(t: Theme): string;
+    checkedDisabled(t: Theme): string;
+    caption(): string;
+    captionLink(): string;
+    captionDisabled(): string;
+    wrap(t: Theme): string;
+    wrapSmall(t: Theme): string;
+    wrapMedium(t: Theme): string;
+    wrapLarge(t: Theme): string;
+    /** @deprecated */
+    narrow(): string;
+    noPadding(): string;
+    noRightPadding(): string;
+    wrapLink(): string;
+    /** @deprecated */
+    borderless(): string;
+    backlessDisabled(t: Theme): string;
+    textDisabled(): string;
+    loading(): string;
+    visibilityHidden(): string;
 }>;
-export declare const getStyles: (ignored?: unknown) => import("../../lib/theming/staticStyles.js").StaticStyles<{
-    root: string;
-    simulatedPress: string;
-    outlineDefault: string;
-    outlineWarning: string;
-    outlineError: string;
-    outlineLink: string;
-    outlineLinkWarning: string;
-    outlineLinkError: string;
-    sizeSmall: string;
-    sizeMedium: string;
-    sizeLarge: string;
-    sizeSmallWithIcon: string;
-    sizeMediumWithIcon: string;
-    sizeLargeWithIcon: string;
-    sizeSmallWithRightIcon: string;
-    sizeMediumWithRightIcon: string;
-    sizeLargeWithRightIcon: string;
-    sizeSmallWithIconWithoutText: string;
-    sizeMediumWithIconWithoutText: string;
-    sizeLargeWithIconWithoutText: string;
-    link: string;
-    linkLineHeight: string;
-    linkLineHeightSafariFallback: string;
-    arrowIconRoot: string;
-    arrowIconRootSmall: string;
-    arrowIconRootMedium: string;
-    arrowIconRootLarge: string;
-    arrowIconLeft: string;
-    default: string;
-    defaultGradient: string;
-    defaultHoverGradient: string;
-    defaultHoverBorderAboveBg: string;
-    defaultActiveBorderAboveBg: string;
-    accent: string;
-    accentGradient: string;
-    accentHoverGradient: string;
-    accentHoverBorderAboveBg: string;
-    accentActiveBorderAboveBg: string;
-    success: string;
-    successGradient: string;
-    successHoverGradient: string;
-    successHoverBorderAboveBg: string;
-    successActiveBorderAboveBg: string;
-    danger: string;
-    dangerGradient: string;
-    dangerHoverGradient: string;
-    dangerHoverBorderAboveBg: string;
-    dangerActiveBorderAboveBg: string;
-    pay: string;
-    payGradient: string;
-    payHoverGradient: string;
-    payHoverBorderAboveBg: string;
-    payActiveBorderAboveBg: string;
-    text: string;
-    textHoverBorderAboveBg: string;
-    outline: string;
-    outlineHoverBorderAboveBg: string;
-    outlineActiveBorderAboveBg: string;
-    fill: string;
-    caption: string;
-    captionLink: string;
-    captionDisabled: string;
-    wrap: string;
-    wrapSmall: string;
-    wrapMedium: string;
-    wrapLarge: string;
-    narrow: string;
-    noPadding: string;
-    noRightPadding: string;
-    wrapLink: string;
-    borderless: string;
-    visibilityHidden: string;
-    withArrowIconRightSmall: string;
-    withArrowIconRightMedium: string;
-    withArrowIconRightLarge: string;
-    withArrowIconLeftSmall: string;
-    withArrowIconLeftMedium: string;
-    withArrowIconLeftLarge: string;
-    focus: string;
-    linkFocus: string;
-    checked: string;
-    checkedFocused: string;
-    disabled: string;
-    disabledWithoutOutline: string;
-    linkDisabled: string;
-    checkedDisabled: string;
-    backlessDisabled: string;
-    textDisabled: string;
-    loading: string;
+export declare const getActiveStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
+    default(t: Theme): string;
+    accent(t: Theme): string;
+    success(t: Theme): string;
+    danger(t: Theme): string;
+    pay(t: Theme): string;
+    link(t: Theme): string;
+    text(t: Theme): string;
+    outline(t: Theme): string;
+    fill(t: Theme): string;
 }>;

package/components/Button/Button.styles.js

@@ -1,113 +1,260 @@
-import { staticStyles } from '../../lib/theming/staticStyles.js';
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { resetButton, resetText } from '../../lib/styles/Mixins.js';
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
 import { globalClasses } from './Button.classes.js';
+import { buttonActiveMixin, buttonHoverMixin, buttonSizeMixin, buttonUseMixin } from './Button.mixins.js';
 export { globalClasses };
-/** Правила — в `Button.css`; здесь только имена классов. */
-export var getActiveStyles = staticStyles({
-    default: 'react-ui-Button-Active-default',
-    defaultBorderAboveBg: 'react-ui-Button-Active-defaultBorderAboveBg',
-    accent: 'react-ui-Button-Active-accent',
-    accentBorderAboveBg: 'react-ui-Button-Active-accentBorderAboveBg',
-    success: 'react-ui-Button-Active-success',
-    successBorderAboveBg: 'react-ui-Button-Active-successBorderAboveBg',
-    danger: 'react-ui-Button-Active-danger',
-    dangerBorderAboveBg: 'react-ui-Button-Active-dangerBorderAboveBg',
-    pay: 'react-ui-Button-Active-pay',
-    payBorderAboveBg: 'react-ui-Button-Active-payBorderAboveBg',
-    link: 'react-ui-Button-Active-link',
-    text: 'react-ui-Button-Active-text',
-    outline: 'react-ui-Button-Active-outline',
-    outlineBorderAboveBg: 'react-ui-Button-Active-outlineBorderAboveBg',
-    fill: 'react-ui-Button-Active-fill',
+export var getStyles = memoizeGetStyles(function (emotion) {
+    var activeStyles = getActiveStyles(emotion);
+    return {
+        root: function (t) {
+            return emotion.css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        ", ";\n        ", ";\n\n        transition: background-color ", " ", "\n          ", ";\n\n      background-clip: ", ";\n      background-position: center;\n      background-repeat: no-repeat;\n      background-size: contain;\n      cursor: pointer;\n      display: inline-block;\n      position: relative;\n      text-align: center;\n      width: 100%;\n      height: 100%;\n\n        .", " {\n          content: '';\n          border-radius: inherit;\n          position: absolute;\n          top: 0;\n          bottom: 0;\n          left: 0;\n          right: 0;\n        }\n\n        &::-moz-focus-inner {\n          border: 0;\n          padding: 0;\n        }\n        &::after {\n          content: '';\n          display: inline-block;\n          vertical-align: baseline;\n          width: 0;\n        }\n\n        &:hover svg {\n          color: ", ";\n        }\n        &.", " svg {\n          color: ", ";\n        }\n        & svg {\n          color: ", ";\n        }\n      "], ["\n        ", ";\n        ", ";\n\n        transition: background-color ", " ", "\n          ", ";\n\n      background-clip: ", ";\n      background-position: center;\n      background-repeat: no-repeat;\n      background-size: contain;\n      cursor: pointer;\n      display: inline-block;\n      position: relative;\n      text-align: center;\n      width: 100%;\n      height: 100%;\n\n        .", " {\n          content: '';\n          border-radius: inherit;\n          position: absolute;\n          top: 0;\n          bottom: 0;\n          left: 0;\n          right: 0;\n        }\n\n        &::-moz-focus-inner {\n          border: 0;\n          padding: 0;\n        }\n        &::after {\n          content: '';\n          display: inline-block;\n          vertical-align: baseline;\n          width: 0;\n        }\n\n        &:hover svg {\n          color: ", ";\n        }\n        &.", " svg {\n          color: ", ";\n        }\n        & svg {\n          color: ", ";\n        }\n      "])), resetButton(), resetText(), t.transitionDuration, t.transitionTimingFunction, t.btnBorderColorTransition ? ", ".concat(t.btnBorderColorTransition) : '', t.btnBackgroundClip, globalClasses.innerShadow, t.btnIconHoverColor, globalClasses.disabled, t.btnIconDisabledColor, t.btnIconColor);
+        },
+        withArrowIconRightSmall: function (t) {
+            return emotion.css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n        padding-right: calc(", " + ", " + ", ");\n      "], ["\n        padding-right: calc(", " + ", " + ", ");\n      "])), t.btnIconSizeSmall, t.btnWithIconPaddingSmall, t.btnWithIconPaddingSmall);
+        },
+        withArrowIconRightMedium: function (t) {
+            return emotion.css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n        padding-right: calc(", " + ", " + ", ");\n      "], ["\n        padding-right: calc(", " + ", " + ", ");\n      "])), t.btnIconSizeMedium, t.btnWithIconPaddingMedium, t.btnWithIconPaddingMedium);
+        },
+        withArrowIconRightLarge: function (t) {
+            return emotion.css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n        padding-right: calc(", " + ", " + ", ");\n      "], ["\n        padding-right: calc(", " + ", " + ", ");\n      "])), t.btnIconSizeLarge, t.btnWithIconPaddingLarge, t.btnWithIconPaddingLarge);
+        },
+        withArrowIconLeftSmall: function (t) {
+            return emotion.css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n        padding-left: calc(", " + ", " + ", ");\n      "], ["\n        padding-left: calc(", " + ", " + ", ");\n      "])), t.btnIconSizeSmall, t.btnWithIconPaddingSmall, t.btnWithIconPaddingSmall);
+        },
+        withArrowIconLeftMedium: function (t) {
+            return emotion.css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n        padding-left: calc(", " + ", " + ", ");\n      "], ["\n        padding-left: calc(", " + ", " + ", ");\n      "])), t.btnIconSizeMedium, t.btnWithIconPaddingMedium, t.btnWithIconPaddingMedium);
+        },
+        withArrowIconLeftLarge: function (t) {
+            return emotion.css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n        padding-left: calc(", " + ", " + ", ");\n      "], ["\n        padding-left: calc(", " + ", " + ", ");\n      "])), t.btnIconSizeLarge, t.btnWithIconPaddingLarge, t.btnWithIconPaddingLarge);
+        },
+        simulatedPress: function () {
+            return emotion.css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n        &:active .", " {\n          transform: translateY(1px);\n        }\n      "], ["\n        &:active .", " {\n          transform: translateY(1px);\n        }\n      "])), globalClasses.caption);
+        },
+        /** @deprecated */
+        outlineDefault: function () {
+            return emotion.css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n        border-radius: inherit;\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n      "], ["\n        border-radius: inherit;\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n      "])));
+        },
+        /** @deprecated */
+        outlineWarning: function (t) {
+            return emotion.css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n        box-shadow:\n          0 0 0 ", " ", ",\n          inset 0 0 0 ", " ", ";\n      "], ["\n        box-shadow:\n          0 0 0 ", " ", ",\n          inset 0 0 0 ", " ", ";\n      "])), t.btnOutlineWidth, t.btnBorderColorWarning, t.btnInsetWidth, t.btnInsetColor);
+        },
+        /** @deprecated */
+        outlineError: function (t) {
+            return emotion.css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n        box-shadow:\n          0 0 0 ", " ", ",\n          inset 0 0 0 ", " ", ";\n      "], ["\n        box-shadow:\n          0 0 0 ", " ", ",\n          inset 0 0 0 ", " ", ";\n      "])), t.btnOutlineWidth, t.btnBorderColorError, t.btnInsetWidth, t.btnInsetColor);
+        },
+        /** @deprecated */
+        outlineLink: function () {
+            return emotion.css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n        cursor: default;\n        box-shadow: none;\n        left: -2px;\n        right: -2px;\n        bottom: -2px;\n        top: -2px;\n      "], ["\n        cursor: default;\n        box-shadow: none;\n        left: -2px;\n        right: -2px;\n        bottom: -2px;\n        top: -2px;\n      "])));
+        },
+        /** @deprecated */
+        outlineLinkWarning: function (t) {
+            return emotion.css(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n        background-color: ", ";\n      "], ["\n        background-color: ", ";\n      "])), t.btnWarningSecondary);
+        },
+        /** @deprecated */
+        outlineLinkError: function (t) {
+            return emotion.css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n        background-color: ", ";\n      "], ["\n        background-color: ", ";\n      "])), t.btnErrorSecondary);
+        },
+        sizeSmall: function (t) {
+            return emotion.css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n        border-radius: ", ";\n\n      ", ";\n    "], ["\n        border-radius: ", ";\n\n      ", ";\n    "])), t.btnBorderRadiusSmall, buttonSizeMixin(t.btnFontSizeSmall, t.btnLineHeightSmall, t.btnPaddingXSmall, t.btnPaddingYSmall));
+        },
+        sizeMedium: function (t) {
+            return emotion.css(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n        border-radius: ", ";\n\n      ", ";\n    "], ["\n        border-radius: ", ";\n\n      ", ";\n    "])), t.btnBorderRadiusMedium, buttonSizeMixin(t.btnFontSizeMedium, t.btnLineHeightMedium, t.btnPaddingXMedium, t.btnPaddingYMedium));
+        },
+        sizeLarge: function (t) {
+            return emotion.css(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n        border-radius: ", ";\n\n      ", ";\n    "], ["\n        border-radius: ", ";\n\n      ", ";\n    "])), t.btnBorderRadiusLarge, buttonSizeMixin(t.btnFontSizeLarge, t.btnLineHeightLarge, t.btnPaddingXLarge, t.btnPaddingYLarge));
+        },
+        sizeSmallWithIcon: function (t) {
+            return emotion.css(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n        padding-left: ", ";\n      "], ["\n        padding-left: ", ";\n      "])), t.btnWithIconPaddingSmall);
+        },
+        sizeMediumWithIcon: function (t) {
+            return emotion.css(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n        padding-left: ", ";\n      "], ["\n        padding-left: ", ";\n      "])), t.btnWithIconPaddingMedium);
+        },
+        sizeLargeWithIcon: function (t) {
+            return emotion.css(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n        padding-left: ", ";\n      "], ["\n        padding-left: ", ";\n      "])), t.btnWithIconPaddingLarge);
+        },
+        sizeSmallWithRightIcon: function (t) {
+            return emotion.css(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n        padding-right: ", ";\n      "], ["\n        padding-right: ", ";\n      "])), t.btnWithIconPaddingSmall);
+        },
+        sizeMediumWithRightIcon: function (t) {
+            return emotion.css(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n        padding-right: ", ";\n      "], ["\n        padding-right: ", ";\n      "])), t.btnWithIconPaddingMedium);
+        },
+        sizeLargeWithRightIcon: function (t) {
+            return emotion.css(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n        padding-right: ", ";\n      "], ["\n        padding-right: ", ";\n      "])), t.btnWithIconPaddingLarge);
+        },
+        sizeSmallWithIconWithoutText: function (t) {
+            return emotion.css(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n      padding-left: ", ";\n      padding-right: ", ";\n    "], ["\n      padding-left: ", ";\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingSmall, t.btnWithIconPaddingSmall);
+        },
+        sizeMediumWithIconWithoutText: function (t) {
+            return emotion.css(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n      padding-left: ", ";\n      padding-right: ", ";\n    "], ["\n      padding-left: ", ";\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingMedium, t.btnWithIconPaddingMedium);
+        },
+        sizeLargeWithIconWithoutText: function (t) {
+            return emotion.css(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n      padding-left: ", ";\n      padding-right: ", ";\n    "], ["\n      padding-left: ", ";\n      padding-right: ", ";\n    "])), t.btnWithIconPaddingLarge, t.btnWithIconPaddingLarge);
+        },
+        /** @deprecated */
+        link: function (t) {
+            return emotion.css(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n        background: none;\n        border-radius: ", ";\n        border: none;\n        box-shadow: none;\n        white-space: nowrap;\n        color: ", ";\n        display: inline;\n        margin: 0;\n        padding: 0 !important; // override size mixin\n        height: auto !important; // override size mixin\n\n        &:hover:enabled,\n        &:active:enabled {\n          color: ", ";\n          text-decoration: ", ";\n        }\n\n        &:active:enabled {\n          ", "\n        }\n      "], ["\n        background: none;\n        border-radius: ", ";\n        border: none;\n        box-shadow: none;\n        white-space: nowrap;\n        color: ", ";\n        display: inline;\n        margin: 0;\n        padding: 0 !important; // override size mixin\n        height: auto !important; // override size mixin\n\n        &:hover:enabled,\n        &:active:enabled {\n          color: ", ";\n          text-decoration: ", ";\n        }\n\n        &:active:enabled {\n          ", "\n        }\n      "])), t.btnLinkBorderRadius, t.btnLinkColor, t.btnLinkHoverColor, t.btnLinkHoverTextDecoration, activeStyles.link(t));
+        },
+        /** @deprecated */
+        linkLineHeight: function () {
+            return emotion.css(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n        line-height: inherit !important; // override size mixin\n      "], ["\n        line-height: inherit !important; // override size mixin\n      "])));
+        },
+        /** @deprecated */
+        linkLineHeightSafariFallback: function () {
+            return emotion.css(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n        /* Safari overrides 'underline' and 'border' if 'line-height' is used */\n        margin: -1px 0 -2px;\n      "], ["\n        /* Safari overrides 'underline' and 'border' if 'line-height' is used */\n        margin: -1px 0 -2px;\n      "])));
+        },
+        /** @deprecated */
+        linkFocus: function (t) {
+            return emotion.css(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n        & {\n          color: ", ";\n          text-decoration: ", ";\n        }\n      "], ["\n        & {\n          color: ", ";\n          text-decoration: ", ";\n        }\n      "])), t.btnLinkColor, t.btnLinkHoverTextDecoration);
+        },
+        /** @deprecated */
+        linkDisabled: function (t) {
+            return emotion.css(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n        cursor: default;\n\n        &,\n        &:hover:enabled,\n        &:active:enabled {\n          color: ", ";\n        }\n      "], ["\n        cursor: default;\n\n        &,\n        &:hover:enabled,\n        &:active:enabled {\n          color: ", ";\n        }\n      "])), t.btnLinkDisabledColor);
+        },
+        focus: function (t) {
+            return emotion.css(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n        position: relative;\n        z-index: 2;\n\n        &,\n        &:hover:enabled,\n        &:active:enabled,\n        &:active:hover:enabled {\n          box-shadow:\n            inset 0 0 0 ", " ", ",\n            0 0 0 ", " ", " !important; // override root:hover style\n        }\n      "], ["\n        position: relative;\n        z-index: 2;\n\n        &,\n        &:hover:enabled,\n        &:active:enabled,\n        &:active:hover:enabled {\n          box-shadow:\n            inset 0 0 0 ", " ", ",\n            0 0 0 ", " ", " !important; // override root:hover style\n        }\n      "])), t.btnInsetWidth, t.btnOutlineColorFocus, t.btnFocusShadowWidth, t.btnBorderColorFocus);
+        },
+        disabled: function (t) {
+            return emotion.css(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n        cursor: default;\n        pointer-events: none;\n        box-shadow: 0 0 0 ", " ", ";\n\n        background-image: none;\n        background-color: ", ";\n        color: ", ";\n      "], ["\n        cursor: default;\n        pointer-events: none;\n        box-shadow: 0 0 0 ", " ", ";\n\n        background-image: none;\n        background-color: ", ";\n        color: ", ";\n      "])), t.btnBorderWidth, t.btnDisabledBorderColor, t.btnDisabledBg, t.btnDisabledTextColor);
+        },
+        disabledWithoutOutline: function (t) {
+            return emotion.css(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n        box-shadow: 0 0 0 ", " ", ";\n      "], ["\n        box-shadow: 0 0 0 ", " ", ";\n      "])), t.btnBorderWidth, t.btnDisabledBg);
+        },
+        arrowIconRoot: function () {
+            return emotion.css(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n        position: absolute;\n        height: 100%;\n        top: 0;\n        right: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        box-sizing: content-box;\n      "], ["\n        position: absolute;\n        height: 100%;\n        top: 0;\n        right: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        box-sizing: content-box;\n      "])));
+        },
+        arrowIconRootSmall: function (t) {
+            return emotion.css(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n        padding: 0 ", " 0 ", ";\n        width: ", ";\n      "], ["\n        padding: 0 ", " 0 ", ";\n        width: ", ";\n      "])), t.btnWithIconPaddingSmall, t.btnWithIconPaddingSmall, t.btnIconSizeSmall);
+        },
+        arrowIconRootMedium: function (t) {
+            return emotion.css(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n        padding: 0 ", " 0 ", ";\n        width: ", ";\n      "], ["\n        padding: 0 ", " 0 ", ";\n        width: ", ";\n      "])), t.btnWithIconPaddingMedium, t.btnWithIconPaddingMedium, t.btnIconSizeMedium);
+        },
+        arrowIconRootLarge: function (t) {
+            return emotion.css(templateObject_38 || (templateObject_38 = __makeTemplateObject(["\n        padding: 0 ", " 0 ", ";\n        width: ", ";\n      "], ["\n        padding: 0 ", " 0 ", ";\n        width: ", ";\n      "])), t.btnWithIconPaddingLarge, t.btnWithIconPaddingLarge, t.btnIconSizeLarge);
+        },
+        arrowIconLeft: function () {
+            return emotion.css(templateObject_39 || (templateObject_39 = __makeTemplateObject(["\n        left: 0;\n      "], ["\n        left: 0;\n      "])));
+        },
+        default: function (t) {
+            return emotion.css(templateObject_40 || (templateObject_40 = __makeTemplateObject(["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", ";\n        }\n      "], ["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", ";\n        }\n      "])), buttonUseMixin(t.btnDefaultBg, t.btnDefaultBgStart, t.btnDefaultBgEnd, t.btnDefaultTextColor, t.btnDefaultBorderColor, t.btnBorderWidth), buttonHoverMixin(t.btnDefaultHoverBg, t.btnDefaultHoverBgStart, t.btnDefaultHoverBgEnd, t.btnDefaultHoverTextColor, t.btnDefaultHoverBorderColor, t.btnBorderWidth), activeStyles.default(t));
+        },
+        accent: function (t) {
+            return emotion.css(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "], ["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "])), buttonUseMixin(t.btnPrimaryBg, t.btnPrimaryBgStart, t.btnPrimaryBgEnd, t.btnPrimaryTextColor, t.btnPrimaryBorderColor, t.btnBorderWidth), buttonHoverMixin(t.btnPrimaryHoverBg, t.btnPrimaryHoverBgStart, t.btnPrimaryHoverBgEnd, t.btnPrimaryHoverTextColor, t.btnPrimaryHoverBorderColor, t.btnBorderWidth), activeStyles.accent(t));
+        },
+        success: function (t) {
+            return emotion.css(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "], ["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "])), buttonUseMixin(t.btnSuccessBg, t.btnSuccessBgStart, t.btnSuccessBgEnd, t.btnSuccessTextColor, t.btnSuccessBorderColor, t.btnBorderWidth), buttonHoverMixin(t.btnSuccessHoverBg, t.btnSuccessHoverBgStart, t.btnSuccessHoverBgEnd, t.btnSuccessHoverTextColor, t.btnSuccessHoverBorderColor, t.btnBorderWidth), activeStyles.success(t));
+        },
+        danger: function (t) {
+            return emotion.css(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "], ["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "])), buttonUseMixin(t.btnDangerBg, t.btnDangerBgStart, t.btnDangerBgEnd, t.btnDangerTextColor, t.btnDangerBorderColor, t.btnBorderWidth), buttonHoverMixin(t.btnDangerHoverBg, t.btnDangerHoverBgStart, t.btnDangerHoverBgEnd, t.btnDangerHoverTextColor, t.btnDangerHoverBorderColor, t.btnBorderWidth), activeStyles.danger(t));
+        },
+        pay: function (t) {
+            return emotion.css(templateObject_44 || (templateObject_44 = __makeTemplateObject(["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "], ["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "])), buttonUseMixin(t.btnPayBg, t.btnPayBgStart, t.btnPayBgEnd, t.btnPayTextColor, t.btnPayBorderColor, t.btnBorderWidth), buttonHoverMixin(t.btnPayHoverBg, t.btnPayHoverBgStart, t.btnPayHoverBgEnd, t.btnPayHoverTextColor, t.btnPayHoverBorderColor, t.btnBorderWidth), activeStyles.pay(t));
+        },
+        text: function (t) {
+            return emotion.css(templateObject_45 || (templateObject_45 = __makeTemplateObject(["\n        &,\n        &:enabled,\n        &:hover {\n          box-shadow: none;\n        }\n\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "], ["\n        &,\n        &:enabled,\n        &:hover {\n          box-shadow: none;\n        }\n\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "])), buttonUseMixin(t.btnTextBg, '', '', t.btnTextTextColor, t.btnTextBorderColor, t.btnBorderWidth), buttonHoverMixin(t.btnTextHoverBg, '', '', t.btnTextHoverTextColor, t.btnTextHoverBorderColor, t.btnBorderWidth), activeStyles.text(t));
+        },
+        outline: function (t) {
+            return emotion.css(templateObject_46 || (templateObject_46 = __makeTemplateObject(["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "], ["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", "\n        }\n      "])), buttonUseMixin(t.btnBacklessBg, '', '', t.btnBacklessTextColor, t.btnBacklessBorderColor, t.btnBorderWidth), buttonHoverMixin(t.btnBacklessHoverBg, '', '', t.btnBacklessHoverTextColor, t.btnBacklessHoverBorderColor, t.btnBorderWidth), activeStyles.outline(t));
+        },
+        fill: function (t) {
+            return emotion.css(templateObject_47 || (templateObject_47 = __makeTemplateObject(["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", ";\n        }\n      "], ["\n        ", ";\n\n        &:hover {\n          ", ";\n        }\n\n        &:active {\n          ", ";\n        }\n      "])), buttonUseMixin(t.btnFillBg, '', '', t.btnDefaultTextColor, '', ''), buttonHoverMixin(t.btnFillHoverBg, '', '', t.btnDefaultHoverTextColor, '', ''), activeStyles.fill(t));
+        },
+        checked: function (t) {
+            var checkedStyles = "\n      background-image: none;\n      box-shadow: 0 0 0 ".concat(t.btnBorderWidth, " ").concat(t.btnDefaultCheckedBorderColor, " !important;\n      background-color: ").concat(t.btnCheckedBg, " !important;\n      color: ").concat(t.btnCheckedTextColor, " !important;\n\n      .").concat(globalClasses.innerShadow, " {\n        box-shadow: ").concat(t.btnCheckedShadow, ";\n      }\n\n      :enabled svg {\n        color: ").concat(t.btnCheckedTextColor, " !important;\n      }\n      :hover:enabled svg {\n        color: ").concat(t.btnCheckedTextColor, " !important;\n      }\n    ");
+            return emotion.css(templateObject_48 || (templateObject_48 = __makeTemplateObject(["\n        ", "\n\n        &:hover:enabled,\n      &:active:enabled,\n      &:hover:active:enabled {\n          ", "\n        }\n      "], ["\n        ", "\n\n        &:hover:enabled,\n      &:active:enabled,\n      &:hover:active:enabled {\n          ", "\n        }\n      "])), checkedStyles, checkedStyles);
+        },
+        checkedFocused: function (t) {
+            return emotion.css(templateObject_49 || (templateObject_49 = __makeTemplateObject(["\n        &:hover:enabled,\n        &:hover:active:enabled {\n          box-shadow:\n            inset 0 0 0 ", " ", ",\n            0 0 0 ", " ", " !important;\n          border-color: ", " !important;\n        }\n      "], ["\n        &:hover:enabled,\n        &:hover:active:enabled {\n          box-shadow:\n            inset 0 0 0 ", " ", ",\n            0 0 0 ", " ", " !important;\n          border-color: ", " !important;\n        }\n      "])), t.btnInsetWidth, t.btnOutlineColorFocus, t.btnFocusShadowWidth, t.btnBorderColorFocus, t.btnBorderColorFocus);
+        },
+        checkedDisabled: function (t) {
+            return emotion.css(templateObject_50 || (templateObject_50 = __makeTemplateObject(["\n        box-shadow: 0 0 0 ", " ", ";\n        background-color: ", ";\n        color: ", ";\n\n        .", " {\n          box-shadow: ", ";\n        }\n\n        svg {\n          color: ", " !important;\n        }\n      "], ["\n        box-shadow: 0 0 0 ", " ", ";\n        background-color: ", ";\n        color: ", ";\n\n        .", " {\n          box-shadow: ", ";\n        }\n\n        svg {\n          color: ", " !important;\n        }\n      "])), t.btnBorderWidth, t.btnCheckedDisabledBorderColor, t.btnCheckedDisabledBg, t.btnCheckedDisabledColor, globalClasses.innerShadow, t.btnCheckedDisabledShadow, t.btnCheckedDisabledColor);
+        },
+        caption: function () {
+            return emotion.css(templateObject_51 || (templateObject_51 = __makeTemplateObject(["\n        position: relative;\n        white-space: nowrap;\n        display: inline-block;\n        width: 100%;\n        vertical-align: top;\n      "], ["\n        position: relative;\n        white-space: nowrap;\n        display: inline-block;\n        width: 100%;\n        vertical-align: top;\n      "])));
+        },
+        captionLink: function () {
+            return emotion.css(templateObject_52 || (templateObject_52 = __makeTemplateObject(["\n        display: inline;\n        transform: none !important; // override root:active style\n      "], ["\n        display: inline;\n        transform: none !important; // override root:active style\n      "])));
+        },
+        captionDisabled: function () {
+            return emotion.css(templateObject_53 || (templateObject_53 = __makeTemplateObject(["\n        transform: none !important; // override root:active style\n      "], ["\n        transform: none !important; // override root:active style\n      "])));
+        },
+        wrap: function (t) {
+            return emotion.css(templateObject_54 || (templateObject_54 = __makeTemplateObject(["\n        box-sizing: border-box;\n        display: inline-block;\n        line-height: normal;\n        padding: ", ";\n      "], ["\n        box-sizing: border-box;\n        display: inline-block;\n        line-height: normal;\n        padding: ", ";\n      "])), t.btnBorderWidth);
+        },
+        wrapSmall: function (t) {
+            return emotion.css(templateObject_55 || (templateObject_55 = __makeTemplateObject(["\n        height: ", ";\n      "], ["\n        height: ", ";\n      "])), t.btnHeightSmall);
+        },
+        wrapMedium: function (t) {
+            return emotion.css(templateObject_56 || (templateObject_56 = __makeTemplateObject(["\n        height: ", ";\n      "], ["\n        height: ", ";\n      "])), t.btnHeightMedium);
+        },
+        wrapLarge: function (t) {
+            return emotion.css(templateObject_57 || (templateObject_57 = __makeTemplateObject(["\n        height: ", ";\n      "], ["\n        height: ", ";\n      "])), t.btnHeightLarge);
+        },
+        /** @deprecated */
+        narrow: function () {
+            return emotion.css(templateObject_58 || (templateObject_58 = __makeTemplateObject(["\n        padding-left: 5px;\n        padding-right: 5px;\n      "], ["\n        padding-left: 5px;\n        padding-right: 5px;\n      "])));
+        },
+        noPadding: function () {
+            return emotion.css(templateObject_59 || (templateObject_59 = __makeTemplateObject(["\n        padding-left: 0;\n        padding-right: 0;\n      "], ["\n        padding-left: 0;\n        padding-right: 0;\n      "])));
+        },
+        noRightPadding: function () {
+            return emotion.css(templateObject_60 || (templateObject_60 = __makeTemplateObject(["\n        padding-right: 0;\n      "], ["\n        padding-right: 0;\n      "])));
+        },
+        wrapLink: function () {
+            return emotion.css(templateObject_61 || (templateObject_61 = __makeTemplateObject(["\n        padding: 0;\n      "], ["\n        padding: 0;\n      "])));
+        },
+        /** @deprecated */
+        borderless: function () {
+            return emotion.css(templateObject_62 || (templateObject_62 = __makeTemplateObject(["\n        &,\n        &:active:hover,\n        &:hover {\n          box-shadow: none !important; // override root:hover style\n        }\n      "], ["\n        &,\n        &:active:hover,\n        &:hover {\n          box-shadow: none !important; // override root:hover style\n        }\n      "])));
+        },
+        backlessDisabled: function (t) {
+            return emotion.css(templateObject_63 || (templateObject_63 = __makeTemplateObject(["\n        box-shadow: 0 0 0 1px ", ";\n        background-color: transparent;\n      "], ["\n        box-shadow: 0 0 0 1px ", ";\n        background-color: transparent;\n      "])), t.btnBacklessDisabledBorderColor);
+        },
+        textDisabled: function () {
+            return emotion.css(templateObject_64 || (templateObject_64 = __makeTemplateObject(["\n        background-color: transparent;\n      "], ["\n        background-color: transparent;\n      "])));
+        },
+        loading: function () {
+            return emotion.css(templateObject_65 || (templateObject_65 = __makeTemplateObject(["\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n        border-radius: inherit;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 10;\n      "], ["\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n        border-radius: inherit;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 10;\n      "])));
+        },
+        visibilityHidden: function () {
+            return emotion.css(templateObject_66 || (templateObject_66 = __makeTemplateObject(["\n        visibility: hidden;\n      "], ["\n        visibility: hidden;\n      "])));
+        },
+    };
 });
-export var getStyles = staticStyles({
-    root: 'react-ui-Button-root',
-    simulatedPress: 'react-ui-Button-simulatedPress',
-    outlineDefault: 'react-ui-Button-outlineDefault',
-    outlineWarning: 'react-ui-Button-outlineWarning',
-    outlineError: 'react-ui-Button-outlineError',
-    outlineLink: 'react-ui-Button-outlineLink',
-    outlineLinkWarning: 'react-ui-Button-outlineLinkWarning',
-    outlineLinkError: 'react-ui-Button-outlineLinkError',
-    sizeSmall: 'react-ui-Button-sizeSmall',
-    sizeMedium: 'react-ui-Button-sizeMedium',
-    sizeLarge: 'react-ui-Button-sizeLarge',
-    sizeSmallWithIcon: 'react-ui-Button-sizeSmallWithIcon',
-    sizeMediumWithIcon: 'react-ui-Button-sizeMediumWithIcon',
-    sizeLargeWithIcon: 'react-ui-Button-sizeLargeWithIcon',
-    sizeSmallWithRightIcon: 'react-ui-Button-sizeSmallWithRightIcon',
-    sizeMediumWithRightIcon: 'react-ui-Button-sizeMediumWithRightIcon',
-    sizeLargeWithRightIcon: 'react-ui-Button-sizeLargeWithRightIcon',
-    sizeSmallWithIconWithoutText: 'react-ui-Button-sizeSmallWithIconWithoutText',
-    sizeMediumWithIconWithoutText: 'react-ui-Button-sizeMediumWithIconWithoutText',
-    sizeLargeWithIconWithoutText: 'react-ui-Button-sizeLargeWithIconWithoutText',
-    link: 'react-ui-Button-link',
-    linkLineHeight: 'react-ui-Button-linkLineHeight',
-    linkLineHeightSafariFallback: 'react-ui-Button-linkLineHeightSafariFallback',
-    arrowIconRoot: 'react-ui-Button-arrowIconRoot',
-    arrowIconRootSmall: 'react-ui-Button-arrowIconRootSmall',
-    arrowIconRootMedium: 'react-ui-Button-arrowIconRootMedium',
-    arrowIconRootLarge: 'react-ui-Button-arrowIconRootLarge',
-    arrowIconLeft: 'react-ui-Button-arrowIconLeft',
-    default: 'react-ui-Button-default',
-    defaultGradient: 'react-ui-Button-defaultGradient',
-    defaultHoverGradient: 'react-ui-Button-defaultHoverGradient',
-    defaultHoverBorderAboveBg: 'react-ui-Button-defaultHoverBorderAboveBg',
-    defaultActiveBorderAboveBg: 'react-ui-Button-defaultActiveBorderAboveBg',
-    accent: 'react-ui-Button-accent',
-    accentGradient: 'react-ui-Button-accentGradient',
-    accentHoverGradient: 'react-ui-Button-accentHoverGradient',
-    accentHoverBorderAboveBg: 'react-ui-Button-accentHoverBorderAboveBg',
-    accentActiveBorderAboveBg: 'react-ui-Button-accentActiveBorderAboveBg',
-    success: 'react-ui-Button-success',
-    successGradient: 'react-ui-Button-successGradient',
-    successHoverGradient: 'react-ui-Button-successHoverGradient',
-    successHoverBorderAboveBg: 'react-ui-Button-successHoverBorderAboveBg',
-    successActiveBorderAboveBg: 'react-ui-Button-successActiveBorderAboveBg',
-    danger: 'react-ui-Button-danger',
-    dangerGradient: 'react-ui-Button-dangerGradient',
-    dangerHoverGradient: 'react-ui-Button-dangerHoverGradient',
-    dangerHoverBorderAboveBg: 'react-ui-Button-dangerHoverBorderAboveBg',
-    dangerActiveBorderAboveBg: 'react-ui-Button-dangerActiveBorderAboveBg',
-    pay: 'react-ui-Button-pay',
-    payGradient: 'react-ui-Button-payGradient',
-    payHoverGradient: 'react-ui-Button-payHoverGradient',
-    payHoverBorderAboveBg: 'react-ui-Button-payHoverBorderAboveBg',
-    payActiveBorderAboveBg: 'react-ui-Button-payActiveBorderAboveBg',
-    text: 'react-ui-Button-text',
-    textHoverBorderAboveBg: 'react-ui-Button-textHoverBorderAboveBg',
-    outline: 'react-ui-Button-outline',
-    outlineHoverBorderAboveBg: 'react-ui-Button-outlineHoverBorderAboveBg',
-    outlineActiveBorderAboveBg: 'react-ui-Button-outlineActiveBorderAboveBg',
-    fill: 'react-ui-Button-fill',
-    caption: 'react-ui-Button-caption',
-    captionLink: 'react-ui-Button-captionLink',
-    captionDisabled: 'react-ui-Button-captionDisabled',
-    wrap: 'react-ui-Button-wrap',
-    wrapSmall: 'react-ui-Button-wrapSmall',
-    wrapMedium: 'react-ui-Button-wrapMedium',
-    wrapLarge: 'react-ui-Button-wrapLarge',
-    narrow: 'react-ui-Button-narrow',
-    noPadding: 'react-ui-Button-noPadding',
-    noRightPadding: 'react-ui-Button-noRightPadding',
-    wrapLink: 'react-ui-Button-wrapLink',
-    borderless: 'react-ui-Button-borderless',
-    visibilityHidden: 'react-ui-Button-visibilityHidden',
-    withArrowIconRightSmall: 'react-ui-Button-withArrowIconRightSmall',
-    withArrowIconRightMedium: 'react-ui-Button-withArrowIconRightMedium',
-    withArrowIconRightLarge: 'react-ui-Button-withArrowIconRightLarge',
-    withArrowIconLeftSmall: 'react-ui-Button-withArrowIconLeftSmall',
-    withArrowIconLeftMedium: 'react-ui-Button-withArrowIconLeftMedium',
-    withArrowIconLeftLarge: 'react-ui-Button-withArrowIconLeftLarge',
-    focus: 'react-ui-Button-focus',
-    linkFocus: 'react-ui-Button-linkFocus',
-    checked: 'react-ui-Button-checked',
-    checkedFocused: 'react-ui-Button-checkedFocused',
-    disabled: 'react-ui-Button-disabled',
-    disabledWithoutOutline: 'react-ui-Button-disabledWithoutOutline',
-    linkDisabled: 'react-ui-Button-linkDisabled',
-    checkedDisabled: 'react-ui-Button-checkedDisabled',
-    backlessDisabled: 'react-ui-Button-backlessDisabled',
-    textDisabled: 'react-ui-Button-textDisabled',
-    loading: 'react-ui-Button-loading',
+export var getActiveStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        default: function (t) {
+            return css(templateObject_67 || (templateObject_67 = __makeTemplateObject(["\n      & {\n        ", ";\n      }\n    "], ["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin(t.btnDefaultActiveBg, t.btnDefaultActiveShadow, t.btnDefaultActiveBorderColor, t.btnBorderWidth));
+        },
+        accent: function (t) {
+            return css(templateObject_68 || (templateObject_68 = __makeTemplateObject(["\n      & {\n        ", ";\n      }\n    "], ["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin(t.btnPrimaryActiveBg, t.btnPrimaryActiveShadow, t.btnPrimaryActiveBorderColor, t.btnBorderWidth));
+        },
+        success: function (t) {
+            return css(templateObject_69 || (templateObject_69 = __makeTemplateObject(["\n      & {\n        ", ";\n      }\n    "], ["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin(t.btnSuccessActiveBg, t.btnSuccessActiveShadow, t.btnSuccessActiveBorderColor, t.btnBorderWidth));
+        },
+        danger: function (t) {
+            return css(templateObject_70 || (templateObject_70 = __makeTemplateObject(["\n      & {\n        ", ";\n      }\n    "], ["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin(t.btnDangerActiveBg, t.btnDangerActiveShadow, t.btnDangerActiveBorderColor, t.btnBorderWidth));
+        },
+        pay: function (t) {
+            return css(templateObject_71 || (templateObject_71 = __makeTemplateObject(["\n      & {\n        ", ";\n      }\n    "], ["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin(t.btnPayActiveBg, t.btnPayActiveShadow, t.btnPayActiveBorderColor, t.btnBorderWidth));
+        },
+        link: function (t) {
+            return css(templateObject_72 || (templateObject_72 = __makeTemplateObject(["\n      & {\n        color: ", ";\n      }\n    "], ["\n      & {\n        color: ", ";\n      }\n    "])), t.btnLinkActiveColor);
+        },
+        text: function (t) {
+            return css(templateObject_73 || (templateObject_73 = __makeTemplateObject(["\n      & {\n        ", ";\n      }\n    "], ["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin(t.btnTextActiveBg, '', t.btnTextActiveBg, t.btnBorderWidth));
+        },
+        outline: function (t) {
+            return css(templateObject_74 || (templateObject_74 = __makeTemplateObject(["\n      & {\n        ", ";\n      }\n    "], ["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin(t.btnBacklessActiveBg, '', t.btnBacklessActiveBorderColor, t.btnBorderWidth));
+        },
+        fill: function (t) {
+            return css(templateObject_75 || (templateObject_75 = __makeTemplateObject(["\n      & {\n        ", ";\n      }\n    "], ["\n      & {\n        ", ";\n      }\n    "])), buttonActiveMixin(t.btnFillActiveBg, '', '', ''));
+        },
+    });
 });
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46, templateObject_47, templateObject_48, templateObject_49, templateObject_50, templateObject_51, templateObject_52, templateObject_53, templateObject_54, templateObject_55, templateObject_56, templateObject_57, templateObject_58, templateObject_59, templateObject_60, templateObject_61, templateObject_62, templateObject_63, templateObject_64, templateObject_65, templateObject_66, templateObject_67, templateObject_68, templateObject_69, templateObject_70, templateObject_71, templateObject_72, templateObject_73, templateObject_74, templateObject_75;
 //# sourceMappingURL=Button.styles.js.map