@skbkontur/react-ui 5.6.1-85c65.0 → 5.6.1-e2bc4.0

package/internal/themes/BasicTheme/BasicTheme.js

@@ -1,3689 +0,0 @@
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-var _BasicThemeClass;
-import * as colors from '@skbkontur/colors/default-light';
-import { createTheme } from "../../../lib/theming/ThemeHelpers";
-export var BasicThemeClass = /*#__PURE__*/function () {
-  function BasicThemeClass() {}
-  return _createClass(BasicThemeClass, null, [{
-    key: "bgSecondary",
-    get: function get() {
-      return this.bgDefault;
-    }
-  }, {
-    key: "errorMain",
-    get: function get() {
-      return this.red;
-    }
-  }, {
-    key: "errorText",
-    get: function get() {
-      return this.redDark;
-    }
-  }, {
-    key: "errorSecondary",
-    get: function get() {
-      return this.redXxLight;
-    }
-  }, {
-    key: "borderColorError",
-    get: function get() {
-      return this.errorMain;
-    }
-  }, {
-    key: "borderColorWarning",
-    get: function get() {
-      return this.warningMain;
-    }
-  }, {
-    key: "linkHoverColor",
-    get: function get() {
-      return this.linkColor;
-    }
-  }, {
-    key: "linkSuccessColor",
-    get: function get() {
-      return this.green;
-    }
-  }, {
-    key: "linkSuccessHoverColor",
-    get: function get() {
-      return this.greenDark;
-    }
-  }, {
-    key: "linkDangerColor",
-    get: function get() {
-      return this.errorText;
-    }
-  }, {
-    key: "linkDisabledColor",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "linkHoverTextDecorationStyle",
-    get: function get() {
-      return this.linkTextDecorationStyle;
-    }
-  }, {
-    key: "linkLineHoverBorderBottomStyle",
-    get: function get() {
-      return this.linkLineBorderBottomStyle;
-    }
-  }, {
-    key: "linkFocusOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "linkFocusOutline",
-    get: function get() {
-      return this.linkFocusOutlineWidth + " solid " + this.linkFocusOutlineColor;
-    }
-
-    //#endregion Link
-    //#region Token
-  }, {
-    key: "tokenTextColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "tokenFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "tokenFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "tokenFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "tokenLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "tokenLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "tokenLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "tokenBorderColorWarning",
-    get: function get() {
-      return this.borderColorWarning;
-    }
-  }, {
-    key: "tokenBorderColorError",
-    get: function get() {
-      return this.borderColorError;
-    }
-  }, {
-    key: "tokenPaddingYDisabled",
-    get: function get() {
-      return this.tokenPaddingYSmall;
-    }
-  }, {
-    key: "tokenPaddingXDisabled",
-    get: function get() {
-      return this.tokenPaddingXSmall;
-    }
-  }, {
-    key: "tokenMarginYDisabled",
-    get: function get() {
-      return this.tokenMarginYSmall;
-    }
-  }, {
-    key: "tokenMarginXDisabled",
-    get: function get() {
-      return this.tokenMarginXSmall;
-    }
-  }, {
-    key: "tokenColorHover",
-    get: function get() {
-      return this.tokenColor;
-    }
-  }, {
-    key: "tokenInputLineHeightSmall",
-    get:
-    //#endregion Token
-    //#region TokenInput
-
-    function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "tokenInputLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "tokenInputLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "tokenInputBorderColor",
-    get: function get() {
-      return this.inputBorderColor;
-    }
-  }, {
-    key: "tokenInputBorderColorHover",
-    get: function get() {
-      return this.inputBorderColorHover;
-    }
-  }, {
-    key: "tokenInputBorderColorFocus",
-    get: function get() {
-      return this.inputBorderColorFocus;
-    }
-  }, {
-    key: "tokenInputBorderColorError",
-    get: function get() {
-      return this.inputBorderColorError;
-    }
-  }, {
-    key: "tokenInputBorderColorWarning",
-    get: function get() {
-      return this.inputBorderColorWarning;
-    }
-  }, {
-    key: "tokenInputBorderTopColor",
-    get: function get() {
-      return this.inputBorderTopColor;
-    }
-  }, {
-    key: "tokenInputPlaceholderColor",
-    get: function get() {
-      return this.inputPlaceholderColor;
-    }
-  }, {
-    key: "tokenInputPlaceholderColorLight",
-    get: function get() {
-      return this.inputPlaceholderColorLight;
-    }
-  }, {
-    key: "tokenInputDisabledBg",
-    get: function get() {
-      return this.inputDisabledBg;
-    }
-  }, {
-    key: "tokenInputDisabledBorderColor",
-    get: function get() {
-      return this.inputDisabledBorderColor;
-    }
-  }, {
-    key: "tokenInputBorderWidth",
-    get: function get() {
-      return this.inputBorderWidth;
-    }
-  }, {
-    key: "tokenInputOutlineWidth",
-    get: function get() {
-      return this.inputOutlineWidth;
-    }
-  }, {
-    key: "tokenInputBg",
-    get: function get() {
-      return this.inputBg;
-    }
-  }, {
-    key: "tokenInputShadow",
-    get: function get() {
-      return this.inputShadow;
-    }
-  }, {
-    key: "tokenInputTextColor",
-    get: function get() {
-      return this.inputTextColor;
-    }
-  }, {
-    key: "tokenInputTextColorDisabled",
-    get: function get() {
-      return this.textColorDisabledContrast;
-    }
-  }, {
-    key: "tokenInputPlaceholderColorDisabled",
-    get: function get() {
-      return this.textColorDisabledContrast;
-    }
-  }, {
-    key: "btnCheckedDisabledBorderColor",
-    get: function get() {
-      return this.btnCheckedDisabledBg;
-    }
-  }, {
-    key: "btnBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "btnOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "btnIconGapSmallRight",
-    get: function get() {
-      return this.btnIconGapSmallLeft;
-    }
-  }, {
-    key: "btnIconGapMediumRight",
-    get: function get() {
-      return this.btnIconGapMediumLeft;
-    }
-  }, {
-    key: "btnIconGapLargeRight",
-    get: function get() {
-      return this.btnIconGapLargeLeft;
-    }
-  }, {
-    key: "btnDefaultCheckedBorderColor",
-    get: function get() {
-      return this.btnCheckedBg;
-    }
-  }, {
-    key: "btnDefaultTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "btnDefaultHoverBorderColor",
-    get: function get() {
-      return this.btnDefaultBorderColor;
-    }
-  }, {
-    key: "btnDefaultActiveBorderColor",
-    get: function get() {
-      return this.btnDefaultBorderColor;
-    }
-  }, {
-    key: "btnSuccessBorderColor",
-    get: function get() {
-      return this.btnSuccessBg;
-    }
-  }, {
-    key: "btnSuccessHoverBorderColor",
-    get: function get() {
-      return this.btnSuccessHoverBg;
-    }
-  }, {
-    key: "btnSuccessActiveBorderColor",
-    get: function get() {
-      return this.btnSuccessActiveBg;
-    }
-  }, {
-    key: "btnPrimaryBorderColor",
-    get: function get() {
-      return this.btnPrimaryBg;
-    }
-  }, {
-    key: "btnPrimaryHoverBorderColor",
-    get: function get() {
-      return this.btnPrimaryHoverBg;
-    }
-  }, {
-    key: "btnPrimaryActiveBorderColor",
-    get: function get() {
-      return this.btnPrimaryActiveBg;
-    }
-  }, {
-    key: "btnDangerBg",
-    get: function get() {
-      return this.errorMain;
-    }
-  }, {
-    key: "btnDangerBorderColor",
-    get: function get() {
-      return this.btnDangerBg;
-    }
-  }, {
-    key: "btnDangerHoverBorderColor",
-    get: function get() {
-      return this.btnDangerHoverBg;
-    }
-  }, {
-    key: "btnDangerActiveBorderColor",
-    get: function get() {
-      return this.btnDangerActiveBg;
-    }
-  }, {
-    key: "btnPayHoverBorderColor",
-    get: function get() {
-      return this.btnPayHoverBg;
-    }
-  }, {
-    key: "btnPayBorderColor",
-    get: function get() {
-      return this.btnPayBg;
-    }
-  }, {
-    key: "btnPayTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "btnPayActiveBorderColor",
-    get: function get() {
-      return this.btnPayActiveBg;
-    }
-  }, {
-    key: "btnFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "btnFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "btnFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "btnLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "btnLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "btnLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "btnPaddingYSmall",
-    get: function get() {
-      return this.controlPaddingYSmall;
-    }
-  }, {
-    key: "btnPaddingYMedium",
-    get: function get() {
-      return this.controlPaddingYMedium;
-    }
-  }, {
-    key: "btnPaddingYLarge",
-    get: function get() {
-      return this.controlPaddingYLarge;
-    }
-  }, {
-    key: "btnBorderColorWarning",
-    get: function get() {
-      return this.borderColorWarning;
-    }
-  }, {
-    key: "btnBorderColorError",
-    get: function get() {
-      return this.borderColorError;
-    }
-  }, {
-    key: "btnHeightSmall",
-    get: function get() {
-      var borderWidth = parseInt(this.btnBorderWidth, 10) || 0;
-      var padding = parseInt(this.btnPaddingYSmall, 10) || 0;
-      var lineHeigh = parseInt(this.btnLineHeightSmall, 10) || 0;
-      return 2 * borderWidth + 2 * padding + lineHeigh + "px";
-    }
-  }, {
-    key: "btnHeightMedium",
-    get: function get() {
-      var borderWidth = parseInt(this.btnBorderWidth, 10) || 0;
-      var padding = parseInt(this.btnPaddingYMedium, 10) || 0;
-      var lineHeigh = parseInt(this.btnLineHeightMedium, 10) || 0;
-      return 2 * borderWidth + 2 * padding + lineHeigh + "px";
-    }
-  }, {
-    key: "btnHeightLarge",
-    get: function get() {
-      var borderWidth = parseInt(this.btnBorderWidth, 10) || 0;
-      var padding = parseInt(this.btnPaddingYLarge, 10) || 0;
-      var lineHeigh = parseInt(this.btnLineHeightLarge, 10) || 0;
-      return 2 * borderWidth + 2 * padding + lineHeigh + "px";
-    }
-  }, {
-    key: "btnLinkColor",
-    get: function get() {
-      return this.linkColor;
-    }
-  }, {
-    key: "btnLinkHoverColor",
-    get: function get() {
-      return this.linkHoverColor;
-    }
-  }, {
-    key: "btnLinkActiveColor",
-    get: function get() {
-      return this.linkActiveColor;
-    }
-  }, {
-    key: "btnLinkHoverTextDecoration",
-    get: function get() {
-      return this.linkHoverTextDecoration;
-    }
-  }, {
-    key: "btnLinkTextDecorationColor",
-    get: function get() {
-      return this.linkTextDecorationColor;
-    }
-  }, {
-    key: "btnLinkTextDecorationStyle",
-    get: function get() {
-      return this.linkTextDecorationStyle;
-    }
-  }, {
-    key: "btnLinkHoverTextDecorationStyle",
-    get: function get() {
-      return this.linkTextDecorationStyle;
-    }
-  }, {
-    key: "btnLinkTextUnderlineOffset",
-    get: function get() {
-      return this.linkTextUnderlineOffset;
-    }
-  }, {
-    key: "btnLinkTextDecorationThickness",
-    get: function get() {
-      return this.linkTextDecorationThickness;
-    }
-  }, {
-    key: "btnLinkTextUnderlineOpacity",
-    get: function get() {
-      return this.linkTextUnderlineOpacity;
-    }
-  }, {
-    key: "btnLinkLineBorderBottomStyle",
-    get: function get() {
-      return this.linkLineBorderBottomStyle;
-    }
-  }, {
-    key: "btnLinkHoverLineBorderBottomStyle",
-    get: function get() {
-      return this.btnLinkLineBorderBottomStyle;
-    }
-  }, {
-    key: "btnLinkLineBorderBottomWidth",
-    get: function get() {
-      return this.linkLineBorderBottomWidth;
-    }
-  }, {
-    key: "btnLinkLineBorderBottomOpacity",
-    get: function get() {
-      return this.linkLineBorderBottomOpacity;
-    }
-  }, {
-    key: "btnLinkIconMarginRight",
-    get: function get() {
-      return this.linkIconMarginRight;
-    }
-  }, {
-    key: "btnLinkIconMarginLeft",
-    get: function get() {
-      return this.linkIconMarginRight;
-    }
-  }, {
-    key: "btnErrorSecondary",
-    get: function get() {
-      return this.errorSecondary;
-    }
-  }, {
-    key: "btnWarningSecondary",
-    get: function get() {
-      return this.warningSecondary;
-    }
-  }, {
-    key: "btnOutlineColorFocus",
-    get: function get() {
-      return this.outlineColorFocus;
-    }
-  }, {
-    key: "btnBorderColorFocus",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "btnLinkDisabledColor",
-    get: function get() {
-      return this.linkDisabledColor;
-    }
-  }, {
-    key: "btnDisabledTextColor",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "btnBacklessActiveBorderColor",
-    get: function get() {
-      return this.btnBacklessBorderColor;
-    }
-  }, {
-    key: "btnBacklessBorderColor",
-    get: function get() {
-      return this.btnDefaultBorderColor;
-    }
-  }, {
-    key: "btnBacklessDisabledBorderColor",
-    get: function get() {
-      return this.btnDisabledBorderColor;
-    }
-  }, {
-    key: "btnBacklessHoverBorderColor",
-    get: function get() {
-      return this.btnBacklessBorderColor;
-    }
-  }, {
-    key: "btnBacklessTextColor",
-    get: function get() {
-      return this.btnDefaultTextColor;
-    }
-  }, {
-    key: "btnTextBorderColor",
-    get: function get() {
-      return this.btnDefaultBorderColor;
-    }
-  }, {
-    key: "btnTextTextColor",
-    get: function get() {
-      return this.btnDefaultTextColor;
-    }
-  }, {
-    key: "btnTextHoverBorderColor",
-    get: function get() {
-      return this.btnTextHoverBg;
-    }
-  }, {
-    key: "btnWithIconPaddingLeftMedium",
-    get: function get() {
-      return this.btnWithIconPaddingMedium;
-    }
-  }, {
-    key: "btnWithIconPaddingLeftLarge",
-    get: function get() {
-      return this.btnWithIconPaddingLarge;
-    }
-  }, {
-    key: "selectDefaultBg",
-    get:
-    //#endregion Button
-    //#region Select
-    function get() {
-      return this.inputBg;
-    }
-  }, {
-    key: "selectBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "selectPlaceholderColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "selectOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "selectLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "selectFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "selectPaddingYSmall",
-    get: function get() {
-      return this.controlPaddingYSmall;
-    }
-  }, {
-    key: "selectBorderRadiusSmall",
-    get: function get() {
-      return this.inputBorderRadiusSmall;
-    }
-  }, {
-    key: "selectBorderRadiusMedium",
-    get: function get() {
-      return this.inputBorderRadiusMedium;
-    }
-  }, {
-    key: "selectBorderRadiusLarge",
-    get: function get() {
-      return this.inputBorderRadiusLarge;
-    }
-  }, {
-    key: "selectIconGapSmall",
-    get: function get() {
-      return this.inputIconGapSmall;
-    }
-  }, {
-    key: "selectIconGapMedium",
-    get: function get() {
-      return this.inputIconGapMedium;
-    }
-  }, {
-    key: "selectIconGapLarge",
-    get: function get() {
-      return this.inputIconGapLarge;
-    }
-  }, {
-    key: "selectLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "selectFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "selectPaddingYMedium",
-    get: function get() {
-      return this.controlPaddingYMedium;
-    }
-  }, {
-    key: "selectLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "selectFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "selectPaddingYLarge",
-    get: function get() {
-      return this.controlPaddingYLarge;
-    }
-  }, {
-    key: "selectMenuArrowColor",
-    get: function get() {
-      return this.btnMenuArrowColor;
-    }
-  }, {
-    key: "selectMenuArrowColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "selectIconSizeSmall",
-    get: function get() {
-      return this.btnIconSizeSmall;
-    }
-  }, {
-    key: "selectIconSizeMedium",
-    get: function get() {
-      return this.btnIconSizeMedium;
-    }
-  }, {
-    key: "selectIconSizeLarge",
-    get: function get() {
-      return this.btnIconSizeLarge;
-    }
-  }, {
-    key: "selectTextColorDisabled",
-    get: function get() {
-      return this.btnDisabledTextColor;
-    }
-  }, {
-    key: "selectBgDisabled",
-    get: function get() {
-      return this.inputDisabledBg;
-    }
-  }, {
-    key: "selectBorderColorDisabled",
-    get: function get() {
-      return this.btnDisabledBorderColor;
-    }
-  }, {
-    key: "selectMenuOffsetY",
-    get: function get() {
-      return this.menuOffsetY;
-    }
-  }, {
-    key: "selectBorderColorHover",
-    get: function get() {
-      return this.btnDefaultHoverBorderColor;
-    }
-  }, {
-    key: "tooltipCloseBtnColor",
-    get: function get() {
-      return this.closeGrayColor;
-    }
-  }, {
-    key: "tooltipTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "tooltipBorder",
-    get: function get() {
-      return this.popupBorder;
-    }
-  }, {
-    key: "tooltipFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "tooltipFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "tooltipFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "tooltipLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "tooltipLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "tooltipLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-    //#endregion Tooltip
-    //#region TooltipMenu
-  }, {
-    key: "tooltipMenuPinOffsetX",
-    get: function get() {
-      return this.tooltipPinOffsetXSmall;
-    }
-  }, {
-    key: "tooltipMenuPinOffsetY",
-    get: function get() {
-      return this.tooltipPinOffsetYSmall;
-    }
-  }, {
-    key: "tooltipMenuMargin",
-    get: function get() {
-      return this.popupMargin;
-    }
-  }, {
-    key: "tooltipMenuPinSize",
-    get: function get() {
-      return this.popupPinSize;
-    }
-
-    //#endregion
-    //#region Kebab
-  }, {
-    key: "modalBg",
-    get: function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "modalCloseButtonColor",
-    get: function get() {
-      return this.closeGrayColor;
-    }
-  }, {
-    key: "modalFixedHeaderBg",
-    get: function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "modalFixedHeaderShadow",
-    get: function get() {
-      return this.fixedPanelShadow;
-    }
-  }, {
-    key: "modalFixedFooterShadow",
-    get: function get() {
-      return this.fixedPanelShadow;
-    }
-  }, {
-    key: "modalFooterBg",
-    get: function get() {
-      return this.modalBg;
-    }
-  }, {
-    key: "modalHeaderTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "modalHeaderAdditionalPaddingBottom",
-    get: function get() {
-      return this.modalHeaderPaddingBottom;
-    }
-  }, {
-    key: "modalFixedHeaderPaddingBottom",
-    get: function get() {
-      return this.modalHeaderPaddingBottom;
-    }
-  }, {
-    key: "modalFixedFooterPaddingTop",
-    get: function get() {
-      return this.modalFooterPanelPaddingTop;
-    }
-  }, {
-    key: "modalFooterPanelPaddingBottom",
-    get: function get() {
-      return this.modalFooterPaddingBottom;
-    }
-  }, {
-    key: "mobileModalCloseButtonRightPadding",
-    get: function get() {
-      return this.mobileModalCloseButtonClickArea;
-    }
-  }, {
-    key: "mobileModalCloseButtonTopPadding",
-    get: function get() {
-      return this.mobileModalCloseButtonClickArea;
-    }
-  }, {
-    key: "mobileModalWithoutHeaderCloseButtonWidth",
-    get: function get() {
-      return parseInt(this.modalCloseIconSize) + 2 * parseInt(this.mobileModalWithoutHeaderCloseButtonPadding) + "px";
-    }
-  }, {
-    key: "sidePageFooterPanelBg",
-    get:
-    //#endregion
-    //#region SidePage
-    function get() {
-      return this.sidePageBgDefault;
-    }
-  }, {
-    key: "sidePageHeaderTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "mobileSidePageCloseButtonPadding",
-    get: function get() {
-      return this.mobileSidePageCloseButtonClickArea;
-    }
-  }, {
-    key: "sidePageFooterPanelPaddingTop",
-    get: function get() {
-      return this.sidePageFooterPaddingTop;
-    }
-  }, {
-    key: "sidePageFooterPanelPaddingBottom",
-    get: function get() {
-      return this.sidePageFooterPanelPaddingTop;
-    }
-  }, {
-    key: "sidePageCloseButtonClickAreaTop",
-    get: function get() {
-      return this.modalCloseButtonClickAreaTop;
-    }
-  }, {
-    key: "sidePageCloseButtonClickAreaBottom",
-    get: function get() {
-      return this.modalCloseButtonClickAreaBottom;
-    }
-  }, {
-    key: "sidePageCloseButtonClickAreaLeft",
-    get: function get() {
-      return this.modalCloseButtonClickAreaLeft;
-    }
-  }, {
-    key: "sidePageCloseButtonClickAreaRight",
-    get: function get() {
-      return this.modalCloseButtonClickAreaRight;
-    }
-  }, {
-    key: "sidePageCloseButtonFixedClickAreaTop",
-    get: function get() {
-      return this.sidePageCloseButtonFixedClickAreaBottom;
-    }
-  }, {
-    key: "sidePageFixedHeaderShadow",
-    get: function get() {
-      return this.fixedPanelShadow;
-    }
-  }, {
-    key: "sidePageFixedFooterShadow",
-    get: function get() {
-      return this.fixedPanelShadow;
-    }
-  }, {
-    key: "dateInputIconColor",
-    get:
-    //#endregion SidePage
-    //#region DateInput
-    function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "calendarBottomSeparatorBorderWidth",
-    get: function get() {
-      return '1px';
-    }
-  }, {
-    key: "calendarBottomSeparatorBorder",
-    get: function get() {
-      return this.calendarBottomSeparatorBorderWidth + " solid " + this.calendarBottomSeparatorBorderColor;
-    }
-  }, {
-    key: "calendarBg",
-    get: function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "calendarCellBg",
-    get: function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "calendarCellWeekendColor",
-    get: function get() {
-      return this.errorText;
-    }
-  }, {
-    key: "calendarCellWidth",
-    get: function get() {
-      return this.calendarCellHeight;
-    }
-  }, {
-    key: "calendarCellLineHeight",
-    get: function get() {
-      return parseInt(this.calendarCellHeight) - 2 + "px";
-    }
-  }, {
-    key: "calendarMonthHeaderStickedBgColor",
-    get: function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "datePickerOpenBtnColor",
-    get:
-    //#endregion Calendar
-    //#region DatePicker
-    function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "datePickerMenuOffsetY",
-    get: function get() {
-      return this.menuOffsetY;
-    }
-  }, {
-    key: "dateSelectMenuBg",
-    get:
-    //#endregion
-
-    //#region DateSelect
-    function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "dateSelectMenuItemBgDisabled",
-    get: function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "dateSelectMenuItemFontSelected",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "dateSelectMenuItemFontDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "dateSelectTextColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "dateSelectTextColorDefault",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "dateSelectLinkColor",
-    get: function get() {
-      return this.linkColor;
-    }
-  }, {
-    key: "dateSelectPopupBoxShadow",
-    get: function get() {
-      return this.popupBoxShadow;
-    }
-  }, {
-    key: "pagingFontSizeSmall",
-    get:
-    //#endregion DateSelect
-    //#region Paging
-
-    function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "pagingFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "pagingFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "pagingLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "pagingLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "pagingLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "pagingPageLinkColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "pagingPageLinkActiveColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "pagingForwardLinkColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "pagingForwardLinkDisabledColor",
-    get: function get() {
-      return this.linkDisabledColor;
-    }
-  }, {
-    key: "pagingDotsDisabledColor",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "pagingPageLinkHintColor",
-    get: function get() {
-      return this.placeholderColor;
-    }
-    //#endregion Paging
-    //#region Hint
-  }, {
-    key: "hintColor",
-    get: function get() {
-      return this.textColorInvert;
-    }
-  }, {
-    key: "mobileHintColor",
-    get: function get() {
-      return this.hintColor;
-    }
-  }, {
-    key: "hintFontSize",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "hintLineHeight",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "toastFontSize",
-    get:
-    //#endregion Hint
-    //#region Toast
-    function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "toastLineHeight",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "dropdownMenuHoverBorderColor",
-    get: function get() {
-      return this.btnDefaultHoverBorderColor;
-    }
-  }, {
-    key: "dropdownMenuOffsetY",
-    get: function get() {
-      return this.menuOffsetY;
-    }
-  }, {
-    key: "dropdownMenuMenuOffsetY",
-    get: function get() {
-      return this.menuOffsetY;
-    }
-  }, {
-    key: "dropdownDefaultBg",
-    get: function get() {
-      return this.btnDefaultBg;
-    }
-  }, {
-    key: "dropdownBorderWidth",
-    get: function get() {
-      return this.btnBorderWidth;
-    }
-  }, {
-    key: "dropdownOutlineWidth",
-    get: function get() {
-      return this.btnOutlineWidth;
-    }
-  }, {
-    key: "dropdownLineHeightSmall",
-    get: function get() {
-      return this.btnLineHeightSmall;
-    }
-  }, {
-    key: "dropdownFontSizeSmall",
-    get: function get() {
-      return this.btnFontSizeSmall;
-    }
-  }, {
-    key: "dropdownPaddingXSmall",
-    get: function get() {
-      return this.btnPaddingXSmall;
-    }
-  }, {
-    key: "dropdownPaddingYSmall",
-    get: function get() {
-      return this.btnPaddingYSmall;
-    }
-  }, {
-    key: "dropdownIconSizeSmall",
-    get: function get() {
-      return this.btnIconSizeSmall;
-    }
-  }, {
-    key: "dropdownLineHeightMedium",
-    get: function get() {
-      return this.btnLineHeightMedium;
-    }
-  }, {
-    key: "dropdownFontSizeMedium",
-    get: function get() {
-      return this.btnFontSizeMedium;
-    }
-  }, {
-    key: "dropdownPaddingXMedium",
-    get: function get() {
-      return this.btnPaddingXMedium;
-    }
-  }, {
-    key: "dropdownPaddingYMedium",
-    get: function get() {
-      return this.btnPaddingYMedium;
-    }
-  }, {
-    key: "dropdownIconSizeMedium",
-    get: function get() {
-      return this.btnIconSizeMedium;
-    }
-  }, {
-    key: "dropdownLineHeightLarge",
-    get: function get() {
-      return this.btnLineHeightLarge;
-    }
-  }, {
-    key: "dropdownFontSizeLarge",
-    get: function get() {
-      return this.btnFontSizeLarge;
-    }
-  }, {
-    key: "dropdownPaddingXLarge",
-    get: function get() {
-      return this.btnPaddingXLarge;
-    }
-  }, {
-    key: "dropdownPaddingYLarge",
-    get: function get() {
-      return this.btnPaddingYLarge;
-    }
-  }, {
-    key: "dropdownIconSizeLarge",
-    get: function get() {
-      return this.btnIconSizeLarge;
-    }
-  }, {
-    key: "dropdownBgDisabled",
-    get: function get() {
-      return this.btnDisabledBg;
-    }
-  }, {
-    key: "dropdownBorderColorDisabled",
-    get: function get() {
-      return this.btnDisabledBorderColor;
-    }
-  }, {
-    key: "dropdownTextColorDisabled",
-    get: function get() {
-      return this.btnDisabledTextColor;
-    }
-    //#endregion Dropdown
-    //#region Menu
-  }, {
-    key: "menuBgDefault",
-    get: function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "menuItemTextColor",
-    get:
-    // menuItem
-    function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "menuItemPaddingForIconSmall",
-    get: function get() {
-      return parseInt(this.menuItemPaddingXSmall) + parseInt(this.menuItemIconWidthSmall) + parseInt(this.menuItemIconGap) + "px";
-    }
-  }, {
-    key: "menuItemPaddingForIconMedium",
-    get: function get() {
-      return parseInt(this.menuItemPaddingXMedium) + parseInt(this.menuItemIconWidthMedium) + parseInt(this.menuItemIconGap) + "px";
-    }
-  }, {
-    key: "menuItemPaddingForIconLarge",
-    get: function get() {
-      return parseInt(this.menuItemPaddingXLarge) + parseInt(this.menuItemIconWidthLarge) + parseInt(this.menuItemIconGap) + "px";
-    }
-  }, {
-    key: "menuItemLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "menuItemLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "menuItemLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "menuItemFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "menuItemFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "menuItemFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "menuItemHoverColor",
-    get: function get() {
-      return this.menuItemTextColor;
-    }
-  }, {
-    key: "menuItemCommentColor",
-    get: function get() {
-      return this.menuItemTextColor;
-    }
-  }, {
-    key: "menuItemCommentColorHover",
-    get: function get() {
-      return this.menuItemTextColor;
-    }
-  }, {
-    key: "menuItemLineHeightMobile",
-    get: function get() {
-      return this.lineHeightMobile;
-    }
-  }, {
-    key: "menuItemFontSizeMobile",
-    get: function get() {
-      return this.fontSizeMobile;
-    }
-  }, {
-    key: "menuItemDisabledColor",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "menuMessageTextColor",
-    get:
-    // menuMessage
-    function get() {
-      return this.menuItemDisabledColor;
-    }
-  }, {
-    key: "menuMessageBg",
-    get: function get() {
-      return this.menuItemDisabledBg;
-    }
-  }, {
-    key: "menuMessagePaddingY",
-    get: function get() {
-      return this.menuItemPaddingYSmall;
-    }
-  }, {
-    key: "menuMessagePaddingX",
-    get: function get() {
-      return this.menuItemPaddingXSmall;
-    }
-  }, {
-    key: "menuMessageDisplay",
-    get: function get() {
-      return this.menuItemDisplay;
-    }
-  }, {
-    key: "menuMessagePaddingMobile",
-    get: function get() {
-      return this.menuItemPaddingMobile;
-    }
-  }, {
-    key: "menuMessageLineHeightMobile",
-    get: function get() {
-      return this.menuItemLineHeightMobile;
-    }
-  }, {
-    key: "menuMessageFontSizeMobile",
-    get: function get() {
-      return this.menuItemFontSizeMobile;
-    }
-  }, {
-    key: "menuMessageFontSizeSmall",
-    get: function get() {
-      return this.menuItemFontSizeSmall;
-    }
-  }, {
-    key: "menuMessageFontSizeMedium",
-    get: function get() {
-      return this.menuItemFontSizeMedium;
-    }
-  }, {
-    key: "menuMessageFontSizeLarge",
-    get: function get() {
-      return this.menuItemFontSizeLarge;
-    }
-  }, {
-    key: "menuMessageLineHeightSmall",
-    get: function get() {
-      return this.menuItemLineHeightSmall;
-    }
-  }, {
-    key: "menuMessageLineHeightMedium",
-    get: function get() {
-      return this.menuItemLineHeightMedium;
-    }
-  }, {
-    key: "menuMessageLineHeightLarge",
-    get: function get() {
-      return this.menuItemLineHeightLarge;
-    }
-  }, {
-    key: "menuFooterColor",
-    get:
-    //menuFooter
-    function get() {
-      return this.menuHeaderColor;
-    }
-  }, {
-    key: "menuFooterLineHeightSmall",
-    get: function get() {
-      return this.menuHeaderLineHeightSmall;
-    }
-  }, {
-    key: "menuFooterLineHeightMedium",
-    get: function get() {
-      return this.menuHeaderLineHeightMedium;
-    }
-  }, {
-    key: "menuFooterLineHeightLarge",
-    get: function get() {
-      return this.menuHeaderLineHeightLarge;
-    }
-  }, {
-    key: "menuFooterFontSizeSmall",
-    get: function get() {
-      return this.menuHeaderFontSizeSmall;
-    }
-  }, {
-    key: "menuFooterFontSizeMedium",
-    get: function get() {
-      return this.menuHeaderFontSizeMedium;
-    }
-  }, {
-    key: "menuFooterFontSizeLarge",
-    get: function get() {
-      return this.menuHeaderFontSizeLarge;
-    }
-  }, {
-    key: "menuFooterPaddingXSmall",
-    get: function get() {
-      return this.menuHeaderPaddingXSmall;
-    }
-  }, {
-    key: "menuFooterPaddingXMedium",
-    get: function get() {
-      return this.menuHeaderPaddingXMedium;
-    }
-  }, {
-    key: "menuFooterPaddingXLarge",
-    get: function get() {
-      return this.menuHeaderPaddingXLarge;
-    }
-  }, {
-    key: "menuFooterPaddingTopSmall",
-    get: function get() {
-      return this.menuHeaderPaddingBottomSmall;
-    }
-  }, {
-    key: "menuFooterPaddingTopMedium",
-    get: function get() {
-      return this.menuHeaderPaddingBottomMedium;
-    }
-  }, {
-    key: "menuFooterPaddingTopLarge",
-    get: function get() {
-      return this.menuHeaderPaddingBottomLarge;
-    }
-  }, {
-    key: "menuFooterPaddingBottomSmall",
-    get: function get() {
-      return this.menuHeaderPaddingTopSmall;
-    }
-  }, {
-    key: "menuFooterPaddingBottomMedium",
-    get: function get() {
-      return this.menuHeaderPaddingTopMedium;
-    }
-  }, {
-    key: "menuFooterPaddingBottomLarge",
-    get: function get() {
-      return this.menuHeaderPaddingTopLarge;
-    }
-
-    //menuSeparator
-  }, {
-    key: "toggleLineHeightSmall",
-    get:
-    //#endregion Menu
-    //#region Toggle
-    function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "toggleLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "toggleLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "toggleFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "toggleFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "toggleFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "toggleTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "toggleHandleBorderRadiusSmall",
-    get: function get() {
-      var height = parseInt(this.toggleHeightSmall, 10) || 0;
-      var borderWidth = parseInt(this.toggleBorderWidth, 10) || 0;
-      var handleSize = height - 2 * borderWidth;
-      return handleSize / 2 + "px";
-    }
-  }, {
-    key: "toggleHandleBorderRadiusMedium",
-    get: function get() {
-      var height = parseInt(this.toggleHeightMedium, 10) || 0;
-      var borderWidth = parseInt(this.toggleBorderWidth, 10) || 0;
-      var handleSize = height - 2 * borderWidth;
-      return handleSize / 2 + "px";
-    }
-  }, {
-    key: "toggleHandleBorderRadiusLarge",
-    get: function get() {
-      var height = parseInt(this.toggleHeightLarge, 10) || 0;
-      var borderWidth = parseInt(this.toggleBorderWidth, 10) || 0;
-      var handleSize = height - 2 * borderWidth;
-      return handleSize / 2 + "px";
-    }
-  }, {
-    key: "toggleBorderRadiusSmall",
-    get: function get() {
-      return "calc(" + this.toggleHeightSmall + " * 0.5)";
-    }
-  }, {
-    key: "toggleBorderRadiusMedium",
-    get: function get() {
-      return "calc(" + this.toggleHeightMedium + " * 0.5)";
-    }
-  }, {
-    key: "toggleBorderRadiusLarge",
-    get: function get() {
-      return "calc(" + this.toggleHeightLarge + " * 0.5)";
-    }
-  }, {
-    key: "toggleBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "toggleOutlineWidth",
-    get: function get() {
-      var outlineWidth = parseInt(this.controlOutlineWidth, 10) || 0;
-      var borderWidth = parseInt(this.toggleBorderWidth, 10) || 0;
-      return outlineWidth + borderWidth + "px";
-    }
-  }, {
-    key: "toggleBorderColorDisabled",
-    get: function get() {
-      return this.toggleBorderColor;
-    }
-  }, {
-    key: "toggleShadowColorError",
-    get: function get() {
-      return this.errorMain;
-    }
-  }, {
-    key: "toggleShadowColorWarning",
-    get: function get() {
-      return this.warningMain;
-    }
-  }, {
-    key: "toggleFocusShadowColor",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "toggleOutlineColorFocus",
-    get: function get() {
-      return this.outlineColorFocus;
-    }
-  }, {
-    key: "toggleContainerBgHover",
-    get: function get() {
-      return this.toggleBgHover;
-    }
-
-    // checked
-  }, {
-    key: "toggleContainerBgChecked",
-    get: function get() {
-      return this.toggleBgChecked;
-    }
-  }, {
-    key: "toggleBgDisabled",
-    get: function get() {
-      return this.bgDisabled;
-    }
-
-    // disabled checked
-  }, {
-    key: "toggleBorderColorDisabledChecked",
-    get: function get() {
-      return this.toggleBorderColor;
-    }
-  }, {
-    key: "popupTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "popupBackground",
-    get: function get() {
-      return this.bgSecondary;
-    }
-  }, {
-    key: "inputTextColor",
-    get:
-    //#endregion
-    //#region Input
-    function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "inputIconColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "inputFocusedIconColor",
-    get: function get() {
-      return this.inputIconColor;
-    }
-  }, {
-    key: "inputTextColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "inputPlaceholderColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "inputFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "inputFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "inputFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "inputLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "inputLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "inputLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "inputHeightSmall",
-    get: function get() {
-      var borderWidth = parseInt(this.inputBorderWidth, 10) || 0;
-      var padding = parseInt(this.inputPaddingYSmall, 10) || 0;
-      var lineHeigh = parseInt(this.inputLineHeightSmall, 10) || 0;
-      return 2 * borderWidth + 2 * padding + lineHeigh + "px";
-    }
-  }, {
-    key: "inputHeightMedium",
-    get: function get() {
-      var borderWidth = parseInt(this.inputBorderWidth, 10) || 0;
-      var padding = parseInt(this.inputPaddingYMedium, 10) || 0;
-      var lineHeigh = parseInt(this.inputLineHeightMedium, 10) || 0;
-      return 2 * borderWidth + 2 * padding + lineHeigh + "px";
-    }
-  }, {
-    key: "inputHeightLarge",
-    get: function get() {
-      var borderWidth = parseInt(this.inputBorderWidth, 10) || 0;
-      var padding = parseInt(this.inputPaddingYLarge, 10) || 0;
-      var lineHeigh = parseInt(this.inputLineHeightLarge, 10) || 0;
-      return 2 * borderWidth + 2 * padding + lineHeigh + "px";
-    }
-  }, {
-    key: "inputPaddingYSmall",
-    get: function get() {
-      return this.controlPaddingYSmall;
-    }
-  }, {
-    key: "inputPaddingYMedium",
-    get: function get() {
-      return this.controlPaddingYMedium;
-    }
-  }, {
-    key: "inputPaddingYLarge",
-    get: function get() {
-      return this.controlPaddingYLarge;
-    }
-  }, {
-    key: "inputFocusShadow",
-    get: function get() {
-      return "0 0 0 " + this.inputOutlineWidth + " " + this.borderColorFocus;
-    }
-  }, {
-    key: "inputFocusedBg",
-    get: function get() {
-      return this.inputBg;
-    }
-  }, {
-    key: "inputDisabledBg",
-    get: function get() {
-      return this.bgDisabled;
-    }
-  }, {
-    key: "inputDisabledBorderColor",
-    get: function get() {
-      return this.borderColorDisabled;
-    }
-  }, {
-    key: "inputFocusOutline",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "inputBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "inputOutlineWidth",
-    get: function get() {
-      return "calc(" + this.controlOutlineWidth + " - 1px)";
-    }
-  }, {
-    key: "inputBorderColorHover",
-    get: function get() {
-      return this.closeGrayColor;
-    }
-  }, {
-    key: "inputBorderColorFocus",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "inputBorderColorError",
-    get: function get() {
-      return this.borderColorError;
-    }
-  }, {
-    key: "inputBorderColorWarning",
-    get: function get() {
-      return this.borderColorWarning;
-    }
-  }, {
-    key: "inputBorderTopColor",
-    get: function get() {
-      return this.inputBorderColor;
-    }
-  }, {
-    key: "inputPlaceholderColor",
-    get: function get() {
-      return this.placeholderColor;
-    }
-  }, {
-    key: "inputPlaceholderColorLight",
-    get: function get() {
-      return this.placeholderColorLight;
-    }
-  }, {
-    key: "checkboxFontSizeSmall",
-    get:
-    //#endregion Input
-    //#region Checkbox
-    function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "checkboxFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "checkboxFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "checkboxLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "checkboxLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "checkboxLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "checkboxPaddingYSmall",
-    get: function get() {
-      var controlHeight = parseInt(this.controlHeightSmall, 10) || 0;
-      var lineHeight = parseInt(this.checkboxLineHeightSmall, 10) || 0;
-      return (controlHeight - lineHeight) / 2 + "px";
-    }
-  }, {
-    key: "checkboxPaddingYMedium",
-    get: function get() {
-      var controlHeight = parseInt(this.controlHeightMedium, 10) || 0;
-      var lineHeight = parseInt(this.checkboxLineHeightMedium, 10) || 0;
-      return (controlHeight - lineHeight) / 2 + "px";
-    }
-  }, {
-    key: "checkboxPaddingYLarge",
-    get: function get() {
-      var controlHeight = parseInt(this.controlHeightLarge, 10) || 0;
-      var lineHeight = parseInt(this.checkboxLineHeightLarge, 10) || 0;
-      return (controlHeight - lineHeight) / 2 + "px";
-    }
-  }, {
-    key: "checkboxTextColorDefault",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "checkboxTextColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "checkboxShadowDisabled",
-    get: function get() {
-      return "0 0 0 " + this.checkboxBorderWidth + " rgba(0, 0, 0, 0.1)";
-    }
-  }, {
-    key: "checkboxBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "checkboxShadow",
-    get: function get() {
-      return "0 0 0 " + this.checkboxBorderWidth + " rgba(0, 0, 0, 0.15)";
-    }
-  }, {
-    key: "checkboxShadowHover",
-    get: function get() {
-      return "0 0 0 " + this.checkboxBorderWidth + " #c3c3c3";
-    }
-  }, {
-    key: "checkboxOutlineColorFocus",
-    get: function get() {
-      return this.outlineColorFocus;
-    }
-  }, {
-    key: "checkboxBorderColorWarning",
-    get: function get() {
-      return this.borderColorWarning;
-    }
-  }, {
-    key: "checkboxBorderColorError",
-    get: function get() {
-      return this.borderColorError;
-    }
-  }, {
-    key: "checkboxCheckedHoverShadow",
-    get: function get() {
-      return "0 0 0 " + this.checkboxBorderWidth + " " + this.checkboxCheckedHoverBg;
-    }
-  }, {
-    key: "checkboxOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "checkboxCheckedShadow",
-    get: function get() {
-      return "0 0 0 " + this.checkboxBorderWidth + " " + this.checkboxCheckedBg;
-    }
-  }, {
-    key: "checkboxCheckedActiveShadow",
-    get: function get() {
-      return "0 0 0 " + this.checkboxBorderWidth + " " + this.checkboxCheckedActiveBg;
-    }
-  }, {
-    key: "checkboxBorderColorFocus",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "checkboxHoverBg",
-    get: function get() {
-      return this.btnDefaultHoverBg;
-    }
-  }, {
-    key: "checkboxActiveBg",
-    get: function get() {
-      return this.btnDefaultActiveBg;
-    }
-  }, {
-    key: "checkboxCheckedBg",
-    get: function get() {
-      return this.bgChecked;
-    }
-  }, {
-    key: "checkboxBgDisabled",
-    get: function get() {
-      return this.bgDisabled;
-    }
-  }, {
-    key: "checkboxShadowActive",
-    get: function get() {
-      return "0 0 0 " + this.checkboxBorderWidth + " #c3c3c3";
-    }
-    //#endregion Checkbox
-    //#region TextArea
-  }, {
-    key: "textareaColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "textareaTextColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "textareaPlaceholderColorLight",
-    get: function get() {
-      return this.placeholderColorLight;
-    }
-  }, {
-    key: "textareaPlaceholderColor",
-    get: function get() {
-      return this.placeholderColor;
-    }
-  }, {
-    key: "textareaPlaceholderColorDisabled",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "textareaFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "textareaFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "textareaFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "textareaLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "textareaLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "textareaLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "textareaBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "textareaOutlineWidth",
-    get: function get() {
-      var outlineWidth = parseInt(this.controlOutlineWidth, 10) || 0;
-      var borderWidth = parseInt(this.textareaBorderWidth, 10) || 0;
-      return outlineWidth - borderWidth + "px";
-    }
-  }, {
-    key: "textareaMinHeightSmall",
-    get: function get() {
-      var lineHeight = parseInt(this.textareaLineHeightSmall, 10) || 0;
-      var paddingY = parseInt(this.textareaPaddingYSmall, 10) || 0;
-      var borderWidth = parseInt(this.textareaBorderWidth, 10) || 0;
-      return lineHeight + paddingY * 2 + borderWidth * 2 + "px";
-    }
-  }, {
-    key: "textareaMinHeightMedium",
-    get: function get() {
-      var lineHeight = parseInt(this.textareaLineHeightMedium, 10) || 0;
-      var paddingY = parseInt(this.textareaPaddingYMedium, 10) || 0;
-      var borderWidth = parseInt(this.textareaBorderWidth, 10) || 0;
-      return lineHeight + paddingY * 2 + borderWidth * 2 + "px";
-    }
-  }, {
-    key: "textareaMinHeightLarge",
-    get: function get() {
-      var lineHeight = parseInt(this.textareaLineHeightLarge, 10) || 0;
-      var paddingY = parseInt(this.textareaPaddingYLarge, 10) || 0;
-      var borderWidth = parseInt(this.textareaBorderWidth, 10) || 0;
-      return lineHeight + paddingY * 2 + borderWidth * 2 + "px";
-    }
-  }, {
-    key: "textareaPaddingYSmall",
-    get: function get() {
-      return this.controlPaddingYSmall;
-    }
-  }, {
-    key: "textareaPaddingYMedium",
-    get: function get() {
-      return this.controlPaddingYMedium;
-    }
-  }, {
-    key: "textareaPaddingYLarge",
-    get: function get() {
-      return this.controlPaddingYLarge;
-    }
-  }, {
-    key: "textareaBorderColor",
-    get: function get() {
-      return this.borderColorGrayLight;
-    }
-  }, {
-    key: "textareaBorderColorFocus",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "textareaBorderColorHover",
-    get: function get() {
-      return this.inputBorderColorHover;
-    }
-  }, {
-    key: "textareaBorderColorWarning",
-    get: function get() {
-      return this.borderColorWarning;
-    }
-  }, {
-    key: "textareaBorderColorError",
-    get: function get() {
-      return this.borderColorError;
-    }
-  }, {
-    key: "textareaDisabledBg",
-    get: function get() {
-      return this.inputDisabledBg;
-    }
-  }, {
-    key: "textareaDisabledBorderColor",
-    get: function get() {
-      return this.borderColorDisabled;
-    }
-  }, {
-    key: "textareaCounterColor",
-    get: function get() {
-      return this.gray;
-    }
-  }, {
-    key: "textareaCounterErrorColor",
-    get: function get() {
-      return this.errorText;
-    }
-  }, {
-    key: "textareaCounterHelpIconColor",
-    get: function get() {
-      return this.linkColor;
-    }
-  }, {
-    key: "radioOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "radioTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "radioFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "radioFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "radioFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "radioLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "radioLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "radioLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "radioPaddingYSmall",
-    get: function get() {
-      var controlHeight = parseInt(this.controlHeightSmall, 10) || 0;
-      var lineHeight = parseInt(this.radioLineHeightSmall, 10) || 0;
-      return (controlHeight - lineHeight) / 2 + "px";
-    }
-  }, {
-    key: "radioPaddingYMedium",
-    get: function get() {
-      var controlHeight = parseInt(this.controlHeightMedium, 10) || 0;
-      var lineHeight = parseInt(this.radioLineHeightMedium, 10) || 0;
-      return (controlHeight - lineHeight) / 2 + "px";
-    }
-  }, {
-    key: "radioPaddingYLarge",
-    get: function get() {
-      var controlHeight = parseInt(this.controlHeightLarge, 10) || 0;
-      var lineHeight = parseInt(this.radioLineHeightLarge, 10) || 0;
-      return (controlHeight - lineHeight) / 2 + "px";
-    }
-  }, {
-    key: "radioHoverBg",
-    get: function get() {
-      return this.checkboxHoverBg;
-    }
-  }, {
-    key: "radioActiveBg",
-    get: function get() {
-      return this.checkboxActiveBg;
-    }
-  }, {
-    key: "radioBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "radioBorderColor",
-    get: function get() {
-      return this.borderColorGrayLight;
-    }
-  }, {
-    key: "radioBorder",
-    get: function get() {
-      return this.radioBorderWidth + " solid " + this.radioBorderColor;
-    }
-  }, {
-    key: "radioBorderColorFocus",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "radioBorderColorWarning",
-    get: function get() {
-      return this.borderColorWarning;
-    }
-  }, {
-    key: "radioBorderColorError",
-    get: function get() {
-      return this.borderColorError;
-    }
-  }, {
-    key: "radioFocusShadow",
-    get: function get() {
-      return "inset 0 0 0 1px " + this.outlineColorFocus;
-    }
-  }, {
-    key: "radioCheckedBgColor",
-    get: function get() {
-      return this.checkboxCheckedBg;
-    }
-  }, {
-    key: "radioCheckedBulletColor",
-    get: function get() {
-      return this.checkboxCheckedColor;
-    }
-  }, {
-    key: "radioCheckedHoverBgColor",
-    get: function get() {
-      return this.checkboxCheckedHoverBg;
-    }
-  }, {
-    key: "radioDisabledBg",
-    get: function get() {
-      return this.checkboxBgDisabled;
-    }
-  }, {
-    key: "radioDisabledShadow",
-    get: function get() {
-      return "0 0 0 " + this.radioBorderWidth + " rgba(0, 0, 0, 0.1)";
-    }
-  }, {
-    key: "radioCheckedDisabledBulletBg",
-    get: function get() {
-      return this.gray;
-    }
-    //#endregion
-    //#region Tabs
-  }, {
-    key: "tabFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "tabFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "tabFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "tabLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "tabLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "tabLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "tabPaddingYSmall",
-    get: function get() {
-      var paddingY = parseInt(this.controlPaddingYSmall);
-      var borderWidth = parseInt(this.controlBorderWidth);
-      return paddingY + borderWidth + "px";
-    }
-  }, {
-    key: "tabPaddingYMedium",
-    get: function get() {
-      var paddingY = parseInt(this.controlPaddingYMedium);
-      var borderWidth = parseInt(this.controlBorderWidth);
-      return paddingY + borderWidth + "px";
-    }
-  }, {
-    key: "tabPaddingYLarge",
-    get: function get() {
-      var paddingY = parseInt(this.controlPaddingYLarge);
-      var borderWidth = parseInt(this.controlBorderWidth);
-      return paddingY + borderWidth + "px";
-    }
-  }, {
-    key: "tabOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "tabTextColorDefault",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "tabColorFocus",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "tabColorError",
-    get: function get() {
-      return this.btnDangerBg;
-    }
-  }, {
-    key: "tabColorWarning",
-    get: function get() {
-      return this.btnPayBg;
-    }
-  }, {
-    key: "tabColorSuccess",
-    get: function get() {
-      return this.btnSuccessBg;
-    }
-  }, {
-    key: "tabColorPrimary",
-    get: function get() {
-      return this.btnPrimaryBg;
-    }
-  }, {
-    key: "spinnerBgColor",
-    get:
-    //#endregion Tabs
-    //#region Spinner
-    function get() {
-      return this.grayXLight;
-    }
-  }, {
-    key: "spinnerColor",
-    get: function get() {
-      return this.red;
-    }
-  }, {
-    key: "spinnerDimmedColor",
-    get: function get() {
-      return this.gray;
-    }
-  }, {
-    key: "spinnerCaptionColor",
-    get: function get() {
-      return this.gray;
-    }
-  }, {
-    key: "spinnerFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "spinnerFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "spinnerFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "spinnerLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "spinnerLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "spinnerLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "switcherTextColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "switcherOutlineWidth",
-    get: function get() {
-      return this.btnOutlineWidth;
-    }
-  }, {
-    key: "switcherCaptionFontSizeSmall",
-    get: function get() {
-      return this.btnFontSizeSmall;
-    }
-  }, {
-    key: "switcherCaptionFontSizeMedium",
-    get: function get() {
-      return this.btnFontSizeMedium;
-    }
-  }, {
-    key: "switcherCaptionFontSizeLarge",
-    get: function get() {
-      return this.btnFontSizeLarge;
-    }
-  }, {
-    key: "switcherCaptionLineHeightSmall",
-    get: function get() {
-      return this.btnLineHeightSmall;
-    }
-  }, {
-    key: "switcherCaptionLineHeightMedium",
-    get: function get() {
-      return this.btnLineHeightMedium;
-    }
-  }, {
-    key: "switcherCaptionLineHeightLarge",
-    get: function get() {
-      return this.btnLineHeightLarge;
-    }
-  }, {
-    key: "switcherCaptionGapSmall",
-    get: function get() {
-      return this.btnPaddingXSmall;
-    }
-  }, {
-    key: "switcherCaptionGapMedium",
-    get: function get() {
-      return this.btnPaddingXMedium;
-    }
-  }, {
-    key: "switcherCaptionGapLarge",
-    get: function get() {
-      return this.btnPaddingXLarge;
-    }
-  }, {
-    key: "switcherButtonPaddingYSmall",
-    get: function get() {
-      return this.btnPaddingYSmall;
-    }
-  }, {
-    key: "switcherButtonPaddingYMedium",
-    get: function get() {
-      return this.btnPaddingYMedium;
-    }
-  }, {
-    key: "switcherButtonPaddingYLarge",
-    get: function get() {
-      return this.btnPaddingYLarge;
-    }
-  }, {
-    key: "switcherButtonLineHeightSmall",
-    get: function get() {
-      return this.btnLineHeightSmall;
-    }
-  }, {
-    key: "switcherButtonLineHeightMedium",
-    get: function get() {
-      return this.btnLineHeightMedium;
-    }
-  }, {
-    key: "switcherButtonLineHeightLarge",
-    get: function get() {
-      return this.btnLineHeightLarge;
-    }
-  }, {
-    key: "switcherButtonFontSizeSmall",
-    get: function get() {
-      return this.btnFontSizeSmall;
-    }
-  }, {
-    key: "switcherButtonFontSizeMedium",
-    get: function get() {
-      return this.btnFontSizeMedium;
-    }
-  }, {
-    key: "switcherButtonFontSizeLarge",
-    get: function get() {
-      return this.btnFontSizeLarge;
-    }
-  }, {
-    key: "switcherButtonBorderRadiusSmall",
-    get: function get() {
-      return this.btnBorderRadiusSmall;
-    }
-  }, {
-    key: "switcherButtonBorderRadiusMedium",
-    get: function get() {
-      return this.btnBorderRadiusMedium;
-    }
-  }, {
-    key: "switcherButtonBorderRadiusLarge",
-    get: function get() {
-      return this.btnBorderRadiusLarge;
-    }
-  }, {
-    key: "switcherButtonBorderWidth",
-    get: function get() {
-      return this.btnBorderWidth;
-    }
-  }, {
-    key: "switcherButtonDisabledBorderColor",
-    get: function get() {
-      return this.switcherBtnDisabledBorderColor;
-    }
-  }, {
-    key: "switcherButtonCheckedDisabledShadow",
-    get: function get() {
-      return this.btnCheckedDisabledShadow;
-    }
-    //#endregion
-    //#region MobilePopup
-  }, {
-    key: "mobilePopupHeaderFontSize",
-    get: function get() {
-      return this.fontSizeMobile;
-    }
-  }, {
-    key: "mobilePopupHeaderLineHeight",
-    get: function get() {
-      return this.lineHeightMobile;
-    }
-  }, {
-    key: "globalLoaderColor",
-    get:
-    //#endregion
-    //#region GlobalLoader
-    function get() {
-      return this.blueLight;
-    }
-  }, {
-    key: "fileUploaderPaddingYSmall",
-    get: function get() {
-      return this.controlPaddingYSmall;
-    }
-  }, {
-    key: "fileUploaderPaddingYMedium",
-    get: function get() {
-      return this.controlPaddingYMedium;
-    }
-  }, {
-    key: "fileUploaderPaddingYLarge",
-    get: function get() {
-      return this.controlPaddingYLarge;
-    }
-  }, {
-    key: "fileUploaderTileIconActionPositionSmall",
-    get: function get() {
-      return parseInt(this.fileUploaderTilePaddingSmall) + 1 + "px";
-    }
-  }, {
-    key: "fileUploaderTileIconActionPositionMedium",
-    get: function get() {
-      return parseInt(this.fileUploaderTilePaddingMedium) + 1 + "px";
-    }
-  }, {
-    key: "fileUploaderTileIconActionPositionLarge",
-    get: function get() {
-      return parseInt(this.fileUploaderTilePaddingLarge) + 1 + "px";
-    }
-  }, {
-    key: "fileUploaderFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "fileUploaderFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "fileUploaderFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "fileUploaderLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "fileUploaderLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "fileUploaderLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "fileUploaderTextColorDefault",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "fileUploaderBorderColor",
-    get: function get() {
-      return this.borderColorGrayLight;
-    }
-  }, {
-    key: "fileUploaderBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "fileUploaderDisabledBorder",
-    get: function get() {
-      return this.fileUploaderBorderWidth + " " + this.fileUploaderBorderStyle + " " + this.fileUploaderDisabledBorderColor;
-    }
-  }, {
-    key: "fileUploaderBorderColorFocus",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "fileUploaderLinkColor",
-    get: function get() {
-      return this.textColorDefault;
-    }
-  }, {
-    key: "fileUploaderBorderColorError",
-    get: function get() {
-      return this.borderColorError;
-    }
-  }, {
-    key: "fileUploaderBorderColorWarning",
-    get: function get() {
-      return this.borderColorWarning;
-    }
-  }, {
-    key: "fileUploaderDisabledBg",
-    get: function get() {
-      return this.btnDisabledBg;
-    }
-  }, {
-    key: "fileUploaderDisabledTextColor",
-    get: function get() {
-      return this.fileUploaderDisabledColor;
-    }
-  }, {
-    key: "fileUploaderDisabledLinkColor",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "fileUploaderDisabledIconColor",
-    get: function get() {
-      return this.textColorDisabled;
-    }
-  }, {
-    key: "fileUploaderErrorColor",
-    get: function get() {
-      return this.closeGrayColor;
-    }
-  }, {
-    key: "fileUploaderErrorTextColor",
-    get: function get() {
-      return this.redDark;
-    }
-  }, {
-    key: "fileUploaderWarningTextColor",
-    get: function get() {
-      return this.yellowDark;
-    }
-  }, {
-    key: "fileUploaderDragOverBorderColor",
-    get: function get() {
-      return this.borderColorFocus;
-    }
-  }, {
-    key: "fileUploaderIconSizeSmall",
-    get: function get() {
-      return this.btnIconSizeSmall;
-    }
-  }, {
-    key: "fileUploaderIconSizeMedium",
-    get: function get() {
-      return this.btnIconSizeMedium;
-    }
-  }, {
-    key: "fileUploaderIconSizeLarge",
-    get: function get() {
-      return this.btnIconSizeLarge;
-    }
-  }, {
-    key: "fileUploaderFileTypeErrorIconColor",
-    get: function get() {
-      return this.red;
-    }
-  }, {
-    key: "fileUploaderFileTypeWarningIconColor",
-    get: function get() {
-      return this.yellow;
-    }
-  }, {
-    key: "fileUploaderFileTypePdfIconColor",
-    get: function get() {
-      return this.red;
-    }
-  }, {
-    key: "fileUploaderDisabledFileTypeIcon",
-    get: function get() {
-      return this.fileUploaderDisabledIconColor;
-    }
-  }, {
-    key: "clearCrossIconHeightSmall",
-    get: function get() {
-      return this.inputHeightSmall;
-    }
-  }, {
-    key: "clearCrossIconHeightMedium",
-    get: function get() {
-      return this.inputHeightMedium;
-    }
-  }, {
-    key: "clearCrossIconHeightLarge",
-    get: function get() {
-      return this.inputHeightLarge;
-    }
-  }, {
-    key: "clearCrossIconRightMarginSmall",
-    get: function get() {
-      var inputPaddingXSmall = parseInt(this.inputPaddingXSmall);
-      var inputBorderWidth = parseInt(this.inputBorderWidth);
-      return "-" + (inputPaddingXSmall + inputBorderWidth) + "px";
-    }
-  }, {
-    key: "clearCrossIconRightMarginMedium",
-    get: function get() {
-      var inputPaddingXMedium = parseInt(this.inputPaddingXMedium);
-      var inputBorderWidth = parseInt(this.inputBorderWidth);
-      return "-" + (inputPaddingXMedium + inputBorderWidth) + "px";
-    }
-  }, {
-    key: "clearCrossIconRightMarginLarge",
-    get: function get() {
-      var inputPaddingXLarge = parseInt(this.inputPaddingXLarge);
-      var inputBorderWidth = parseInt(this.inputBorderWidth);
-      return "-" + (inputPaddingXLarge + inputBorderWidth) + "px";
-    }
-  }, {
-    key: "clearCrossIconBorderRadiusSmall",
-    get: function get() {
-      return this.inputBorderRadiusSmall;
-    }
-  }, {
-    key: "clearCrossIconBorderRadiusMedium",
-    get: function get() {
-      return this.inputBorderRadiusMedium;
-    }
-  }, {
-    key: "clearCrossIconBorderRadiusLarge",
-    get: function get() {
-      return this.inputBorderRadiusLarge;
-    }
-  }, {
-    key: "closeBtnIconColor",
-    get:
-    //#endregion ClearCrossIcon
-
-    //#region CloseIcon
-    function get() {
-      return this.closeGrayColor;
-    }
-  }, {
-    key: "closeBtnIconFocusShadow",
-    get: function get() {
-      return "inset 0 0 0 1px " + this.borderColorFocus + ", inset 0 0 0 2px " + this.outlineColorFocus;
-    }
-    //#endregion CloseIcon
-
-    //#region Autocomplete
-  }, {
-    key: "autocompleteMenuOffsetY",
-    get: function get() {
-      return this.menuOffsetY;
-    }
-    //#endregion Autocomplete
-
-    //#region Combobox
-  }, {
-    key: "comboboxMenuOffsetY",
-    get: function get() {
-      return this.menuOffsetY;
-    }
-    //#endregion Combobox
-
-    //#region MiniModal
-  }, {
-    key: "validationsTextColorError",
-    get:
-    //#endregion MiniModal
-
-    //#region react-ui-validations
-    function get() {
-      return this.errorText;
-    }
-
-    //#endregion
-  }]);
-}();
-_BasicThemeClass = BasicThemeClass; //#region Common variables
-BasicThemeClass.baseFontFamily = '"Lab Grotesque", "Lab Grotesque K", Arial, sans-serif';
-BasicThemeClass.labGrotesqueBaselineCompensation = '1';
-BasicThemeClass.brand = colors.shapeBoldBrandOriginal;
-BasicThemeClass.white = '#fff';
-BasicThemeClass.grayXLight = '#ebebeb';
-BasicThemeClass.gray = '#858585';
-BasicThemeClass.grayDark = '#333';
-BasicThemeClass.black = '#000';
-BasicThemeClass.blueXxLight = '#cdedff';
-BasicThemeClass.blueLight = '#1f87ef';
-BasicThemeClass.blue = '#1874cf';
-BasicThemeClass.greenXxLight = '#C7F9CC';
-BasicThemeClass.green = '#1C8A3F';
-BasicThemeClass.greenDark = '#197F39';
-BasicThemeClass.red = '#FE4C4C';
-BasicThemeClass.redXxLight = '#FFEBEB';
-BasicThemeClass.redDark = '#CC2626';
-BasicThemeClass.yellowXxLight = '#ffeec2';
-BasicThemeClass.yellow = '#fcb73e';
-BasicThemeClass.yellowDark = '#ef8b17';
-BasicThemeClass.bgDefault = colors.surfaceHigh;
-BasicThemeClass.bgDisabled = colors.shapeOtherDisabled;
-BasicThemeClass.warningMain = '#fcb73e';
-BasicThemeClass.warningSecondary = '#fff0bc';
-BasicThemeClass.warningText = '#d97e00';
-BasicThemeClass.closeGrayColor = 'rgba(0, 0, 0, 0.32)';
-BasicThemeClass.borderColorFocusLight = '#cdedff';
-BasicThemeClass.borderColorGrayDark = 'rgba(0, 0, 0, 0.28)';
-BasicThemeClass.borderColorGrayLight = 'rgba(0, 0, 0, 0.16)';
-BasicThemeClass.borderColorDisabled = colors.lineNeutralFaint;
-BasicThemeClass.placeholderColor = colors.textNeutralFaint;
-BasicThemeClass.outlineColorFocus = colors.surfaceBase;
-BasicThemeClass.placeholderColorLight = "color-mix(in srgb, " + colors.textNeutralFaint + ", transparent 40%)";
-BasicThemeClass.blinkColor = 'rgba(0, 136, 255, 0.2)';
-BasicThemeClass.controlBorderWidth = '1px';
-BasicThemeClass.controlOutlineWidth = '2px';
-BasicThemeClass.controlLineHeightSmall = '20px';
-BasicThemeClass.controlLineHeightMedium = '22px';
-BasicThemeClass.controlLineHeightLarge = '24px';
-BasicThemeClass.controlPaddingYSmall = '5px';
-BasicThemeClass.controlPaddingYMedium = '8px';
-BasicThemeClass.controlPaddingYLarge = '11px';
-BasicThemeClass.textColorDefault = colors.textNeutralHeavy;
-BasicThemeClass.textColorInvert = '#fff';
-BasicThemeClass.textColorDisabled = colors.textNeutralFaint;
-BasicThemeClass.textColorDisabledContrast = '#858585';
-BasicThemeClass.fontSizeSmall = '14px';
-BasicThemeClass.fontSizeMedium = '16px';
-BasicThemeClass.fontSizeLarge = '18px';
-BasicThemeClass.fontSizeMobile = '18px';
-BasicThemeClass.lineHeightMobile = '24px';
-BasicThemeClass.specificityLevel = '0';
-BasicThemeClass.fixedPanelShadow = 'none';
-BasicThemeClass.bgActive = '#141414';
-BasicThemeClass.bgChecked = '#3D3D3D';
-BasicThemeClass.borderColorFocus = colors.lineAccentBold;
-BasicThemeClass.controlHeightSmall = '32px';
-BasicThemeClass.controlHeightMedium = '40px';
-BasicThemeClass.controlHeightLarge = '48px';
-BasicThemeClass.mobileMediaQuery = '(max-width: 576px)';
-BasicThemeClass.transitionDuration = '100ms';
-BasicThemeClass.transitionTimingFunction = 'cubic-bezier(0.5, 1, 0.89, 1)'; //#endregion Common variables
-//#region Link
-BasicThemeClass.linkColor = colors.textAccentHeavy;
-BasicThemeClass.linkTextDecoration = 'underline';
-BasicThemeClass.linkActiveColor = colors.textAccentHeavyPressed;
-BasicThemeClass.linkHoverTextDecoration = 'none';
-BasicThemeClass.linkSuccessActiveColor = colors.textSuccessHeavyPressed;
-BasicThemeClass.linkDangerHoverColor = colors.textErrorHeavyHover;
-BasicThemeClass.linkDangerActiveColor = colors.textErrorHeavyPressed;
-BasicThemeClass.linkIconMarginRight = '4px';
-BasicThemeClass.linkIconMarginLeft = '4px';
-BasicThemeClass.linkGrayedColor = colors.textNeutralSoft;
-BasicThemeClass.linkGrayedHoverColor = colors.textNeutralHeavy;
-BasicThemeClass.linkGrayedActiveColor = colors.textNeutralHeavy;
-BasicThemeClass.linkButtonLineHeight = '34px';
-BasicThemeClass.linkButtonPaddingX = '10px';
-BasicThemeClass.linkTextDecorationStyle = 'solid';
-BasicThemeClass.linkTextDecorationThickness = '1px';
-BasicThemeClass.linkTextUnderlineOffset = '4px';
-BasicThemeClass.linkTextUnderlineOpacity = '0.5';
-BasicThemeClass.linkTextDecorationColor = "color-mix(in srgb, currentColor " + parseFloat(_BasicThemeClass.linkTextUnderlineOpacity) * 100 + "%, transparent)";
-BasicThemeClass.linkLineBorderBottomStyle = 'solid';
-BasicThemeClass.linkLineBorderBottomWidth = '1px';
-BasicThemeClass.linkLineBorderBottomOpacity = '0.5';
-BasicThemeClass.linkLineBorderBottomColor = "color-mix(in srgb, currentColor " + parseFloat(_BasicThemeClass.linkLineBorderBottomOpacity) * 100 + "%, transparent)";
-BasicThemeClass.linkFocusOutlineColor = colors.lineAccentBold;
-BasicThemeClass.tokenDisabledBg = colors.shapeOtherDisabled;
-BasicThemeClass.tokenMarginYSmall = '2px';
-BasicThemeClass.tokenMarginXSmall = '1px';
-BasicThemeClass.tokenMarginYMedium = '2px';
-BasicThemeClass.tokenMarginXMedium = '2px';
-BasicThemeClass.tokenMarginYLarge = '2px';
-BasicThemeClass.tokenMarginXLarge = '3px';
-BasicThemeClass.tokenPaddingYSmall = '1px';
-BasicThemeClass.tokenPaddingXSmall = '3px';
-BasicThemeClass.tokenPaddingYMedium = '2px';
-BasicThemeClass.tokenPaddingXMedium = '5px';
-BasicThemeClass.tokenPaddingYLarge = '3px';
-BasicThemeClass.tokenPaddingXLarge = '7px';
-BasicThemeClass.tokenMarginBeforeIcon = '4px';
-BasicThemeClass.tokenRemoveIconSize = '16px';
-BasicThemeClass.tokenRemoveIconPaddingY = '0px';
-BasicThemeClass.tokenRemoveIconPaddingX = '0px';
-BasicThemeClass.tokenRemoveIconGap = '4px';
-BasicThemeClass.tokenRemoveIconBoxSizing = 'content-box';
-BasicThemeClass.tokenBorderRadius = '2px';
-BasicThemeClass.tokenBorderWidth = '1px';
-BasicThemeClass.tokenBorderColorDisabled = 'transparent';
-BasicThemeClass.tokenOutlineWidth = '1px';
-BasicThemeClass.tokenShadowDisabled = '';
-BasicThemeClass.tokenBg = colors.shapeFaintNeutralAlpha;
-BasicThemeClass.tokenColor = colors.textNeutralHeavy;
-BasicThemeClass.tokenBorderColor = colors.lineNeutralPale;
-BasicThemeClass.tokenBgHover = colors.shapeFaintNeutralAlphaHover;
-BasicThemeClass.tokenBorderColorHover = colors.lineNeutralPale;
-BasicThemeClass.tokenBgActive = colors.shapeBoldAccent;
-BasicThemeClass.tokenColorActive = colors.textOnAccentBoldHeavy;
-BasicThemeClass.tokenBorderColorActive = 'transparent';
-BasicThemeClass.tokenInputBorderRadius = '2px';
-BasicThemeClass.tokenInputMenuPopupBg = 'transparent';
-BasicThemeClass.tokenInputPaddingYSmall = '1px';
-BasicThemeClass.tokenInputPaddingXSmall = '2px';
-BasicThemeClass.tokenInputPaddingYMedium = '3px';
-BasicThemeClass.tokenInputPaddingXMedium = '3px';
-BasicThemeClass.tokenInputPaddingYLarge = '5px';
-BasicThemeClass.tokenInputPaddingXLarge = '4px';
-BasicThemeClass.tokenInputPopupOffset = '2px';
-BasicThemeClass.tokenInputPopupMarginSmall = '7px';
-BasicThemeClass.tokenInputPopupMarginMedium = '10px';
-BasicThemeClass.tokenInputPopupMarginLarge = '13px'; //#endregion TokenInput
-//#region Loader
-BasicThemeClass.loaderBg = colors.shapeInvertedNeutralHeavy;
-BasicThemeClass.loaderOpacity = '0.8';
-BasicThemeClass.loaderBorderRadius = '0px'; //#endregion
-//#region Button
-BasicThemeClass.btnBackgroundClip = 'padding-box';
-BasicThemeClass.btnLinkBorderRadius = '2px';
-BasicThemeClass.btnFocusShadowWidth = '2px';
-BasicThemeClass.btnBorderColorTransition = '';
-BasicThemeClass.btnDisabledBorderColor = colors.lineNeutralFaint;
-BasicThemeClass.btnCheckedBg = colors.shapeBoldAccent;
-BasicThemeClass.btnCheckedDisabledBg = colors.shapeOtherAccentBoldDisabled;
-BasicThemeClass.btnCheckedDisabledColor = colors.textInvertedNeutralSoft;
-BasicThemeClass.btnCheckedTextColor = colors.textOnAccentBoldHeavy;
-BasicThemeClass.btnCheckedShadow = 'none';
-BasicThemeClass.btnCheckedDisabledShadow = 'none';
-BasicThemeClass.btnBorderRadiusSmall = '8px';
-BasicThemeClass.btnBorderRadiusMedium = '8px';
-BasicThemeClass.btnBorderRadiusLarge = '8px';
-BasicThemeClass.btnInsetWidth = '1px';
-BasicThemeClass.btnPaddingXSmall = '12px';
-BasicThemeClass.btnPaddingXMedium = '16px';
-BasicThemeClass.btnPaddingXLarge = '20px';
-BasicThemeClass.btnIconGapSmallLeft = '4px';
-BasicThemeClass.btnIconGapMediumLeft = '6px';
-BasicThemeClass.btnIconGapLargeLeft = '8px';
-BasicThemeClass.btnIconSizeSmall = '16px';
-BasicThemeClass.btnIconSizeMedium = '20px';
-BasicThemeClass.btnIconSizeLarge = '24px';
-BasicThemeClass.btnDefaultBg = colors.shapeOtherBase;
-BasicThemeClass.btnDefaultBgStart = 'none';
-BasicThemeClass.btnDefaultBgEnd = 'none';
-BasicThemeClass.btnDefaultHoverBg = colors.shapeOtherBaseHover;
-BasicThemeClass.btnDefaultHoverBgStart = 'none';
-BasicThemeClass.btnDefaultHoverBgEnd = 'none';
-BasicThemeClass.btnDefaultActiveBg = colors.shapeOtherBasePressed;
-BasicThemeClass.btnDefaultHoverTextColor = colors.textNeutralHeavy;
-BasicThemeClass.btnDefaultBorderColor = colors.lineNeutralPale;
-BasicThemeClass.btnDefaultActiveShadow = 'none';
-BasicThemeClass.btnSuccessBg = colors.shapeBoldSuccess;
-BasicThemeClass.btnSuccessHoverBg = colors.shapeBoldSuccessHover;
-BasicThemeClass.btnSuccessHoverTextColor = colors.textConstHeavyWhite;
-BasicThemeClass.btnSuccessBgStart = 'none';
-BasicThemeClass.btnSuccessBgEnd = 'none';
-BasicThemeClass.btnSuccessTextColor = colors.textConstHeavyWhite;
-BasicThemeClass.btnSuccessHoverBgStart = 'none';
-BasicThemeClass.btnSuccessHoverBgEnd = 'none';
-BasicThemeClass.btnSuccessActiveBg = colors.shapeBoldSuccessPressed;
-BasicThemeClass.btnSuccessActiveShadow = 'none';
-BasicThemeClass.btnPrimaryBg = colors.shapeBoldAccent;
-BasicThemeClass.btnPrimaryHoverBg = colors.shapeBoldAccentHover;
-BasicThemeClass.btnPrimaryActiveBg = colors.shapeBoldAccentPressed;
-BasicThemeClass.btnPrimaryHoverTextColor = '';
-BasicThemeClass.btnPrimaryBgStart = 'none';
-BasicThemeClass.btnPrimaryBgEnd = 'none';
-BasicThemeClass.btnPrimaryTextColor = colors.textOnAccentBoldHeavy;
-BasicThemeClass.btnPrimaryHoverBgStart = 'none';
-BasicThemeClass.btnPrimaryHoverBgEnd = 'none';
-BasicThemeClass.btnPrimaryActiveShadow = 'none';
-BasicThemeClass.btnDangerHoverBg = colors.shapeBoldErrorHover;
-BasicThemeClass.btnDangerHoverTextColor = '';
-BasicThemeClass.btnDangerBgStart = 'none';
-BasicThemeClass.btnDangerBgEnd = 'none';
-BasicThemeClass.btnDangerTextColor = colors.textConstHeavyWhite;
-BasicThemeClass.btnDangerHoverBgStart = 'none';
-BasicThemeClass.btnDangerHoverBgEnd = 'none';
-BasicThemeClass.btnDangerActiveBg = colors.shapeBoldErrorPressed;
-BasicThemeClass.btnDangerActiveShadow = 'none';
-BasicThemeClass.btnPayBg = colors.shapeBoldWarning;
-BasicThemeClass.btnPayHoverBg = colors.shapeBoldWarningHover;
-BasicThemeClass.btnPayHoverTextColor = '';
-BasicThemeClass.btnPayBgStart = 'none';
-BasicThemeClass.btnPayBgEnd = 'none';
-BasicThemeClass.btnPayHoverBgStart = 'none';
-BasicThemeClass.btnPayHoverBgEnd = 'none';
-BasicThemeClass.btnPayActiveBg = colors.shapeBoldWarningPressed;
-BasicThemeClass.btnPayActiveShadow = 'none';
-BasicThemeClass.btnMenuArrowColor = colors.textNeutralSoft;
-BasicThemeClass.btnDisabledBg = colors.shapeOtherDisabled;
-BasicThemeClass.btnInsetColor = colors.surfaceBase;
-BasicThemeClass.btnBacklessBg = 'transparent';
-BasicThemeClass.btnBacklessHoverBg = colors.shapeOtherBacklessHover;
-BasicThemeClass.btnBacklessActiveBg = colors.shapeOtherBacklessPressed;
-BasicThemeClass.btnBacklessHoverTextColor = '';
-BasicThemeClass.btnTextBg = 'transparent';
-BasicThemeClass.btnTextHoverBg = colors.shapeOtherBacklessHover;
-BasicThemeClass.btnTextActiveBg = colors.shapeOtherBacklessPressed;
-BasicThemeClass.btnTextHoverTextColor = '';
-BasicThemeClass.btnWithIconPaddingSmall = '8px';
-BasicThemeClass.btnWithIconPaddingMedium = '10px';
-BasicThemeClass.btnWithIconPaddingLarge = '12px';
-BasicThemeClass.btnIconColor = '';
-BasicThemeClass.btnIconHoverColor = '';
-BasicThemeClass.btnIconDisabledColor = '';
-BasicThemeClass.selectPlaceholderColor = _BasicThemeClass.placeholderColor;
-BasicThemeClass.selectPaddingXSmall = '7px';
-BasicThemeClass.selectPaddingXMedium = '11px';
-BasicThemeClass.selectPaddingXLarge = '15px';
-BasicThemeClass.selectRootWidthMobile = 'auto';
-BasicThemeClass.mobileSelectMaxWidth = '100%';
-BasicThemeClass.selectBorderColorTransition = "box-shadow " + _BasicThemeClass.transitionDuration + " " + _BasicThemeClass.transitionTimingFunction + ";"; //#endregion Select
-//#region Tooltip
-BasicThemeClass.tooltipPaddingYSmall = '16px';
-BasicThemeClass.tooltipPaddingXSmall = '16px';
-BasicThemeClass.tooltipPaddingYMedium = '20px';
-BasicThemeClass.tooltipPaddingXMedium = '20px';
-BasicThemeClass.tooltipPaddingYLarge = '24px';
-BasicThemeClass.tooltipPaddingXLarge = '24px';
-BasicThemeClass.tooltipCloseBtnPaddingSmall = '4px';
-BasicThemeClass.tooltipCloseBtnPaddingMedium = '6px';
-BasicThemeClass.tooltipCloseBtnPaddingLarge = '8px';
-BasicThemeClass.tooltipCloseBtnSide = '16px';
-BasicThemeClass.tooltipCloseBtnHoverColor = colors.textNeutralHeavy;
-BasicThemeClass.tooltipBg = colors.surfaceHigh;
-BasicThemeClass.tooltipBorderRadiusSmall = '8px';
-BasicThemeClass.tooltipBorderRadiusMedium = '10px';
-BasicThemeClass.tooltipBorderRadiusLarge = '12px';
-BasicThemeClass.tooltipPinOffsetYSmall = '18px';
-BasicThemeClass.tooltipPinOffsetYMedium = '21px';
-BasicThemeClass.tooltipPinOffsetYLarge = '24px';
-BasicThemeClass.tooltipPinOffsetXSmall = '16px';
-BasicThemeClass.tooltipPinOffsetXMedium = '20px';
-BasicThemeClass.tooltipPinOffsetXLarge = '24px';
-BasicThemeClass.tooltipMarginSmall = '10px';
-BasicThemeClass.tooltipMarginMedium = '12px';
-BasicThemeClass.tooltipMarginLarge = '14px';
-BasicThemeClass.tooltipPinSizeSmall = '8px';
-BasicThemeClass.tooltipPinSizeMedium = '10px';
-BasicThemeClass.tooltipPinSizeLarge = '12px';
-BasicThemeClass.kebabMargin = '4px';
-BasicThemeClass.kebabBackground = 'transparent';
-BasicThemeClass.kebabBackgroundHover = colors.shapeOtherBacklessHover;
-BasicThemeClass.kebabBackgroundActive = colors.shapeOtherBacklessPressed;
-BasicThemeClass.kebabBorderRadius = '50%';
-BasicThemeClass.kebabBorder = '2px solid transparent';
-BasicThemeClass.kebabSizeSmall = '24px';
-BasicThemeClass.kebabSizeMedium = '32px';
-BasicThemeClass.kebabSizeLarge = '40px';
-BasicThemeClass.kebabIconSizeSmall = '16px';
-BasicThemeClass.kebabIconSizeMedium = '20px';
-BasicThemeClass.kebabIconSizeLarge = '24px';
-BasicThemeClass.kebabIconColor = colors.textNeutralSoft; //#endregion
-//#region Modal
-BasicThemeClass.modalWindowShadow = '0px 16px 32px 0px rgba(0, 0, 0, 0.06)';
-BasicThemeClass.modalBackBg = colors.surfaceModalBackdrop;
-BasicThemeClass.modalBackOpacity = '1';
-BasicThemeClass.modalCloseButtonDisabledColor = colors.textNeutralFaint;
-BasicThemeClass.modalCloseButtonHoverColor = colors.textNeutralHeavy;
-BasicThemeClass.modalCloseButtonPadding = '32px';
-BasicThemeClass.modalCloseButtonBottomPadding = '20px';
-BasicThemeClass.modalCloseButtonClickAreaTop = '30px';
-BasicThemeClass.modalCloseButtonClickAreaBottom = '22px';
-BasicThemeClass.modalCloseButtonClickAreaLeft = '24px';
-BasicThemeClass.modalCloseButtonClickAreaRight = '28px';
-BasicThemeClass.modalCloseIconSize = '20px';
-BasicThemeClass.modalBorderRadius = '16px';
-BasicThemeClass.modalFixedHeaderBorder = 'none';
-BasicThemeClass.modalFixedFooterBorder = 'none';
-BasicThemeClass.modalFixedPanelShadow = 'none';
-BasicThemeClass.modalAdaptiveThreshold = '425px';
-BasicThemeClass.modalPaddingTop = '24px';
-BasicThemeClass.modalPaddingLeft = '32px';
-BasicThemeClass.modalPaddingRight = '32px';
-BasicThemeClass.modalHeaderFontSize = '24px';
-BasicThemeClass.modalHeaderFontWeight = '700';
-BasicThemeClass.modalHeaderLineHeight = '32px';
-BasicThemeClass.modalHeaderPaddingBottom = '16px';
-BasicThemeClass.modalHeaderPaddingTop = '24px';
-BasicThemeClass.modalFixedHeaderMarginBottom = '0px';
-BasicThemeClass.modalFixedFooterMarginTop = '0px';
-BasicThemeClass.modalSeparatorBorderBottom = "1px solid " + colors.lineNeutralFaint;
-BasicThemeClass.modalSeparatorMargin = '0 32px';
-BasicThemeClass.modalSeparatorFixedMargin = '0 16px';
-BasicThemeClass.modalBodyTextColor = 'inherit';
-BasicThemeClass.modalFooterTextColor = 'inherit';
-BasicThemeClass.modalBodyPaddingTop = '0';
-BasicThemeClass.modalBodyPaddingBottom = '20px';
-BasicThemeClass.modalBodyBorderRadius = '0px';
-BasicThemeClass.modalFooterPaddingTop = '0px';
-BasicThemeClass.modalFooterPaddingBottom = '20px';
-BasicThemeClass.modalPaddingBottom = '40px';
-BasicThemeClass.modalFooterPanelPaddingTop = '20px';
-BasicThemeClass.mobileModalCloseButtonClickArea = '22px';
-BasicThemeClass.mobileModalWithoutHeaderCloseButtonPadding = '10px';
-BasicThemeClass.mobileModalCloseIconSize = '20px';
-BasicThemeClass.mobileModalHeaderFontSize = '24px';
-BasicThemeClass.mobileModalHeaderLineHeight = '32px';
-BasicThemeClass.mobileModalHeaderPadding = '16px';
-BasicThemeClass.mobileModalBodyPadding = '0 16px 0 16px';
-BasicThemeClass.mobileModalBodyPaddingTop = '16px';
-BasicThemeClass.mobileModalBodyPaddingBottom = '16px';
-BasicThemeClass.mobileModalBodyFontSize = '16px';
-BasicThemeClass.mobileModalFooterPadding = '16px';
-BasicThemeClass.mobileModalPaddingBottom = '16px';
-BasicThemeClass.mobileModalContainerHeight = '100%';
-BasicThemeClass.mobileModalContainerMarginTop = '16px';
-BasicThemeClass.mobileModalContainerMarginRight = '16px';
-BasicThemeClass.mobileModalContainerMarginBottom = '16px';
-BasicThemeClass.mobileModalContainerMarginLeft = '16px';
-BasicThemeClass.sidePageBackingBg = colors.surfaceModalBackdrop;
-BasicThemeClass.sidePageBackingBgOpacity = '1';
-BasicThemeClass.sidePageCloseButtonColor = colors.textNeutralPale;
-BasicThemeClass.sidePageCloseButtonHoverColor = colors.textNeutralHeavy;
-BasicThemeClass.sidePageContainerShadow = '0 5px 10px rgba(0, 0, 0, 0.2)';
-BasicThemeClass.mobileSidePagePaddingLeft = '16px';
-BasicThemeClass.mobileSidePagePaddingRight = '16px';
-BasicThemeClass.mobileSidePagePaddingTop = '16px';
-BasicThemeClass.mobileSidePagePaddingBottom = '16px';
-BasicThemeClass.mobileSidePageFooterPadding = '16px';
-BasicThemeClass.sidePagePaddingLeft = '32px';
-BasicThemeClass.sidePagePaddingRight = '36px';
-BasicThemeClass.sidePagePaddingTop = '24px';
-BasicThemeClass.sidePagePaddingBottom = '40px';
-BasicThemeClass.sidePageFooterPaddingTop = '20px';
-BasicThemeClass.sidePageFooterPaddingBottom = '20px';
-BasicThemeClass.sidePageBgDefault = colors.surfaceHigh;
-BasicThemeClass.sidePageBodyTextColor = 'inherit';
-BasicThemeClass.sidePageFooterTextColor = 'inherit';
-BasicThemeClass.sidePageHeaderFontSize = '24px';
-BasicThemeClass.sidePageHeaderLineHeight = '32px';
-BasicThemeClass.sidePageHeaderPaddingBottom = '16px';
-BasicThemeClass.sidePageHeaderPaddingTop = '24px';
-BasicThemeClass.sidePageHeaderStickyOffset = '10px';
-BasicThemeClass.sidePageCloseIconSize = '20px';
-BasicThemeClass.sidePageCloseButtonFixedClickAreaBottom = '14px';
-BasicThemeClass.mobileSidePageCloseButtonClickArea = '22px';
-BasicThemeClass.sidePageFixedPanelShadow = 'none';
-BasicThemeClass.mobileSidePageHeaderFontSize = '24px';
-BasicThemeClass.mobileSidePageHeaderLineHeight = '32px';
-BasicThemeClass.mobileSidePageHeaderPaddingBottom = '16px';
-BasicThemeClass.mobileSidePageHeaderPaddingTop = '16px';
-BasicThemeClass.sidePageHeaderFontWeight = 'bold';
-BasicThemeClass.sidePageCloseButtonWrapperOffsetTop = '2px';
-BasicThemeClass.sidePageCloseButtonWrapperFixedOffsetTop = '4px';
-BasicThemeClass.dateInputMaskColor = colors.textNeutralFaint;
-BasicThemeClass.dateInputComponentSelectedBgColor = '';
-BasicThemeClass.dateInputComponentSelectedTextColor = ''; //#endregion DateInput
-//#region Calendar
-BasicThemeClass.calendarBottomSeparatorBorderColor = colors.lineNeutralFaint;
-BasicThemeClass.calendarBorderRadius = '8px';
-BasicThemeClass.calendarCellHoverColor = '';
-BasicThemeClass.calendarCellActiveHoverColor = '';
-BasicThemeClass.calendarCellTodayBorder = '1px solid';
-BasicThemeClass.calendarCellBorderRadius = '9999px';
-BasicThemeClass.calendarCellSelectedBgColor = colors.shapeBoldAccent;
-BasicThemeClass.calendarCellSelectedFontColor = colors.textOnAccentBoldHeavy;
-BasicThemeClass.calendarCellHeight = '32px';
-BasicThemeClass.calendarCellFontSize = '14px';
-BasicThemeClass.calendarMonthTitleBorderBottomColor = colors.lineNeutralFaint;
-BasicThemeClass.calendarCellHoverBgColor = colors.shapeOtherBacklessHover;
-BasicThemeClass.calendarPaddingX = '18px';
-BasicThemeClass.calendarMonthTitleLineHeight = '20px';
-BasicThemeClass.calendarMonthTitlePaddingTop = '12px';
-BasicThemeClass.calendarMonthTitlePaddingBottom = '8px';
-BasicThemeClass.calendarMonthTitleMarginX = '6px';
-BasicThemeClass.calendarMonthTitleMarginBottom = '6px';
-BasicThemeClass.calendarWrapperHeight = ' 330px';
-BasicThemeClass.calendarMonthMarginBottom = '6px';
-BasicThemeClass.calendarMaxMonthsToAppendOnScroll = '5';
-BasicThemeClass.calendarGridRowSpacing = '0px';
-BasicThemeClass.pickerShadow = '0px 32px 32px -16px rgba(0, 0, 0, 0.08), 0px 0px 24px 0px rgba(0, 0, 0, 0.12)';
-BasicThemeClass.mobileCalendarPaddingX = '16px';
-BasicThemeClass.mobileCalendarCellWidth = '40px';
-BasicThemeClass.mobileCalendarCellHeight = '40px';
-BasicThemeClass.mobileCalendarCellBorderRadius = '20px';
-BasicThemeClass.mobileCalendarCellFontSize = '16px';
-BasicThemeClass.mobileCalendarGridRowSpacing = '8px';
-BasicThemeClass.mobileCalendarWrapperHeight = '304px'; //#endregion DatePicker
-//#region DateRangePicker
-BasicThemeClass.rangeCalendarCellBg = colors.shapeFaintNeutralAlpha;
-BasicThemeClass.rangeCalendarCellEndBg = colors.shapeBoldAccent;
-BasicThemeClass.rangeCalendarCellEndColor = colors.textOnAccentBoldHeavy;
-BasicThemeClass.rangeCalendarCellHoverBg = colors.shapeOtherBacklessHover;
-BasicThemeClass.rangeCalendarWrapperHeight = '450px';
-BasicThemeClass.mobileRangeCalendarCellHeight = '42px';
-BasicThemeClass.mobileRangeCalendarCellWidth = '42px';
-BasicThemeClass.mobileRangeCalendarGridRowSpacing = '0px';
-BasicThemeClass.mobileRangeCalendarWrapperHeight = '400px';
-BasicThemeClass.dateSelectMenuItemBgActive = '#F0F0F0';
-BasicThemeClass.dateSelectMenuItemFontActive = '';
-BasicThemeClass.dateSelectLineHeight = '20px';
-BasicThemeClass.dateSelectFontSize = '14px';
-BasicThemeClass.dateSelectFontWeight = 'bold';
-BasicThemeClass.dateSelectMenuItemBgSelected = '#ececec';
-BasicThemeClass.dateSelectTextColorInvert = '';
-BasicThemeClass.mobileDateSelectFontSize = '16px';
-BasicThemeClass.mobileDateSelectLineHeight = '20px';
-BasicThemeClass.pagingPageLinkBoxSizing = 'border-box';
-BasicThemeClass.pagingPageLinkPaddingYSmall = '6px';
-BasicThemeClass.pagingPageLinkPaddingXSmall = '11.5px';
-BasicThemeClass.pagingPageLinkPaddingYMedium = '9px';
-BasicThemeClass.pagingPageLinkPaddingXMedium = '15px';
-BasicThemeClass.pagingPageLinkPaddingYLarge = '12px';
-BasicThemeClass.pagingPageLinkPaddingXLarge = '18.5px';
-BasicThemeClass.pagingPageLinkBorderRadius = '9999px';
-BasicThemeClass.pagingPageLinkActiveBg = colors.shapeOtherBacklessPressed;
-BasicThemeClass.pagingPageLinkDisabledActiveBg = colors.shapeOtherDisabled;
-BasicThemeClass.pagingPageLinkHoverBg = colors.shapeOtherBacklessHover;
-BasicThemeClass.pagingForwardLinkPaddingSmall = '6px 8px 6px 12px';
-BasicThemeClass.pagingForwardLinkPaddingMedium = '9px 12px 9px 16px';
-BasicThemeClass.pagingForwardLinkPaddingLarge = '12px 16px 12px 20px';
-BasicThemeClass.pagingForwardLinkPaddingMediumMobile = '10px';
-BasicThemeClass.pagingForwardLinkPaddingLargeMobile = '12px';
-BasicThemeClass.pagingDotsPaddingSmall = '11px 8px 5px 8px';
-BasicThemeClass.pagingDotsPaddingMedium = '14px 12px 10px 12px';
-BasicThemeClass.pagingDotsPaddingLarge = '19px 16px 13px 16px';
-BasicThemeClass.pagingDotsColor = colors.textNeutralFaint;
-BasicThemeClass.pagingPageLinkHintFontSize = '12px';
-BasicThemeClass.pagingPageLinkHintLineHeight = '16px';
-BasicThemeClass.pagingPageLinkHintMargin = '4px -20px 0px';
-BasicThemeClass.hintMaxWidth = '200px';
-BasicThemeClass.hintPaddingY = '4px';
-BasicThemeClass.hintPaddingX = '8px';
-BasicThemeClass.hintTextAlign = 'center';
-BasicThemeClass.hintBgColor = colors.shapeHeavyNeutral;
-BasicThemeClass.hintBorder = 'none';
-BasicThemeClass.hintBorderRadius = '6px';
-BasicThemeClass.hintMargin = '8px';
-BasicThemeClass.toastPaddingY = '10px';
-BasicThemeClass.toastPaddingX = '16px';
-BasicThemeClass.toastBorderRadius = '8px';
-BasicThemeClass.toastBorder = 'none';
-BasicThemeClass.toastTop = '24px';
-BasicThemeClass.toastBg = colors.shapeHeavyNeutral;
-BasicThemeClass.toastErrorBg = colors.shapeBoldError;
-BasicThemeClass.toastColor = colors.textInvertedNeutralHeavy;
-BasicThemeClass.toastColorError = colors.textConstHeavyWhite;
-BasicThemeClass.toastLinkColor = colors.textInvertedNeutralHeavy;
-BasicThemeClass.toastLinkColorError = colors.textConstHeavyWhite;
-BasicThemeClass.toastLinkTextDecorationHover = '';
-BasicThemeClass.toastLinkBgHover = colors.shapeInvertedBacklessHover;
-BasicThemeClass.toastLinkBgHoverError = colors.shapeConstBacklessWhiteHover;
-BasicThemeClass.toastLinkBgActive = colors.shapeInvertedBacklessPressed;
-BasicThemeClass.toastLinkBgActiveError = colors.shapeConstBacklessWhiteHover;
-BasicThemeClass.toastLinkColorActiveError = colors.textConstHeavyWhite;
-BasicThemeClass.toastLinkPadding = '12px';
-BasicThemeClass.toastClosePadding = '16px';
-BasicThemeClass.toastCloseColor = colors.textInvertedNeutralSoft;
-BasicThemeClass.toastCloseColorError = colors.textConstSoftWhite;
-BasicThemeClass.toastCloseHoverColor = colors.textInvertedNeutralHeavy;
-BasicThemeClass.toastCloseHoverColorError = colors.textConstHeavyWhite;
-BasicThemeClass.toastCloseSize = '16px'; //#endregion Toast
-//#region Dropdown
-BasicThemeClass.dropdownMenuBorderColorTransition = '';
-BasicThemeClass.dropdownMenuMenuBoxSizing = 'content-box';
-BasicThemeClass.dropdownButtonBorderRadiusSmall = '8px';
-BasicThemeClass.dropdownButtonBorderRadiusMedium = '8px';
-BasicThemeClass.dropdownButtonBorderRadiusLarge = '8px';
-BasicThemeClass.menuBorderRadius = '8px';
-BasicThemeClass.menuBorder = 'none';
-BasicThemeClass.menuShadow = '0px 32px 32px -16px rgba(0, 0, 0, 0.08), 0px 0px 24px 0px rgba(0, 0, 0, 0.12)';
-BasicThemeClass.menuPaddingY = '0px';
-BasicThemeClass.menuScrollContainerContentWrapperPaddingY = '4px';
-BasicThemeClass.mobileMenuPaddingY = '0px';
-BasicThemeClass.mobileMenuScrollContainerContentWrapperPaddingY = '0px';
-BasicThemeClass.menuPaddingX = '4px';
-BasicThemeClass.mobileMenuPaddingX = '8px';
-BasicThemeClass.menuOffsetY = '4px';
-BasicThemeClass.menuBoxSizing = 'border-box';
-BasicThemeClass.menuItemSelectedBg = colors.shapeOtherBacklessPressed;
-BasicThemeClass.menuItemHoverBg = colors.shapeOtherBacklessHover;
-BasicThemeClass.menuItemIconWidthSmall = '16px';
-BasicThemeClass.menuItemIconWidthMedium = '20px';
-BasicThemeClass.menuItemIconWidthLarge = '24px';
-BasicThemeClass.menuItemIconGap = '4px';
-BasicThemeClass.menuItemPaddingXSmall = '8px';
-BasicThemeClass.menuItemPaddingYSmall = '6px';
-BasicThemeClass.menuItemPaddingXMedium = '12px';
-BasicThemeClass.menuItemPaddingYMedium = '9px';
-BasicThemeClass.menuItemPaddingXLarge = '16px';
-BasicThemeClass.menuItemPaddingYLarge = '12px';
-BasicThemeClass.menuItemBorderRadius = '6px';
-BasicThemeClass.menuItemCommentOpacity = '1';
-BasicThemeClass.menuItemCommentOpacityHover = '0.6';
-BasicThemeClass.menuItemDisplay = 'block';
-BasicThemeClass.menuItemPaddingMobile = '12px 16px';
-BasicThemeClass.menuItemDisabledBg = 'transparent';
-BasicThemeClass.menuItemGap = '1px'; //menuHeader
-BasicThemeClass.menuHeaderColor = colors.textNeutralSoft;
-BasicThemeClass.menuHeaderLineHeightSmall = '16px';
-BasicThemeClass.menuHeaderLineHeightMedium = '20px';
-BasicThemeClass.menuHeaderLineHeightLarge = '22px';
-BasicThemeClass.menuHeaderFontSizeSmall = '12px';
-BasicThemeClass.menuHeaderFontSizeMedium = '14px';
-BasicThemeClass.menuHeaderFontSizeLarge = '16px';
-BasicThemeClass.menuHeaderPaddingXSmall = '8px';
-BasicThemeClass.menuHeaderPaddingTopSmall = '12px';
-BasicThemeClass.menuHeaderPaddingBottomSmall = '4px';
-BasicThemeClass.menuHeaderPaddingXMedium = '12px';
-BasicThemeClass.menuHeaderPaddingTopMedium = '14px';
-BasicThemeClass.menuHeaderPaddingBottomMedium = '6px';
-BasicThemeClass.menuHeaderPaddingXLarge = '16px';
-BasicThemeClass.menuHeaderPaddingTopLarge = '18px';
-BasicThemeClass.menuHeaderPaddingBottomLarge = '8px';
-BasicThemeClass.menuHeaderTotalCountPaddingTopSmall = '4px';
-BasicThemeClass.menuHeaderTotalCountPaddingTopMedium = '6px';
-BasicThemeClass.menuHeaderTotalCountPaddingTopLarge = '8px';
-BasicThemeClass.menuHeaderTotalCountPaddingBottomSmall = '12px';
-BasicThemeClass.menuHeaderTotalCountPaddingBottomMedium = '14px';
-BasicThemeClass.menuHeaderTotalCountPaddingBottomLarge = '18px';
-BasicThemeClass.menuSeparatorBorderColor = colors.lineNeutralFaint;
-BasicThemeClass.menuSeparatorMarginY = '2px';
-BasicThemeClass.menuSeparatorMarginX = '8px';
-BasicThemeClass.menuSeparatorBorderWidth = '1px'; // mobileMenuSeparator
-BasicThemeClass.mobileMenuSeparatorMarginY = '4px';
-BasicThemeClass.mobileMenuSeparatorMarginX = '24px';
-BasicThemeClass.toggleHandleActiveWidthIncrement = '0px';
-BasicThemeClass.toggleHeightSmall = '20px';
-BasicThemeClass.toggleWidthSmall = '32px';
-BasicThemeClass.toggleHeightMedium = '22px';
-BasicThemeClass.toggleWidthMedium = '34px';
-BasicThemeClass.toggleHeightLarge = '24px';
-BasicThemeClass.toggleWidthLarge = '36px';
-BasicThemeClass.toggleBaseBg = 'transparent';
-BasicThemeClass.toggleBgHover = colors.shapeOtherFieldHover;
-BasicThemeClass.toggleBorderColor = colors.lineNeutralPale;
-BasicThemeClass.toggleHandleSizeSmall = '14px';
-BasicThemeClass.toggleHandleSizeMedium = '16px';
-BasicThemeClass.toggleHandleSizeLarge = '18px';
-BasicThemeClass.toggleHandleLeft = '3px';
-BasicThemeClass.toggleHandleTop = '3px';
-BasicThemeClass.toggleBgFocus = 'linear-gradient(-180deg, #f1f1f1, #dedede)';
-BasicThemeClass.toggleCaptionGap = '8px';
-BasicThemeClass.toggleButtonOffsetY = '0px';
-BasicThemeClass.toggleContainerBg = colors.shapeOtherField;
-BasicThemeClass.toggleHandleBg = colors.shapeOtherBase;
-BasicThemeClass.toggleHandleBoxShadow = "0 0 0 1px " + colors.lineNeutralPale;
-BasicThemeClass.toggleContainerBoxShadow = "inset 0 0 0 1px " + colors.lineNeutralPale; // idle :hover
-BasicThemeClass.toggleContainerBoxShadowHover = "inset 0 0 0 1px " + colors.lineNeutralPaleHover;
-BasicThemeClass.toggleHandleBgHover = colors.shapeOtherBase;
-BasicThemeClass.toggleHandleBoxShadowHover = "0 0 0 1px " + colors.lineNeutralPale;
-BasicThemeClass.toggleContainerBoxShadowChecked = 'none';
-BasicThemeClass.toggleHandleBoxShadowChecked = 'none';
-BasicThemeClass.toggleHandleBgChecked = colors.shapeInvertedNeutralHeavy;
-BasicThemeClass.toggleBgChecked = colors.shapeBoldAccent;
-BasicThemeClass.toggleCheckedBg = '#fff';
-BasicThemeClass.toggleCheckedBgHover = '#fff'; // checked :hover
-BasicThemeClass.toggleContainerBoxShadowCheckedHover = 'none';
-BasicThemeClass.toggleContainerBgCheckedHover = colors.shapeBoldAccentHover;
-BasicThemeClass.toggleHandleBoxShadowCheckedHover = 'none';
-BasicThemeClass.toggleHandleBgCheckedHover = colors.shapeInvertedNeutralHeavyHover; // disabled
-BasicThemeClass.toggleContainerBgDisabled = colors.shapeOtherDisabled;
-BasicThemeClass.toggleHandleBgDisabled = 'transparent';
-BasicThemeClass.toggleContainerBoxShadowDisabled = "inset 0 0 0 1px " + colors.lineNeutralFaint;
-BasicThemeClass.toggleHandleBoxShadowDisabled = "0 0 0 1px " + colors.lineNeutralFaint;
-BasicThemeClass.toggleDisabledHandleBg = 'transparent';
-BasicThemeClass.toggleContainerBgDisabledChecked = colors.shapeOtherAccentBoldDisabled;
-BasicThemeClass.toggleHandleBgDisabledChecked = colors.shapeInvertedNeutralHeavy;
-BasicThemeClass.toggleContainerBoxShadowDisabledChecked = 'none';
-BasicThemeClass.toggleHandleBoxShadowDisabledChecked = 'none';
-BasicThemeClass.toggleBgDisabledChecked = '#dadada'; //#endregion Toggle
-//#region Popup
-BasicThemeClass.popupBorder = 'none';
-BasicThemeClass.popupBorderRadius = '8px';
-BasicThemeClass.popupBorderColor = 'transparent';
-BasicThemeClass.popupDropShadow = 'drop-shadow(0px 32px 32px rgba(0, 0, 0, 0.08)) drop-shadow(0px 0px 24px rgba(0, 0, 0, 0.12))';
-BasicThemeClass.popupBoxShadow = '0px 32px 32px -16px rgba(0, 0, 0, 0.08), 0px 0px 24px 0px rgba(0, 0, 0, 0.12)';
-BasicThemeClass.popupPinOffsetX = '16px';
-BasicThemeClass.popupPinOffsetY = '16px';
-BasicThemeClass.popupMargin = '10px';
-BasicThemeClass.popupPinSize = '8px';
-BasicThemeClass.popupMenuMenuOffsetY = '0px';
-BasicThemeClass.inputShadow = 'none';
-BasicThemeClass.inputBg = colors.shapeOtherField;
-BasicThemeClass.inputIconColor = colors.textNeutralSoft;
-BasicThemeClass.inputColor = 'inherit';
-BasicThemeClass.inputWidth = '200px';
-BasicThemeClass.inputPaddingXSmall = '7px';
-BasicThemeClass.inputPaddingXMedium = '11px';
-BasicThemeClass.inputPaddingXLarge = '15px';
-BasicThemeClass.inputIconGapSmall = '4px';
-BasicThemeClass.inputIconGapMedium = '6px';
-BasicThemeClass.inputIconGapLarge = '8px';
-BasicThemeClass.inputIconSizeSmall = '16px';
-BasicThemeClass.inputIconSizeMedium = '20px';
-BasicThemeClass.inputIconSizeLarge = '24px';
-BasicThemeClass.inputBackgroundClip = 'padding-box';
-BasicThemeClass.inputBorderRadiusSmall = '2px';
-BasicThemeClass.inputBorderRadiusMedium = '2px';
-BasicThemeClass.inputBorderRadiusLarge = '2px';
-BasicThemeClass.inputDisabledBackgroundClip = 'padding-box';
-BasicThemeClass.inputBorderColor = colors.lineNeutralPale;
-BasicThemeClass.inputBlinkColor = colors.shapeFaintNeutralAlpha;
-BasicThemeClass.inputColorScheme = 'light';
-BasicThemeClass.checkboxBoxSizeSmall = '16px';
-BasicThemeClass.checkboxBoxSizeMedium = '20px';
-BasicThemeClass.checkboxBoxSizeLarge = '24px';
-BasicThemeClass.checkboxCaptionGap = '8px';
-BasicThemeClass.checkboxPaddingXSmall = '0';
-BasicThemeClass.checkboxPaddingXMedium = '0';
-BasicThemeClass.checkboxPaddingXLarge = '0';
-BasicThemeClass.checkboxBoxOffsetY = '1px';
-BasicThemeClass.checkboxBgStart = '#fdfdfd';
-BasicThemeClass.checkboxBgEnd = '#ededed';
-BasicThemeClass.checkboxBorder = 'none';
-BasicThemeClass.checkboxCheckedColor = colors.shapeInvertedNeutralHeavy;
-BasicThemeClass.checkboxBorderRadius = '4px';
-BasicThemeClass.checkboxBg = colors.shapeOtherField;
-BasicThemeClass.checkboxCheckedHoverBg = colors.shapeBoldAccentHover;
-BasicThemeClass.checkboxCheckedActiveBg = colors.shapeBoldAccentPressed;
-BasicThemeClass.textareaBg = colors.shapeOtherField;
-BasicThemeClass.textareaShadow = 'none';
-BasicThemeClass.textareaBackgroundClip = 'padding-box';
-BasicThemeClass.textareaBorderRadius = '2px';
-BasicThemeClass.textareaWidth = '250px';
-BasicThemeClass.textareaPaddingXSmall = '7px';
-BasicThemeClass.textareaPaddingXMedium = '11px';
-BasicThemeClass.textareaPaddingXLarge = '15px';
-BasicThemeClass.textareaBorderTopColor = colors.lineNeutralPale;
-BasicThemeClass.textareaCounterBg = 'transparent';
-BasicThemeClass.textareaMargin = '0px'; // обнуление вертикального браузерного margin в firefox
-BasicThemeClass.textareaVerticalAlign = 'top'; //#endregion Textarea
-//#region Radio
-BasicThemeClass.radioBulletSizeSmall = '6px';
-BasicThemeClass.radioBulletSizeMedium = '10px';
-BasicThemeClass.radioBulletSizeLarge = '12px';
-BasicThemeClass.radioSizeSmall = '16px';
-BasicThemeClass.radioSizeMedium = '20px';
-BasicThemeClass.radioSizeLarge = '24px';
-BasicThemeClass.radioCaptionGap = '8px';
-BasicThemeClass.radioVerticalAlign = 'top';
-BasicThemeClass.radioBgImage = 'none';
-BasicThemeClass.radioBgColor = colors.shapeOtherField;
-BasicThemeClass.radioBoxShadow = 'none';
-BasicThemeClass.radioHoverShadow = 'none';
-BasicThemeClass.radioActiveShadow = 'none';
-BasicThemeClass.radioCheckedBorderColor = 'transparent';
-BasicThemeClass.radioCaptionDisplay = 'inline-flex';
-BasicThemeClass.radioBorderWidthCompensation = '0px';
-BasicThemeClass.radioCircleOffsetY = '1px';
-BasicThemeClass.tabPaddingXSmall = '8px';
-BasicThemeClass.tabPaddingXMedium = '10px';
-BasicThemeClass.tabPaddingXLarge = '12px';
-BasicThemeClass.tabBorderWidth = '2px';
-BasicThemeClass.tabColorHover = colors.lineNeutralPale;
-BasicThemeClass.tabColorHoverError = colors.shapeBoldErrorHover;
-BasicThemeClass.tabColorHoverWarning = colors.shapeBoldWarningHover;
-BasicThemeClass.tabColorHoverSuccess = colors.shapeBoldSuccessHover;
-BasicThemeClass.tabColorHoverPrimary = colors.lineAccentPale;
-BasicThemeClass.tabIndicatorBorderRadius = '2px';
-BasicThemeClass.spinnerCaptionGapSmall = '6px';
-BasicThemeClass.spinnerCaptionGapMedium = '-4px';
-BasicThemeClass.spinnerCaptionGapLarge = '-3px';
-BasicThemeClass.spinnerCaptionMarginSmall = '0 0 0 6px';
-BasicThemeClass.spinnerCaptionMarginMedium = '0 0 0 6px';
-BasicThemeClass.spinnerCaptionMarginLarge = '0 0 0 6px'; //#endregion
-//#region Switcher
-BasicThemeClass.switcherBorderRadius = '8px';
-BasicThemeClass.switcherButtonPaddingXSmall = '7px';
-BasicThemeClass.switcherButtonPaddingXMedium = '11px';
-BasicThemeClass.switcherButtonPaddingXLarge = '15px';
-BasicThemeClass.switcherBtnDisabledBorderColor = colors.lineNeutralPale;
-BasicThemeClass.mobilePopupTopPadding = '80px';
-BasicThemeClass.mobilePopupContainerBottomPadding = '8px';
-BasicThemeClass.mobilePopupHeaderPadding = '16px 16px 8px 16px';
-BasicThemeClass.mobilePopupFooterPadding = '16px 16px 16px 16px';
-BasicThemeClass.mobilePopupContainerBorderRadius = '16px';
-BasicThemeClass.mobilePopupHeaderFontWeight = '500';
-BasicThemeClass.mobilePopupHeaderChildPadding = '12px';
-BasicThemeClass.mobilePopupOuterIndentY = '24px'; //#endregion
-//#region ScrollContainer
-BasicThemeClass.scrollContainerScrollBarSize = '4px';
-BasicThemeClass.scrollContainerScrollBarHoverSize = '10px';
-BasicThemeClass.scrollContainerScrollBarColor = colors.shapeSoftNeutralAlpha;
-BasicThemeClass.scrollContainerScrollBarInvertColor = colors.shapeInvertedNeutralSoftAlpha;
-BasicThemeClass.scrollContainerScrollBarOffsetY = '4px';
-BasicThemeClass.dropdownMenuScrollContainerScrollBarOffsetY = '0px'; //#endregion
-//#region PasswordInput
-BasicThemeClass.passwordInputVisibilityIconColor = colors.textNeutralHeavy;
-BasicThemeClass.passwordInputVisibilityIconOpacity = '0.64';
-BasicThemeClass.passwordInputVisibilityIconHoverColor = colors.textNeutralHeavy;
-BasicThemeClass.passwordInputVisibilityIconHoverOpacity = '1';
-BasicThemeClass.globalLoaderHeight = '4px';
-BasicThemeClass.globalLoaderWidth = '100%';
-BasicThemeClass.globalLoaderPosition = 'fixed';
-BasicThemeClass.globalLoaderTop = '0px';
-BasicThemeClass.globalLoaderLeft = '0px';
-BasicThemeClass.globalLoaderBottom = 'auto';
-BasicThemeClass.globalLoaderRight = 'auto';
-BasicThemeClass.globalLoaderBackgroundColor = 'transparent';
-BasicThemeClass.globalLoaderTransitionToSpinnerDuration = '500'; //ms
-BasicThemeClass.globalLoaderSpinnerAnimationDuration = '2000'; //ms
-BasicThemeClass.globalLoaderSlowAnimationDuration = '20000'; //ms
-BasicThemeClass.globalLoaderTransitionFromSpinnerDuration = '200'; //ms
-//#endregion
-//#region FileUploader
-BasicThemeClass.fileUploaderWidth = '362px';
-BasicThemeClass.fileUploaderTileWidth = 'auto';
-BasicThemeClass.fileUploaderBg = '';
-BasicThemeClass.fileUploaderUploadButtonBg = 'transparent';
-BasicThemeClass.fileUploaderPaddingXSmall = '7px';
-BasicThemeClass.fileUploaderPaddingXMedium = '9px';
-BasicThemeClass.fileUploaderPaddingXLarge = '11px';
-BasicThemeClass.fileUploaderTilePaddingSmall = '3px';
-BasicThemeClass.fileUploaderTilePaddingMedium = '5px';
-BasicThemeClass.fileUploaderTilePaddingLarge = '7px';
-BasicThemeClass.fileUploaderTileFilePaddingSmall = '7px';
-BasicThemeClass.fileUploaderTileFilePaddingMedium = '11px';
-BasicThemeClass.fileUploaderTileFilePaddingLarge = '15px';
-BasicThemeClass.fileUploaderTileIconActionPaddingSmall = '8px';
-BasicThemeClass.fileUploaderTileIconActionPaddingMedium = '6px';
-BasicThemeClass.fileUploaderTileIconActionPaddingLarge = '8px';
-BasicThemeClass.fileUploaderBorderRadius = '8px';
-BasicThemeClass.fileUploaderBorderStyle = 'dashed';
-BasicThemeClass.fileUploaderIconSize = '14px';
-BasicThemeClass.fileUploaderIconColor = colors.textNeutralPale;
-BasicThemeClass.fileUploaderIconHoverColor = colors.textNeutralHeavy;
-BasicThemeClass.fileUploaderTileIconColorBg = colors.shapeFaintAccent;
-BasicThemeClass.fileUploaderTileIconHoverColorBg = colors.shapeFaintAccentHover;
-BasicThemeClass.fileUploaderTileIconActiveColorBg = colors.shapeFaintAccentPressed;
-BasicThemeClass.fileUploaderTileIconColor = colors.textInvertedAccentHeavy;
-BasicThemeClass.fileUploaderTileIconHoverColor = colors.textInvertedAccentHeavyHover;
-BasicThemeClass.fileUploaderDisabledBgClip = 'padding-box';
-BasicThemeClass.fileUploaderDisabledBorderColor = colors.lineNeutralFaint;
-BasicThemeClass.fileUploaderErrorBgColor = colors.shapeFaintError;
-BasicThemeClass.fileUploaderErrorBgHoverColor = colors.shapeFaintErrorHover;
-BasicThemeClass.fileUploaderWarningBgColor = colors.shapeFaintWarning;
-BasicThemeClass.fileUploaderWarningBgHoverColor = colors.shapeFaintWarningHover;
-BasicThemeClass.fileUploaderValidationTextColor = colors.textWarningHeavy;
-BasicThemeClass.fileUploaderLinkHoverTextDecoration = 'none';
-BasicThemeClass.fileUploaderHoveredBg = colors.shapeOtherBacklessHover;
-BasicThemeClass.fileUploaderActiveBg = colors.shapeOtherBacklessPressed;
-BasicThemeClass.fileUploaderHoveredBorderColor = 'transparent';
-BasicThemeClass.fileUploaderIconGapSmall = '4px';
-BasicThemeClass.fileUploaderIconGapMedium = '6px';
-BasicThemeClass.fileUploaderIconGapLarge = '8px';
-BasicThemeClass.fileUploaderDragOverShadow = '0px 0px 0px 3px rgb(149, 149, 149), 0px 0px 0px 8px rgba(61, 61, 61, 0.2)';
-BasicThemeClass.fileUploaderFileTypeCodeIconColor = colors.customizableBoldPurple;
-BasicThemeClass.fileUploaderFileTypePictureIconColor = colors.customizableBoldBlue;
-BasicThemeClass.fileUploaderFileTypePresentationIconColor = colors.customizableBoldOrange;
-BasicThemeClass.fileUploaderFileTypeTableIconColor = colors.customizableBoldGreen;
-BasicThemeClass.fileUploaderFileTypeTextIconColor = colors.customizableBoldBlue;
-BasicThemeClass.fileUploaderFileTypeArchiveIconColor = colors.customizableHeavyOrange;
-BasicThemeClass.fileUploaderFileTypeFolderIconColor = colors.customizableBoldYellow;
-BasicThemeClass.fileUploaderFileTypeUnknownIconColor = colors.textNeutralSoft;
-BasicThemeClass.fileUploaderDisabledColor = colors.textNeutralFaint;
-BasicThemeClass.fileUploaderFileHeightSmall = '32px';
-BasicThemeClass.fileUploaderFileHeightMedium = '40px';
-BasicThemeClass.fileUploaderFileHeightLarge = '48px';
-BasicThemeClass.fileUploaderTileWidthSmall = '104px';
-BasicThemeClass.fileUploaderTileWidthMedium = '120px';
-BasicThemeClass.fileUploaderTileWidthLarge = '144px';
-BasicThemeClass.fileUploaderTileMinHeightSmall = '132px';
-BasicThemeClass.fileUploaderTileMinHeightMedium = '150px';
-BasicThemeClass.fileUploaderTileMinHeightLarge = '184px';
-BasicThemeClass.fileUploaderTileHeightSmall = '180px';
-BasicThemeClass.fileUploaderTileHeightMedium = '206px';
-BasicThemeClass.fileUploaderTileHeightLarge = '248px';
-BasicThemeClass.fileUploaderFileSizeWidthSmall = '80px';
-BasicThemeClass.fileUploaderFileSizeWidthMedium = '88px';
-BasicThemeClass.fileUploaderFileSizeWidthLarge = '104px';
-BasicThemeClass.fileUploaderFileSizeMarginLeft = '28px';
-BasicThemeClass.fileUploaderFileSizeMarginSmall = '32px';
-BasicThemeClass.fileUploaderFileSizeMarginMedium = '34px';
-BasicThemeClass.fileUploaderFileSizeMarginLarge = '36px';
-BasicThemeClass.fileUploaderFileIconSizeSmall = '24px';
-BasicThemeClass.fileUploaderFileIconSizeMedium = '32px';
-BasicThemeClass.fileUploaderFileIconSizeLarge = '40px';
-BasicThemeClass.fileUploaderTileIconSizeSmall = '20px';
-BasicThemeClass.fileUploaderTileIconSizeMedium = '24px';
-BasicThemeClass.fileUploaderTileIconSizeLarge = '32px';
-BasicThemeClass.fileUploaderTileTypeIconHeightSmall = '116px';
-BasicThemeClass.fileUploaderTileTypeIconHeightMedium = '126px';
-BasicThemeClass.fileUploaderTileTypeIconHeightLarge = '152px';
-BasicThemeClass.fileUploaderListGap = '8px';
-BasicThemeClass.fileUploaderListSummaryTextGap = '12px'; //#endregion FileUploader
-//#region ClearCrossIcon
-BasicThemeClass.clearCrossIconWidthSmall = '24px';
-BasicThemeClass.clearCrossIconWidthMedium = '30px';
-BasicThemeClass.clearCrossIconWidthLarge = '36px';
-BasicThemeClass.clearCrossIconColor = colors.textNeutralSoft;
-BasicThemeClass.clearCrossIconHoverColor = colors.textNeutralHeavy;
-BasicThemeClass.clearCrossIconAlign = 'flex-start';
-BasicThemeClass.closeBtnIconDisabledColor = colors.textNeutralFaint;
-BasicThemeClass.closeBtnIconHoverColor = colors.textNeutralHeavy;
-BasicThemeClass.closeBtnIconBorderRadius = '4px';
-BasicThemeClass.miniModalHeaderPaddingBottom = '0';
-BasicThemeClass.miniModalBodyPaddingTop = '16px';
-BasicThemeClass.miniModalBodyPaddingBottom = '0';
-BasicThemeClass.miniModalDescriptionFontSize = '16px';
-BasicThemeClass.miniModalDescriptionLineHeight = '22px';
-BasicThemeClass.miniModalHeaderPaddingTop = '32px';
-BasicThemeClass.miniModalActionGap = '8px';
-BasicThemeClass.miniModalCancelIndent = '8px';
-BasicThemeClass.miniModalFooterPaddingTop = '24px';
-BasicThemeClass.miniModalFooterPaddingBottom = '32px';
-BasicThemeClass.miniModalTitleMarginTop = '16px';
-BasicThemeClass.miniModalHeightMobile = 'auto';
-BasicThemeClass.miniModalMarginTopMobile = '16px';
-BasicThemeClass.miniModalMarginLeftMobile = '16px';
-BasicThemeClass.miniModalMarginRightMobile = '16px';
-BasicThemeClass.miniModalFooterPaddingMobile = '24px 16px 16px';
-BasicThemeClass.miniModalHeaderPaddingMobile = '32px 16px 0';
-BasicThemeClass.miniModalBodyPaddingMobile = '16px 16px 0';
-BasicThemeClass.validationsTextColorWarning = colors.textWarningHeavy;
-export var BasicTheme = createTheme({
-  themeClass: BasicThemeClass
-});
-export var BasicThemeClassForExtension = function BasicThemeClassForExtension() {};