@skbkontur/react-ui 0.0.0-73eeccf6c9 → 0.0.0-7b63c63db3

package/internal/themes/Theme8px/Theme8px.js

@@ -1,657 +0,0 @@
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
-import { exposeGetters, markAs8pxTheme } from "../../../lib/theming/ThemeHelpers";
-export var Theme8px = /*#__PURE__*/function (_ref) {
-  _inheritsLoose(Theme8px, _ref);
-
-  function Theme8px() {
-    return _ref.apply(this, arguments) || this;
-  }
-
-  _createClass(Theme8px, null, [{
-    key: "btnHeightSmall",
-    //#region Button
-    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: "btnBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "btnOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    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: "btnFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "btnFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "btnFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    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: "inputHeightSmall",
-    //#endregion
-    //#region Input
-    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: "inputBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "inputOutlineWidth",
-    get: function get() {
-      return "calc(" + this.controlOutlineWidth + " - 1px)";
-    }
-  }, {
-    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: "inputFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "inputFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "inputFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    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: "selectBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "selectOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "selectLineHeightSmall",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "selectLineHeightMedium",
-    get: function get() {
-      return this.controlLineHeightMedium;
-    }
-  }, {
-    key: "selectLineHeightLarge",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "selectFontSizeSmall",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "selectFontSizeMedium",
-    get: function get() {
-      return this.fontSizeMedium;
-    }
-  }, {
-    key: "selectFontSizeLarge",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "selectPaddingYSmall",
-    get: function get() {
-      return this.controlPaddingYSmall;
-    }
-  }, {
-    key: "selectPaddingYMedium",
-    get: function get() {
-      return this.controlPaddingYMedium;
-    }
-  }, {
-    key: "selectPaddingYLarge",
-    get: function get() {
-      return this.controlPaddingYLarge;
-    }
-  }, {
-    key: "selectBorderRadiusSmall",
-    get: function get() {
-      return this.btnBorderRadiusSmall;
-    }
-  }, {
-    key: "selectBorderRadiusMedium",
-    get: function get() {
-      return this.btnBorderRadiusMedium;
-    }
-  }, {
-    key: "selectBorderRadiusLarge",
-    get: function get() {
-      return this.btnBorderRadiusLarge;
-    }
-  }, {
-    key: "checkboxLineHeight",
-    //#endregion
-    //#region Checkbox
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "checkboxFontSize",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "checkboxPaddingY",
-    get: function get() {
-      var controlHeight = parseInt(this.controlHeightSmall, 10) || 0;
-      var lineHeight = parseInt(this.checkboxLineHeight, 10) || 0;
-      return (controlHeight - lineHeight) / 2 + "px";
-    }
-  }, {
-    key: "checkboxBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "checkboxOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "checkboxBorderWidthCompensation",
-    get: function get() {
-      return this.checkboxBorderWidth;
-    } //#endregion
-    //#region Tab
-
-  }, {
-    key: "tabsMarginX",
-    get: function get() {
-      return this.tabPaddingX;
-    }
-  }, {
-    key: "tabPaddingY",
-    get: function get() {
-      var paddingY = parseInt(this.controlPaddingYLarge, 10) || 0;
-      var borderWidth = parseInt(this.controlBorderWidth, 10) || 0;
-      return paddingY + borderWidth + "px";
-    }
-  }, {
-    key: "tabFontSize",
-    get: function get() {
-      return this.fontSizeLarge;
-    }
-  }, {
-    key: "tabLineHeight",
-    get: function get() {
-      return this.controlLineHeightLarge;
-    }
-  }, {
-    key: "tabOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    } //#endregion
-    //#region Toggle
-
-  }, {
-    key: "toggleBorderRadius",
-    get: function get() {
-      return "calc(" + this.toggleHeight + " / 2)";
-    }
-  }, {
-    key: "toggleBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "toggleOutlineWidth",
-    get: function get() {
-      return "calc(" + this.controlOutlineWidth + " + 1px)";
-    } //#endregion
-    //#region Token
-
-  }, {
-    key: "tokenLineHeight",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "tokenFontSize",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "tokenPaddingYDisabled",
-    get: function get() {
-      return this.tokenPaddingY;
-    }
-  }, {
-    key: "tokenPaddingXDisabled",
-    get: function get() {
-      return this.tokenPaddingX;
-    }
-  }, {
-    key: "tokenMarginYDisabled",
-    get: function get() {
-      return this.tokenMarginY;
-    }
-  }, {
-    key: "tokenMarginXDisabled",
-    get: function get() {
-      return this.tokenMarginX;
-    }
-  }, {
-    key: "tokenShadowDisabled",
-    get: function get() {
-      return "0 0 0 " + this.tokenBorderWidth + " " + this.tokenBorderColorDisabled;
-    } //#endregion
-    //#region TokenInput
-
-  }, {
-    key: "spinnerFontSizeSmall",
-    //#endregion
-    //#region Spinner
-    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: "spinnerOldFontSizeSmall",
-    //#endregion
-    //#region SpinnerOld
-    get: function get() {
-      return this.spinnerFontSizeSmall;
-    }
-  }, {
-    key: "spinnerOldFontSizeMedium",
-    get: function get() {
-      return this.spinnerFontSizeMedium;
-    }
-  }, {
-    key: "spinnerOldFontSizeLarge",
-    get: function get() {
-      return this.spinnerFontSizeLarge;
-    }
-  }, {
-    key: "spinnerOldLineHeightSmall",
-    get: function get() {
-      return this.spinnerLineHeightSmall;
-    }
-  }, {
-    key: "spinnerOldLineHeightMedium",
-    get: function get() {
-      return this.spinnerLineHeightMedium;
-    }
-  }, {
-    key: "spinnerOldLineHeightLarge",
-    get: function get() {
-      return this.spinnerLineHeightLarge;
-    }
-  }, {
-    key: "spinnerOldPaddingXSmall",
-    get: function get() {
-      return this.spinnerPaddingXSmall;
-    }
-  }, {
-    key: "spinnerOldPaddingYMedium",
-    get: function get() {
-      return this.spinnerPaddingYMedium;
-    }
-  }, {
-    key: "spinnerOldPaddingYLarge",
-    get: function get() {
-      return this.spinnerPaddingYLarge;
-    } //#endregion
-    //#region Link
-
-  }, {
-    key: "textareaBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "textareaOutlineWidth",
-    get: function get() {
-      return "calc(" + this.controlOutlineWidth + " - 1px)";
-    }
-  }, {
-    key: "textareaFontSize",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "textareaPaddingY",
-    get: function get() {
-      return this.controlPaddingYSmall;
-    }
-  }, {
-    key: "textareaLineHeight",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    } //#endregion
-    //#region Radio
-
-  }, {
-    key: "radioLineHeight",
-    get: function get() {
-      return this.controlLineHeightSmall;
-    }
-  }, {
-    key: "radioFontSize",
-    get: function get() {
-      return this.fontSizeSmall;
-    }
-  }, {
-    key: "radioPaddingY",
-    get: function get() {
-      var controlHeight = parseInt(this.controlHeightSmall, 10) || 0;
-      var lineHeight = parseInt(this.radioLineHeight, 10) || 0;
-      return (controlHeight - lineHeight) / 2 + "px";
-    }
-  }, {
-    key: "radioBorderWidth",
-    get: function get() {
-      return this.controlBorderWidth;
-    }
-  }, {
-    key: "radioOutlineWidth",
-    get: function get() {
-      return this.controlOutlineWidth;
-    }
-  }, {
-    key: "radioBorderWidthCompensation",
-    get: function get() {
-      return this.radioBoxShadow !== 'none' ? this.radioBorderWidth : '0px';
-    }
-  }, {
-    key: "radioSizeAfter",
-    get: function get() {
-      var borderCompensation = this.radioBoxShadow === 'none' ? this.radioBorderWidth : this.radioBorderWidthCompensation;
-      return "calc(" + this.radioSize + " + 2 * " + this.radioOutlineWidth + " - 2 * " + borderCompensation + ")";
-    }
-  }, {
-    key: "switcherOutlineWidth",
-    //#endregion
-    //#region Switcher
-    get: function get() {
-      return this.btnOutlineWidth;
-    }
-  }, {
-    key: "switcherLabelFontSizeSmall",
-    get: function get() {
-      return this.btnFontSizeSmall;
-    }
-  }, {
-    key: "switcherLabelFontSizeMedium",
-    get: function get() {
-      return this.btnFontSizeMedium;
-    }
-  }, {
-    key: "switcherLabelFontSizeLarge",
-    get: function get() {
-      return this.btnFontSizeLarge;
-    }
-  }, {
-    key: "switcherLabelLineHeightSmall",
-    get: function get() {
-      return this.btnLineHeightSmall;
-    }
-  }, {
-    key: "switcherLabelLineHeightMedium",
-    get: function get() {
-      return this.btnLineHeightMedium;
-    }
-  }, {
-    key: "switcherLabelLineHeightLarge",
-    get: function get() {
-      return this.btnLineHeightLarge;
-    }
-  }, {
-    key: "switcherLabelGapSmall",
-    get: function get() {
-      return this.btnPaddingXSmall;
-    }
-  }, {
-    key: "switcherLabelGapMedium",
-    get: function get() {
-      return this.btnPaddingXMedium;
-    }
-  }, {
-    key: "switcherLabelGapLarge",
-    get: function get() {
-      return this.btnPaddingXLarge;
-    }
-  }]);
-
-  return Theme8px;
-}( /*#__PURE__*/function () {
-  function _class() {}
-
-  return _class;
-}());
-Theme8px.fontSizeSmall = '14px';
-Theme8px.fontSizeMedium = '16px';
-Theme8px.fontSizeLarge = '18px';
-Theme8px.controlHeightSmall = '32px';
-Theme8px.controlHeightMedium = '40px';
-Theme8px.controlHeightLarge = '48px';
-Theme8px.controlLineHeightSmall = '20px';
-Theme8px.controlLineHeightMedium = '22px';
-Theme8px.controlLineHeightLarge = '24px';
-Theme8px.controlPaddingYSmall = '5px';
-Theme8px.controlPaddingYMedium = '8px';
-Theme8px.controlPaddingYLarge = '11px';
-Theme8px.btnPaddingXSmall = '15px';
-Theme8px.btnPaddingXMedium = '15px';
-Theme8px.btnPaddingXLarge = '19px';
-Theme8px.btnBorderRadiusSmall = '1px';
-Theme8px.btnBorderRadiusMedium = '1px';
-Theme8px.btnBorderRadiusLarge = '1px';
-Theme8px.btnIconGapSmall = '4px';
-Theme8px.btnIconGapMedium = '4px';
-Theme8px.btnIconGapLarge = '4px';
-Theme8px.btnIconSizeSmall = '16px';
-Theme8px.btnIconSizeMedium = '18px';
-Theme8px.btnIconSizeLarge = '20px';
-Theme8px.btnSmallArrowTop = '7px';
-Theme8px.btnSmallArrowRight = '-8px';
-Theme8px.btnSmallArrowLength = '16px';
-Theme8px.btnMediumArrowTop = '8px';
-Theme8px.btnMediumArrowLength = '21.2px';
-Theme8px.btnMediumArrowRight = '-11px';
-Theme8px.btnLargeArrowLength = '25px';
-Theme8px.btnLargeArrowLeft = '-12px';
-Theme8px.btnLargeArrowRight = '-12px';
-Theme8px.inputWidth = '200px';
-Theme8px.inputPaddingXSmall = '7px';
-Theme8px.inputPaddingXMedium = '11px';
-Theme8px.inputPaddingXLarge = '15px';
-Theme8px.inputBorderRadiusSmall = '0px';
-Theme8px.inputBorderRadiusMedium = '0px';
-Theme8px.inputBorderRadiusLarge = '0px';
-Theme8px.inputIconGapSmall = '4px';
-Theme8px.inputIconGapMedium = '8px';
-Theme8px.inputIconGapLarge = '12px';
-Theme8px.inputIconSizeSmall = '16px';
-Theme8px.inputIconSizeMedium = '18px';
-Theme8px.inputIconSizeLarge = '20px';
-Theme8px.selectWidth = '200px';
-Theme8px.selectPaddingXSmall = '7px';
-Theme8px.selectPaddingXMedium = '11px';
-Theme8px.selectPaddingXLarge = '15px';
-Theme8px.selectIconGapSmall = '4px';
-Theme8px.selectIconGapMedium = '8px';
-Theme8px.selectIconGapLarge = '12px';
-Theme8px.checkboxLabelGap = '8px';
-Theme8px.checkboxBorderRadius = '1px';
-Theme8px.checkboxBorder = 'none';
-Theme8px.tabPaddingX = '12px';
-Theme8px.tabBorderWidth = '2px';
-Theme8px.toggleWidth = '32px';
-Theme8px.toggleHeight = '20px';
-Theme8px.tokenMarginY = '2px';
-Theme8px.tokenMarginX = '4px';
-Theme8px.tokenPaddingY = '1px';
-Theme8px.tokenPaddingX = '3px';
-Theme8px.tokenBorderRadius = '1px';
-Theme8px.tokenRemoveIconSize = '8px';
-Theme8px.tokenRemoveIconPaddingY = '4px';
-Theme8px.tokenRemoveIconPaddingX = '4px';
-Theme8px.tokenRemoveIconGap = '4px';
-Theme8px.tokenRemoveIconBoxSizing = 'content-box';
-Theme8px.tokenBorderColorDisabled = '#dadada';
-Theme8px.tokenDisabledBg = '#e5e5e5';
-Theme8px.tokenLegacyTextShift = '0px';
-Theme8px.tokenInputLineHeight = '26px';
-Theme8px.spinnerPaddingXSmall = '9px';
-Theme8px.spinnerPaddingYMedium = '-2px';
-Theme8px.spinnerPaddingYLarge = '2px';
-Theme8px.linkIconMarginRight = '4px';
-Theme8px.linkButtonLineHeight = '34px';
-Theme8px.linkButtonPaddingX = '10px';
-Theme8px.textareaWidth = '250px';
-Theme8px.textareaBorderRadius = '0px';
-Theme8px.textareaPaddingX = '7px';
-Theme8px.radioLabelGap = '8px';
-Theme8px.radioSize = '16px';
-Theme8px.radioBulletSize = '8px';
-Theme8px.radioVerticalAlign = 'top';
-Theme8px.switcherButtonPaddingXSmall = '7px';
-Theme8px.switcherButtonPaddingXMedium = '11px';
-Theme8px.switcherButtonPaddingXLarge = '15px';
-export var Theme8pxInternal = exposeGetters(markAs8pxTheme(Theme8px));