@skbkontur/react-ui 0.0.0-bcbd5e6112 → 0.0.0-c13bb5f4ca

package/components/Calendar/MonthView.styles/MonthView.styles.js

@@ -1,42 +1,40 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
-import { memoizeStyle } from "../../../lib/theming/Emotion";
-export var getStyles = function getStyles(emotion) {
-  return memoizeStyle({
-    headerMonth: function headerMonth(t) {
-      return emotion.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n        display: inline-block;\n        padding: ", " 0 ", ";\n      "])), t.calendarMonthTitlePaddingTop, t.calendarMonthTitlePaddingBottom);
-    },
-    headerYear: function headerYear(t) {
-      return emotion.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n        display: inline-block;\n        position: absolute;\n        right: 0;\n        padding: ", " 0 ", ";\n      "])), t.calendarMonthTitlePaddingTop, t.calendarMonthTitlePaddingBottom);
-    },
-    month: function month(t) {
-      var width = parseInt(t.calendarCellWidth) * 7;
-      return emotion.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n        position: absolute;\n        width: ", "px;\n      "])), width);
-    },
-    monthMobile: function monthMobile() {
-      return emotion.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n        width: 100%;\n      "])));
-    },
-    header: function header() {
-      return emotion.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n        position: relative;\n      "])));
-    },
-    headerSticky: function headerSticky(t) {
-      return emotion.css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n        background-color: ", ";\n        z-index: 2;\n      "])), t.calendarMonthHeaderStickedBgColor);
-    },
-    monthTitle: function monthTitle(t) {
-      return emotion.css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n        border-bottom: 1px solid ", ";\n        font-weight: ", ";\n        margin: 0 ", " ", ";\n        line-height: ", ";\n      "])), t.calendarMonthTitleBorderBottomColor, t.dateSelectFontWeight, t.calendarMonthTitleMarginX, t.calendarMonthTitleMarginBottom, t.calendarMonthTitleLineHeight);
-    },
-    /* Note: this could've been
-     * display: grid;
-     * grid-template-columns: repeat(7, minmax(0, 1fr));
-     */
-    monthDayGrid: function monthDayGrid(t) {
-      return emotion.css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n        line-height: ", ";\n        display: flex;\n        flex-direction: column;\n        padding: ", " 0px;\n      "])), t.calendarCellLineHeight, t.calendarGridRowSpacing);
-    },
-    monthDayRow: function monthDayRow(t) {
-      return emotion.css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n        display: flex;\n        justify-content: space-between;\n\n        & + & {\n          margin-top: ", ";\n        }\n      "])), t.calendarGridRowSpacing);
-    },
-    nativeSelect: function nativeSelect() {
-      return emotion.css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n        position: absolute;\n        top: -12px;\n        right: 0;\n        bottom: -8px;\n        left: 0;\n        cursor: pointer;\n        appearance: none;\n        opacity: 0;\n        border: none;\n      "])));
-    }
-  });
-};
+import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+export var styles = memoizeStyle({
+  headerMonth: function headerMonth(t) {
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      padding: ", " 0 ", ";\n    "])), t.calendarMonthTitlePaddingTop, t.calendarMonthTitlePaddingBottom);
+  },
+  headerYear: function headerYear(t) {
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      position: absolute;\n      right: 0;\n      padding: ", " 0 ", ";\n    "])), t.calendarMonthTitlePaddingTop, t.calendarMonthTitlePaddingBottom);
+  },
+  month: function month(t) {
+    var width = parseInt(t.calendarCellWidth) * 7;
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      position: absolute;\n      width: ", "px;\n    "])), width);
+  },
+  monthMobile: function monthMobile() {
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      width: 100%;\n    "])));
+  },
+  header: function header() {
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      position: relative;\n    "])));
+  },
+  headerSticky: function headerSticky(t) {
+    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      background-color: ", ";\n      z-index: 2;\n    "])), t.calendarMonthHeaderStickedBgColor);
+  },
+  monthTitle: function monthTitle(t) {
+    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      border-bottom: 1px solid ", ";\n      font-weight: ", ";\n      margin: 0 ", " ", ";\n      line-height: ", ";\n    "])), t.calendarMonthTitleBorderBottomColor, t.dateSelectFontWeight, t.calendarMonthTitleMarginX, t.calendarMonthTitleMarginBottom, t.calendarMonthTitleLineHeight);
+  },
+  /* Note: this could've been
+   * display: grid;
+   * grid-template-columns: repeat(7, minmax(0, 1fr));
+   */
+  monthDayGrid: function monthDayGrid(t) {
+    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      line-height: ", ";\n      display: flex;\n      flex-direction: column;\n      padding: ", " 0px;\n    "])), t.calendarCellLineHeight, t.calendarGridRowSpacing);
+  },
+  monthDayRow: function monthDayRow(t) {
+    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      display: flex;\n      justify-content: space-between;\n\n      & + & {\n        margin-top: ", ";\n      }\n    "])), t.calendarGridRowSpacing);
+  },
+  nativeSelect: function nativeSelect() {
+    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      position: absolute;\n      top: -12px;\n      right: 0;\n      bottom: -8px;\n      left: 0;\n      cursor: pointer;\n      appearance: none;\n      opacity: 0;\n      border: none;\n    "])));
+  }
+});

package/components/Calendar/MonthView.styles/MonthView.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["memoizeStyle","getStyles","emotion","headerMonth","t","css","_templateObject","_taggedTemplateLiteralLoose","calendarMonthTitlePaddingTop","calendarMonthTitlePaddingBottom","headerYear","_templateObject2","month","width","parseInt","calendarCellWidth","_templateObject3","monthMobile","_templateObject4","header","_templateObject5","headerSticky","_templateObject6","calendarMonthHeaderStickedBgColor","monthTitle","_templateObject7","calendarMonthTitleBorderBottomColor","dateSelectFontWeight","calendarMonthTitleMarginX","calendarMonthTitleMarginBottom","calendarMonthTitleLineHeight","monthDayGrid","_templateObject8","calendarCellLineHeight","calendarGridRowSpacing","monthDayRow","_templateObject9","nativeSelect","_templateObject10"],"sources":["MonthView.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    headerMonth(t: Theme) {\n      return emotion.css`\n        display: inline-block;\n        padding: ${t.calendarMonthTitlePaddingTop} 0 ${t.calendarMonthTitlePaddingBottom};\n      `;\n    },\n\n    headerYear(t: Theme) {\n      return emotion.css`\n        display: inline-block;\n        position: absolute;\n        right: 0;\n        padding: ${t.calendarMonthTitlePaddingTop} 0 ${t.calendarMonthTitlePaddingBottom};\n      `;\n    },\n\n    month(t: Theme) {\n      const width = parseInt(t.calendarCellWidth) * 7;\n      return emotion.css`\n        position: absolute;\n        width: ${width}px;\n      `;\n    },\n\n    monthMobile() {\n      return emotion.css`\n        width: 100%;\n      `;\n    },\n\n    header() {\n      return emotion.css`\n        position: relative;\n      `;\n    },\n\n    headerSticky(t: Theme) {\n      return emotion.css`\n        background-color: ${t.calendarMonthHeaderStickedBgColor};\n        z-index: 2;\n      `;\n    },\n\n    monthTitle(t: Theme) {\n      return emotion.css`\n        border-bottom: 1px solid ${t.calendarMonthTitleBorderBottomColor};\n        font-weight: ${t.dateSelectFontWeight};\n        margin: 0 ${t.calendarMonthTitleMarginX} ${t.calendarMonthTitleMarginBottom};\n        line-height: ${t.calendarMonthTitleLineHeight};\n      `;\n    },\n\n    /* Note: this could've been\n     * display: grid;\n     * grid-template-columns: repeat(7, minmax(0, 1fr));\n     */\n    monthDayGrid(t: Theme) {\n      return emotion.css`\n        line-height: ${t.calendarCellLineHeight};\n        display: flex;\n        flex-direction: column;\n        padding: ${t.calendarGridRowSpacing} 0px;\n      `;\n    },\n\n    monthDayRow(t: Theme) {\n      return emotion.css`\n        display: flex;\n        justify-content: space-between;\n\n        & + & {\n          margin-top: ${t.calendarGridRowSpacing};\n        }\n      `;\n    },\n\n    nativeSelect() {\n      return emotion.css`\n        position: absolute;\n        top: -12px;\n        right: 0;\n        bottom: -8px;\n        left: 0;\n        cursor: pointer;\n        appearance: none;\n        opacity: 0;\n        border: none;\n      `;\n    },\n  });\n"],"mappings":";;AAEA,SAASA,YAAY,QAAQ,2BAA2B;;;AAGxD,OAAO,IAAMC,SAAS,GAAG,SAAZA,SAASA,CAAIC,OAAgB;IACxCF,YAAY,CAAC;MACXG,WAAW,WAAAA,YAACC,CAAQ,EAAE;QACpB,OAAOF,OAAO,CAACG,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,2BAAA;;QAELH,CAAC,CAACI,4BAA4B,EAAMJ,CAAC,CAACK,+BAA+B;;MAEpF,CAAC;;MAEDC,UAAU,WAAAA,WAACN,CAAQ,EAAE;QACnB,OAAOF,OAAO,CAACG,GAAG,CAAAM,gBAAA,KAAAA,gBAAA,GAAAJ,2BAAA;;;;QAILH,CAAC,CAACI,4BAA4B,EAAMJ,CAAC,CAACK,+BAA+B;;MAEpF,CAAC;;MAEDG,KAAK,WAAAA,MAACR,CAAQ,EAAE;QACd,IAAMS,KAAK,GAAGC,QAAQ,CAACV,CAAC,CAACW,iBAAiB,CAAC,GAAG,CAAC;QAC/C,OAAOb,OAAO,CAACG,GAAG,CAAAW,gBAAA,KAAAA,gBAAA,GAAAT,2BAAA;;QAEPM,KAAK;;MAElB,CAAC;;MAEDI,WAAW,WAAAA,YAAA,EAAG;QACZ,OAAOf,OAAO,CAACG,GAAG,CAAAa,gBAAA,KAAAA,gBAAA,GAAAX,2BAAA;;;MAGpB,CAAC;;MAEDY,MAAM,WAAAA,OAAA,EAAG;QACP,OAAOjB,OAAO,CAACG,GAAG,CAAAe,gBAAA,KAAAA,gBAAA,GAAAb,2BAAA;;;MAGpB,CAAC;;MAEDc,YAAY,WAAAA,aAACjB,CAAQ,EAAE;QACrB,OAAOF,OAAO,CAACG,GAAG,CAAAiB,gBAAA,KAAAA,gBAAA,GAAAf,2BAAA;QACIH,CAAC,CAACmB,iCAAiC;;;MAG3D,CAAC;;MAEDC,UAAU,WAAAA,WAACpB,CAAQ,EAAE;QACnB,OAAOF,OAAO,CAACG,GAAG,CAAAoB,gBAAA,KAAAA,gBAAA,GAAAlB,2BAAA;QACWH,CAAC,CAACsB,mCAAmC;QACjDtB,CAAC,CAACuB,oBAAoB;QACzBvB,CAAC,CAACwB,yBAAyB,EAAIxB,CAAC,CAACyB,8BAA8B;QAC5DzB,CAAC,CAAC0B,4BAA4B;;MAEjD,CAAC;;MAED;AACJ;AACA;AACA;MACIC,YAAY,WAAAA,aAAC3B,CAAQ,EAAE;QACrB,OAAOF,OAAO,CAACG,GAAG,CAAA2B,gBAAA,KAAAA,gBAAA,GAAAzB,2BAAA;QACDH,CAAC,CAAC6B,sBAAsB;;;QAG5B7B,CAAC,CAAC8B,sBAAsB;;MAEvC,CAAC;;MAEDC,WAAW,WAAAA,YAAC/B,CAAQ,EAAE;QACpB,OAAOF,OAAO,CAACG,GAAG,CAAA+B,gBAAA,KAAAA,gBAAA,GAAA7B,2BAAA;;;;;QAKAH,CAAC,CAAC8B,sBAAsB;;;MAG5C,CAAC;;MAEDG,YAAY,WAAAA,aAAA,EAAG;QACb,OAAOnC,OAAO,CAACG,GAAG,CAAAiC,iBAAA,KAAAA,iBAAA,GAAA/B,2BAAA;;;;;;;;;;;MAWpB;IACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["css","memoizeStyle","styles","headerMonth","t","_templateObject","_taggedTemplateLiteralLoose","calendarMonthTitlePaddingTop","calendarMonthTitlePaddingBottom","headerYear","_templateObject2","month","width","parseInt","calendarCellWidth","_templateObject3","monthMobile","_templateObject4","header","_templateObject5","headerSticky","_templateObject6","calendarMonthHeaderStickedBgColor","monthTitle","_templateObject7","calendarMonthTitleBorderBottomColor","dateSelectFontWeight","calendarMonthTitleMarginX","calendarMonthTitleMarginBottom","calendarMonthTitleLineHeight","monthDayGrid","_templateObject8","calendarCellLineHeight","calendarGridRowSpacing","monthDayRow","_templateObject9","nativeSelect","_templateObject10"],"sources":["MonthView.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  headerMonth(t: Theme) {\n    return css`\n      display: inline-block;\n      padding: ${t.calendarMonthTitlePaddingTop} 0 ${t.calendarMonthTitlePaddingBottom};\n    `;\n  },\n\n  headerYear(t: Theme) {\n    return css`\n      display: inline-block;\n      position: absolute;\n      right: 0;\n      padding: ${t.calendarMonthTitlePaddingTop} 0 ${t.calendarMonthTitlePaddingBottom};\n    `;\n  },\n\n  month(t: Theme) {\n    const width = parseInt(t.calendarCellWidth) * 7;\n    return css`\n      position: absolute;\n      width: ${width}px;\n    `;\n  },\n\n  monthMobile() {\n    return css`\n      width: 100%;\n    `;\n  },\n\n  header() {\n    return css`\n      position: relative;\n    `;\n  },\n\n  headerSticky(t: Theme) {\n    return css`\n      background-color: ${t.calendarMonthHeaderStickedBgColor};\n      z-index: 2;\n    `;\n  },\n\n  monthTitle(t: Theme) {\n    return css`\n      border-bottom: 1px solid ${t.calendarMonthTitleBorderBottomColor};\n      font-weight: ${t.dateSelectFontWeight};\n      margin: 0 ${t.calendarMonthTitleMarginX} ${t.calendarMonthTitleMarginBottom};\n      line-height: ${t.calendarMonthTitleLineHeight};\n    `;\n  },\n\n  /* Note: this could've been\n   * display: grid;\n   * grid-template-columns: repeat(7, minmax(0, 1fr));\n   */\n  monthDayGrid(t: Theme) {\n    return css`\n      line-height: ${t.calendarCellLineHeight};\n      display: flex;\n      flex-direction: column;\n      padding: ${t.calendarGridRowSpacing} 0px;\n    `;\n  },\n\n  monthDayRow(t: Theme) {\n    return css`\n      display: flex;\n      justify-content: space-between;\n\n      & + & {\n        margin-top: ${t.calendarGridRowSpacing};\n      }\n    `;\n  },\n\n  nativeSelect() {\n    return css`\n      position: absolute;\n      top: -12px;\n      right: 0;\n      bottom: -8px;\n      left: 0;\n      cursor: pointer;\n      appearance: none;\n      opacity: 0;\n      border: none;\n    `;\n  },\n});\n"],"mappings":"uRAAA,SAASA,GAAG,EAAEC,YAAY,QAAQ,2BAA2B;;;AAG7D,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;EACjCE,WAAW,WAAAA,YAACC,CAAQ,EAAE;IACpB,OAAOJ,GAAG,CAAAK,eAAA,KAAAA,eAAA,GAAAC,2BAAA;;IAEGF,CAAC,CAACG,4BAA4B,EAAMH,CAAC,CAACI,+BAA+B;;EAEpF,CAAC;;EAEDC,UAAU,WAAAA,WAACL,CAAQ,EAAE;IACnB,OAAOJ,GAAG,CAAAU,gBAAA,KAAAA,gBAAA,GAAAJ,2BAAA;;;;IAIGF,CAAC,CAACG,4BAA4B,EAAMH,CAAC,CAACI,+BAA+B;;EAEpF,CAAC;;EAEDG,KAAK,WAAAA,MAACP,CAAQ,EAAE;IACd,IAAMQ,KAAK,GAAGC,QAAQ,CAACT,CAAC,CAACU,iBAAiB,CAAC,GAAG,CAAC;IAC/C,OAAOd,GAAG,CAAAe,gBAAA,KAAAA,gBAAA,GAAAT,2BAAA;;IAECM,KAAK;;EAElB,CAAC;;EAEDI,WAAW,WAAAA,YAAA,EAAG;IACZ,OAAOhB,GAAG,CAAAiB,gBAAA,KAAAA,gBAAA,GAAAX,2BAAA;;;EAGZ,CAAC;;EAEDY,MAAM,WAAAA,OAAA,EAAG;IACP,OAAOlB,GAAG,CAAAmB,gBAAA,KAAAA,gBAAA,GAAAb,2BAAA;;;EAGZ,CAAC;;EAEDc,YAAY,WAAAA,aAAChB,CAAQ,EAAE;IACrB,OAAOJ,GAAG,CAAAqB,gBAAA,KAAAA,gBAAA,GAAAf,2BAAA;IACYF,CAAC,CAACkB,iCAAiC;;;EAG3D,CAAC;;EAEDC,UAAU,WAAAA,WAACnB,CAAQ,EAAE;IACnB,OAAOJ,GAAG,CAAAwB,gBAAA,KAAAA,gBAAA,GAAAlB,2BAAA;IACmBF,CAAC,CAACqB,mCAAmC;IACjDrB,CAAC,CAACsB,oBAAoB;IACzBtB,CAAC,CAACuB,yBAAyB,EAAIvB,CAAC,CAACwB,8BAA8B;IAC5DxB,CAAC,CAACyB,4BAA4B;;EAEjD,CAAC;;EAED;AACF;AACA;AACA;EACEC,YAAY,WAAAA,aAAC1B,CAAQ,EAAE;IACrB,OAAOJ,GAAG,CAAA+B,gBAAA,KAAAA,gBAAA,GAAAzB,2BAAA;IACOF,CAAC,CAAC4B,sBAAsB;;;IAG5B5B,CAAC,CAAC6B,sBAAsB;;EAEvC,CAAC;;EAEDC,WAAW,WAAAA,YAAC9B,CAAQ,EAAE;IACpB,OAAOJ,GAAG,CAAAmC,gBAAA,KAAAA,gBAAA,GAAA7B,2BAAA;;;;;IAKQF,CAAC,CAAC6B,sBAAsB;;;EAG5C,CAAC;;EAEDG,YAAY,WAAAA,aAAA,EAAG;IACb,OAAOpC,GAAG,CAAAqC,iBAAA,KAAAA,iBAAA,GAAA/B,2BAAA;;;;;;;;;;;EAWZ;AACF,CAAC,CAAC","ignoreList":[]}

package/components/Calendar/MonthView.styles.d.ts

@@ -1,6 +1,5 @@
-import type { Emotion } from '@emotion/css/create-instance';
 import type { Theme } from '../../lib/theming/Theme';
-export declare const getStyles: (emotion: Emotion) => {
+export declare const styles: {
     headerMonth(t: Theme): string;
     headerYear(t: Theme): string;
     month(t: Theme): string;

package/components/Center/Center/Center.js

@@ -4,11 +4,11 @@ import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 var _excluded = ["align"];
 var _class, _Center;
 import React from 'react';
-import { RenderEnvironmentContext } from "../../../lib/theming/RenderEnvironmentContext";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
 import { createPropsGetter } from "../../../lib/createPropsGetter";
-import { getStyles } from "../Center.styles";
+import { styles } from "../Center.styles";
 export var CenterDataTids = {
   root: 'Center__root'
 };
@@ -27,21 +27,21 @@ export var Center = rootNode(_class = (_Center = /*#__PURE__*/function (_React$C
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
     _this.getProps = createPropsGetter(Center.defaultProps);
     _this.renderMain = function (props) {
-      var _this$cx;
+      var _cx;
       var align = props.align,
         rest = _objectWithoutPropertiesLoose(props, _excluded);
       return /*#__PURE__*/(
         React.createElement("div", _extends({
           "data-tid": CenterDataTids.root
         }, rest, {
-          className: _this.cx((_this$cx = {}, _this$cx[_this.styles.root()] = true, _this$cx[_this.styles.rootAlignLeft()] = align === 'left', _this$cx[_this.styles.rootAlignRight()] = align === 'right', _this$cx))
+          className: cx((_cx = {}, _cx[styles.root()] = true, _cx[styles.rootAlignLeft()] = align === 'left', _cx[styles.rootAlignRight()] = align === 'right', _cx))
         }), /*#__PURE__*/
 
         React.createElement("span", {
-          className: _this.styles.spring()
+          className: styles.spring()
         }), /*#__PURE__*/
         React.createElement("span", {
-          className: _this.styles.container()
+          className: styles.container()
         }, _this.props.children))
       );
     };
@@ -50,15 +50,9 @@ export var Center = rootNode(_class = (_Center = /*#__PURE__*/function (_React$C
   _inheritsLoose(Center, _React$Component);
   var _proto = Center.prototype;
   _proto.render = function render() {
-    var _this2 = this;
-    return /*#__PURE__*/React.createElement(RenderEnvironmentContext.Consumer, null, function (_ref) {
-      var emotion = _ref.emotion;
-      _this2.cx = emotion.cx;
-      _this2.styles = getStyles(emotion);
-      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
-        rootNodeRef: _this2.setRootNode
-      }, _this2.getProps()), _this2.renderMain);
-    });
+    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.getProps()), this.renderMain);
   };
   return Center;
 }(React.Component), _Center.__KONTUR_REACT_UI__ = 'Center', _Center.displayName = 'Center', _Center.defaultProps = {

package/components/Center/Center/Center.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","RenderEnvironmentContext","CommonWrapper","rootNode","createPropsGetter","getStyles","CenterDataTids","root","Center","_class","_Center","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","getProps","defaultProps","renderMain","props","_this$cx","align","rest","_objectWithoutPropertiesLoose","_excluded","createElement","_extends","className","cx","styles","rootAlignLeft","rootAlignRight","spring","container","children","_inheritsLoose","_proto","prototype","render","_this2","Consumer","_ref","emotion","rootNodeRef","setRootNode","Component","__KONTUR_REACT_UI__","displayName"],"sources":["Center.tsx"],"sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { RenderEnvironmentContext } from '../../lib/theming/RenderEnvironmentContext';\nimport type { Override } from '../../typings/utility-types';\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode';\nimport { rootNode } from '../../lib/rootNode';\nimport type { DefaultizedProps } from '../../lib/createPropsGetter';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { getStyles } from './Center.styles';\n\nexport type HorizontalAlign = 'left' | 'center' | 'right';\n\nexport interface CenterProps\n  extends CommonProps,\n    Override<\n      React.HTMLAttributes<HTMLDivElement>,\n      {\n        /** Задает выравнивание контента по горизонтали */\n        align?: HorizontalAlign;\n      }\n    > {}\n\nexport const CenterDataTids = {\n  root: 'Center__root',\n} as const;\n\ntype DefaultProps = Required<Pick<CenterProps, 'align'>>;\ntype DefaultizedCenterProps = DefaultizedProps<CenterProps, DefaultProps>;\n\n/**\n * `Center` — контейнер, который центрирует элементы внутри себя.\n *\n * Выравнивание задается пропом `align`.\n */\n@rootNode\nexport class Center extends React.Component<CenterProps> {\n  public static __KONTUR_REACT_UI__ = 'Center';\n  public static displayName = 'Center';\n\n  public static defaultProps: DefaultProps = {\n    align: 'center',\n  };\n  private getProps = createPropsGetter(Center.defaultProps);\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private cx!: Emotion['cx'];\n  private styles!: ReturnType<typeof getStyles>;\n\n  public render() {\n    return (\n      <RenderEnvironmentContext.Consumer>\n        {({ emotion }) => {\n          this.cx = emotion.cx;\n          this.styles = getStyles(emotion);\n\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n              {this.renderMain}\n            </CommonWrapper>\n          );\n        }}\n      </RenderEnvironmentContext.Consumer>\n    );\n  }\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedCenterProps>) => {\n    const { align, ...rest } = props;\n\n    return (\n      <div\n        data-tid={CenterDataTids.root}\n        {...rest}\n        className={this.cx({\n          [this.styles.root()]: true,\n          [this.styles.rootAlignLeft()]: align === 'left',\n          [this.styles.rootAlignRight()]: align === 'right',\n        })}\n      >\n        <span className={this.styles.spring()} />\n        <span className={this.styles.container()}>{this.props.children}</span>\n      </div>\n    );\n  };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","CommonWrapper","cx","rootNode","createPropsGetter","styles","CenterDataTids","root","Center","_class","_Center","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","getProps","defaultProps","renderMain","props","_cx","align","rest","_objectWithoutPropertiesLoose","_excluded","createElement","_extends","className","rootAlignLeft","rootAlignRight","spring","container","children","_inheritsLoose","_proto","prototype","render","rootNodeRef","setRootNode","Component","__KONTUR_REACT_UI__","displayName"],"sources":["Center.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { Override } from '../../typings/utility-types';\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode';\nimport { rootNode } from '../../lib/rootNode';\nimport type { DefaultizedProps } from '../../lib/createPropsGetter';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './Center.styles';\n\nexport type HorizontalAlign = 'left' | 'center' | 'right';\n\nexport interface CenterProps\n  extends CommonProps,\n    Override<\n      React.HTMLAttributes<HTMLDivElement>,\n      {\n        /** Задает выравнивание контента по горизонтали */\n        align?: HorizontalAlign;\n      }\n    > {}\n\nexport const CenterDataTids = {\n  root: 'Center__root',\n} as const;\n\ntype DefaultProps = Required<Pick<CenterProps, 'align'>>;\ntype DefaultizedCenterProps = DefaultizedProps<CenterProps, DefaultProps>;\n\n/**\n * `Center` — контейнер, который центрирует элементы внутри себя.\n *\n * Выравнивание задается пропом `align`.\n */\n@rootNode\nexport class Center extends React.Component<CenterProps> {\n  public static __KONTUR_REACT_UI__ = 'Center';\n  public static displayName = 'Center';\n\n  public static defaultProps: DefaultProps = {\n    align: 'center',\n  };\n  private getProps = createPropsGetter(Center.defaultProps);\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n        {this.renderMain}\n      </CommonWrapper>\n    );\n  }\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedCenterProps>) => {\n    const { align, ...rest } = props;\n\n    return (\n      <div\n        data-tid={CenterDataTids.root}\n        {...rest}\n        className={cx({\n          [styles.root()]: true,\n          [styles.rootAlignLeft()]: align === 'left',\n          [styles.rootAlignRight()]: align === 'right',\n        })}\n      >\n        <span className={styles.spring()} />\n        <span className={styles.container()}>{this.props.children}</span>\n      </div>\n    );\n  };\n}\n"],"mappings":"kRAAA,OAAOA,KAAK,MAAM,OAAO;;;;AAIzB,SAASC,aAAa,QAAQ,8BAA8B;AAC5D,SAASC,EAAE,QAAQ,2BAA2B;;AAE9C,SAASC,QAAQ,QAAQ,oBAAoB;;AAE7C,SAASC,iBAAiB,QAAQ,6BAA6B;;AAE/D,SAASC,MAAM,QAAQ,iBAAiB;;;;;;;;;;;;;;AAcxC,OAAO,IAAMC,cAAc,GAAG;EAC5BC,IAAI,EAAE;AACR,CAAU;;;;;AAKV;AACA;AACA;AACA;AACA;AACA;AACaC,MAAM,GADlBL,QAAQ,CAAAM,MAAA,IAAAC,OAAA,0BAAAC,gBAAA,YAAAH,OAAA,OAAAI,KAAA,UAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA,KAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA,GAAAN,KAAA,GAAAD,gBAAA,CAAAQ,IAAA,CAAAC,KAAA,CAAAT,gBAAA,SAAAU,MAAA,CAAAL,IAAA,WAAAJ,KAAA;;;;;;;IAQCU,QAAQ,GAAGlB,iBAAiB,CAACI,MAAM,CAACe,YAAY,CAAC,CAAAX,KAAA;;;;;;;;;;;;IAYjDY,UAAU,GAAG,UAACC,KAAqD,EAAK,KAAAC,GAAA;MAC9E,IAAQC,KAAK,GAAcF,KAAK,CAAxBE,KAAK,CAAKC,IAAI,GAAAC,6BAAA,CAAKJ,KAAK,EAAAK,SAAA;;MAEhC;QACE9B,KAAA,CAAA+B,aAAA,QAAAC,QAAA;UACE,YAAU1B,cAAc,CAACC,IAAK;QAC1BqB,IAAI;UACRK,SAAS,EAAE/B,EAAE,EAAAwB,GAAA,OAAAA,GAAA;UACVrB,MAAM,CAACE,IAAI,CAAC,CAAC,IAAG,IAAI,EAAAmB,GAAA;UACpBrB,MAAM,CAAC6B,aAAa,CAAC,CAAC,IAAGP,KAAK,KAAK,MAAM,EAAAD,GAAA;UACzCrB,MAAM,CAAC8B,cAAc,CAAC,CAAC,IAAGR,KAAK,KAAK,OAAO,EAAAD,GAAA;UAC7C,CAAE;;QAEH1B,KAAA,CAAA+B,aAAA,WAAME,SAAS,EAAE5B,MAAM,CAAC+B,MAAM,CAAC,CAAE,EAAE,CAAC;QACpCpC,KAAA,CAAA+B,aAAA,WAAME,SAAS,EAAE5B,MAAM,CAACgC,SAAS,CAAC,CAAE,IAAEzB,KAAA,CAAKa,KAAK,CAACa,QAAe;QAC7D,CAAC;;IAEV,CAAC,QAAA1B,KAAA,EAAA2B,cAAA,CAAA/B,MAAA,EAAAG,gBAAA,MAAA6B,MAAA,GAAAhC,MAAA,CAAAiC,SAAA,CAAAD,MAAA,CAxBME,MAAM,GAAb,SAAAA,OAAA,EAAgB,CACd,oBACE1C,KAAA,CAAA+B,aAAA,CAAC9B,aAAa,EAAA+B,QAAA,GAACW,WAAW,EAAE,IAAI,CAACC,WAAY,IAAK,IAAI,CAACtB,QAAQ,CAAC,CAAC,GAC9D,IAAI,CAACE,UACO,CAAC,CAEpB,CAAC,QAAAhB,MAAA,GAlByBR,KAAK,CAAC6C,SAAS,GAAAnC,OAAA,CAC3BoC,mBAAmB,GAAG,QAAQ,EAAApC,OAAA,CAC9BqC,WAAW,GAAG,QAAQ,EAAArC,OAAA,CAEtBa,YAAY,GAAiB,EACzCI,KAAK,EAAE,QAAQ,CACjB,CAAC,EAAAjB,OAAA,MAAAD,MAAA","ignoreList":[]}

package/components/Center/Center.d.ts

@@ -24,8 +24,6 @@ export declare class Center extends React.Component<CenterProps> {
     private getProps;
     getRootNode: TGetRootNode;
     private setRootNode;
-    private cx;
-    private styles;
     render(): React.JSX.Element;
     private renderMain;
 }

package/components/Center/Center.md

@@ -0,0 +1,26 @@
+### Пример использования
+
+```jsx harmony
+import { Switcher, Gapped } from '@skbkontur/react-ui';
+
+const [alignAt, setAlignAt] = React.useState("center");
+
+<Gapped vertical gap="12px">
+  <Switcher
+    items={[
+      {label: "Слева", value: "left"},
+      {label: "По центру", value: "center"},
+      {label: "Справа", value: "right"}
+    ]}
+    value={alignAt}
+    onValueChange={setAlignAt}
+  />
+
+  <Center
+    align={alignAt}
+    style={{ background: '#fdd', height: 150 }}
+  >
+    <div style={{ background: 'black', width: 30, height: 30 }} />
+  </Center>
+</Gapped>
+```

package/components/Center/Center.styles/Center.styles.js

@@ -1,22 +1,20 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-import { memoizeStyle } from "../../../lib/theming/Emotion";
-export var getStyles = function getStyles(emotion) {
-  return memoizeStyle({
-    root: function root() {
-      return emotion.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n        height: 100%;\n        text-align: center;\n      "])));
-    },
-    rootAlignLeft: function rootAlignLeft() {
-      return emotion.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n        text-align: left;\n      "])));
-    },
-    rootAlignRight: function rootAlignRight() {
-      return emotion.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n        text-align: right;\n      "])));
-    },
-    spring: function spring() {
-      return emotion.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n        display: inline-block;\n        height: 100%;\n        vertical-align: middle;\n      "])));
-    },
-    container: function container() {
-      return emotion.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n        display: inline-block;\n        text-align: left;\n        vertical-align: middle;\n      "])));
-    }
-  });
-};
+import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+export var styles = memoizeStyle({
+  root: function root() {
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      height: 100%;\n      text-align: center;\n    "])));
+  },
+  rootAlignLeft: function rootAlignLeft() {
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      text-align: left;\n    "])));
+  },
+  rootAlignRight: function rootAlignRight() {
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      text-align: right;\n    "])));
+  },
+  spring: function spring() {
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      height: 100%;\n      vertical-align: middle;\n    "])));
+  },
+  container: function container() {
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n    "])));
+  }
+});

package/components/Center/Center.styles/Center.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["memoizeStyle","getStyles","emotion","root","css","_templateObject","_taggedTemplateLiteralLoose","rootAlignLeft","_templateObject2","rootAlignRight","_templateObject3","spring","_templateObject4","container","_templateObject5"],"sources":["Center.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root() {\n      return emotion.css`\n        height: 100%;\n        text-align: center;\n      `;\n    },\n\n    rootAlignLeft() {\n      return emotion.css`\n        text-align: left;\n      `;\n    },\n\n    rootAlignRight() {\n      return emotion.css`\n        text-align: right;\n      `;\n    },\n\n    spring() {\n      return emotion.css`\n        display: inline-block;\n        height: 100%;\n        vertical-align: middle;\n      `;\n    },\n\n    container() {\n      return emotion.css`\n        display: inline-block;\n        text-align: left;\n        vertical-align: middle;\n      `;\n    },\n  });\n"],"mappings":";;AAEA,SAASA,YAAY,QAAQ,2BAA2B;;AAExD,OAAO,IAAMC,SAAS,GAAG,SAAZA,SAASA,CAAIC,OAAgB;IACxCF,YAAY,CAAC;MACXG,IAAI,WAAAA,KAAA,EAAG;QACL,OAAOD,OAAO,CAACE,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,2BAAA;;;;MAIpB,CAAC;;MAEDC,aAAa,WAAAA,cAAA,EAAG;QACd,OAAOL,OAAO,CAACE,GAAG,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,2BAAA;;;MAGpB,CAAC;;MAEDG,cAAc,WAAAA,eAAA,EAAG;QACf,OAAOP,OAAO,CAACE,GAAG,CAAAM,gBAAA,KAAAA,gBAAA,GAAAJ,2BAAA;;;MAGpB,CAAC;;MAEDK,MAAM,WAAAA,OAAA,EAAG;QACP,OAAOT,OAAO,CAACE,GAAG,CAAAQ,gBAAA,KAAAA,gBAAA,GAAAN,2BAAA;;;;;MAKpB,CAAC;;MAEDO,SAAS,WAAAA,UAAA,EAAG;QACV,OAAOX,OAAO,CAACE,GAAG,CAAAU,gBAAA,KAAAA,gBAAA,GAAAR,2BAAA;;;;;MAKpB;IACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["css","memoizeStyle","styles","root","_templateObject","_taggedTemplateLiteralLoose","rootAlignLeft","_templateObject2","rootAlignRight","_templateObject3","spring","_templateObject4","container","_templateObject5"],"sources":["Center.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      height: 100%;\n      text-align: center;\n    `;\n  },\n\n  rootAlignLeft() {\n    return css`\n      text-align: left;\n    `;\n  },\n\n  rootAlignRight() {\n    return css`\n      text-align: right;\n    `;\n  },\n\n  spring() {\n    return css`\n      display: inline-block;\n      height: 100%;\n      vertical-align: middle;\n    `;\n  },\n\n  container() {\n    return css`\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n    `;\n  },\n});\n"],"mappings":"4LAAA,SAASA,GAAG,EAAEC,YAAY,QAAQ,2BAA2B;;AAE7D,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;EACjCE,IAAI,WAAAA,KAAA,EAAG;IACL,OAAOH,GAAG,CAAAI,eAAA,KAAAA,eAAA,GAAAC,2BAAA;;;;EAIZ,CAAC;;EAEDC,aAAa,WAAAA,cAAA,EAAG;IACd,OAAON,GAAG,CAAAO,gBAAA,KAAAA,gBAAA,GAAAF,2BAAA;;;EAGZ,CAAC;;EAEDG,cAAc,WAAAA,eAAA,EAAG;IACf,OAAOR,GAAG,CAAAS,gBAAA,KAAAA,gBAAA,GAAAJ,2BAAA;;;EAGZ,CAAC;;EAEDK,MAAM,WAAAA,OAAA,EAAG;IACP,OAAOV,GAAG,CAAAW,gBAAA,KAAAA,gBAAA,GAAAN,2BAAA;;;;;EAKZ,CAAC;;EAEDO,SAAS,WAAAA,UAAA,EAAG;IACV,OAAOZ,GAAG,CAAAa,gBAAA,KAAAA,gBAAA,GAAAR,2BAAA;;;;;EAKZ;AACF,CAAC,CAAC","ignoreList":[]}

package/components/Center/Center.styles.d.ts

@@ -1,5 +1,4 @@
-import type { Emotion } from '@emotion/css/create-instance';
-export declare const getStyles: (emotion: Emotion) => {
+export declare const styles: {
     root(): string;
     rootAlignLeft(): string;
     rootAlignRight(): string;

package/components/Checkbox/Checkbox/Checkbox.js

@@ -4,16 +4,17 @@ import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 var _excluded = ["error", "warning", "size", "onMouseEnter", "onMouseLeave", "onMouseOver", "onValueChange", "type", "initialIndeterminate", "aria-describedby", "aria-label"];
 var _class, _Checkbox;
 import React from 'react';
-import { RenderEnvironmentContext } from "../../../lib/theming/RenderEnvironmentContext";
-import { KeyListener } from "../../../lib/events/keyListener";
+import { globalObject } from '@skbkontur/global-object';
+import { keyListener } from "../../../lib/events/keyListener";
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { isEdge, isIE11 } from "../../../lib/client";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
 import { fixFirefoxModifiedClickOnLabel } from "../../../lib/events/fixFirefoxModifiedClickOnLabel";
 import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { FocusControlWrapper } from "../../../internal/FocusControlWrapper";
-import { getStyles, globalClasses } from "../Checkbox.styles";
+import { styles, globalClasses } from "../Checkbox.styles";
 import { CheckedIcon } from "../CheckedIcon";
 import { IndeterminateIcon } from "../IndeterminateIcon";
 export var CheckboxDataTids = {
@@ -57,18 +58,17 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
       }
     };
     _this.componentDidMount = function () {
-      var _this$globalObject$do, _this$globalObject$do2;
-      _this.keyListener = new KeyListener(_this.globalObject);
+      var _globalObject$documen, _globalObject$documen2;
       if (_this.state.indeterminate && _this.input.current) {
         _this.input.current.indeterminate = true;
       }
-      (_this$globalObject$do = _this.globalObject.document) == null || _this$globalObject$do.addEventListener('keydown', _this.handleShiftPress);
-      (_this$globalObject$do2 = _this.globalObject.document) == null || _this$globalObject$do2.addEventListener('keyup', _this.handleShiftRelease);
+      (_globalObject$documen = globalObject.document) == null || _globalObject$documen.addEventListener('keydown', _this.handleShiftPress);
+      (_globalObject$documen2 = globalObject.document) == null || _globalObject$documen2.addEventListener('keyup', _this.handleShiftRelease);
     };
     _this.componentWillUnmount = function () {
-      var _this$globalObject$do3, _this$globalObject$do4;
-      (_this$globalObject$do3 = _this.globalObject.document) == null || _this$globalObject$do3.removeEventListener('keydown', _this.handleShiftPress);
-      (_this$globalObject$do4 = _this.globalObject.document) == null || _this$globalObject$do4.removeEventListener('keyup', _this.handleShiftRelease);
+      var _globalObject$documen3, _globalObject$documen4;
+      (_globalObject$documen3 = globalObject.document) == null || _globalObject$documen3.removeEventListener('keydown', _this.handleShiftPress);
+      (_globalObject$documen4 = globalObject.document) == null || _globalObject$documen4.removeEventListener('keyup', _this.handleShiftRelease);
     };
 
     /**
@@ -97,7 +97,7 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
       }
     };
     _this.renderMain = function (props) {
-      var _this$cx, _this$cx3, _this$cx4;
+      var _cx, _cx3, _cx4;
       var error = props.error,
         warning = props.warning,
         size = props.size,
@@ -111,7 +111,7 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
         ariaLabel = props['aria-label'],
         rest = _objectWithoutPropertiesLoose(props, _excluded);
       var isIndeterminate = _this.state.indeterminate;
-      var iconClass = _this.cx(_this.styles.icon(), !props.checked && !isIndeterminate && _this.styles.iconUnchecked());
+      var iconClass = cx(styles.icon(), !props.checked && !isIndeterminate && styles.iconUnchecked());
       var iconSize = parseInt(_this.getCheckboxBoxSize());
       var IconCheck = /*#__PURE__*/
       React.createElement("span", {
@@ -127,10 +127,10 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
       React.createElement(IndeterminateIcon, {
         size: iconSize
       }));
-      var rootClass = _this.cx(_this.getRootSizeClassName(), (_this$cx = {}, _this$cx[_this.styles.root(_this.theme)] = true, _this$cx[_this.styles.rootFallback()] = isIE11 || isEdge, _this$cx[_this.styles.rootChecked(_this.theme)] = props.checked || isIndeterminate, _this$cx[_this.styles.rootDisableTextSelect()] = _this.state.isShiftPressed, _this$cx[_this.styles.disabled(_this.theme)] = Boolean(props.disabled), _this$cx));
+      var rootClass = cx(_this.getRootSizeClassName(), (_cx = {}, _cx[styles.root(_this.theme)] = true, _cx[styles.rootFallback()] = isIE11 || isEdge, _cx[styles.rootChecked(_this.theme)] = props.checked || isIndeterminate, _cx[styles.rootDisableTextSelect()] = _this.state.isShiftPressed, _cx[styles.disabled(_this.theme)] = Boolean(props.disabled), _cx));
       var inputProps = _extends({}, rest, {
         type: 'checkbox',
-        className: _this.styles.input(),
+        className: styles.input(),
         onChange: _this.handleChange,
         onFocus: _this.handleFocus,
         onBlur: _this.handleBlur,
@@ -139,19 +139,19 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
       });
       var caption = null;
       if (_this.props.children) {
-        var _this$cx2;
-        var captionClass = _this.cx((_this$cx2 = {}, _this$cx2[_this.styles.caption(_this.theme)] = true, _this$cx2[_this.styles.captionIE11()] = isIE11 || isEdge, _this$cx2[_this.styles.disabled(_this.theme)] = Boolean(props.disabled), _this$cx2));
+        var _cx2;
+        var captionClass = cx((_cx2 = {}, _cx2[styles.caption(_this.theme)] = true, _cx2[styles.captionIE11()] = isIE11 || isEdge, _cx2[styles.disabled(_this.theme)] = Boolean(props.disabled), _cx2));
         caption = /*#__PURE__*/React.createElement("span", {
           className: captionClass
         }, _this.props.children);
       }
       var box = /*#__PURE__*/
       React.createElement("div", {
-        className: _this.cx(_this.getBoxWrapperSizeClassName(), (_this$cx3 = {}, _this$cx3[_this.styles.boxWrapper(_this.theme)] = true, _this$cx3))
+        className: cx(_this.getBoxWrapperSizeClassName(), (_cx3 = {}, _cx3[styles.boxWrapper(_this.theme)] = true, _cx3))
       }, /*#__PURE__*/
 
       React.createElement("div", {
-        className: _this.cx(_this.styles.box(_this.theme), globalClasses.box, (_this$cx4 = {}, _this$cx4[_this.styles.boxChecked(_this.theme)] = props.checked || isIndeterminate, _this$cx4[_this.styles.boxFocus(_this.theme)] = _this.state.focusedByTab, _this$cx4[_this.styles.boxError(_this.theme)] = props.error, _this$cx4[_this.styles.boxWarning(_this.theme)] = props.warning, _this$cx4[_this.styles.boxDisabled(_this.theme)] = props.disabled, _this$cx4))
+        className: cx(styles.box(_this.theme), globalClasses.box, (_cx4 = {}, _cx4[styles.boxChecked(_this.theme)] = props.checked || isIndeterminate, _cx4[styles.boxFocus(_this.theme)] = _this.state.focusedByTab, _cx4[styles.boxError(_this.theme)] = props.error, _cx4[styles.boxWarning(_this.theme)] = props.warning, _cx4[styles.boxDisabled(_this.theme)] = props.disabled, _cx4))
       }, isIndeterminate && IconSquare || IconCheck));
       return /*#__PURE__*/(
         React.createElement("label", {
@@ -176,8 +176,8 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
       if (!_this.props.disabled) {
         // focus event fires before keyDown eventlistener
         // so we should check tabPressed in async way
-        _this.globalObject.requestAnimationFrame == null || _this.globalObject.requestAnimationFrame(function () {
-          if (_this.keyListener.isTabPressed) {
+        globalObject.requestAnimationFrame == null || globalObject.requestAnimationFrame(function () {
+          if (keyListener.isTabPressed) {
             _this.setState({
               focusedByTab: true
             });
@@ -228,23 +228,23 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
   _proto.getRootSizeClassName = function getRootSizeClassName() {
     switch (this.getProps().size) {
       case 'large':
-        return this.styles.rootLarge(this.theme);
+        return styles.rootLarge(this.theme);
       case 'medium':
-        return this.styles.rootMedium(this.theme);
+        return styles.rootMedium(this.theme);
       case 'small':
       default:
-        return this.styles.rootSmall(this.theme);
+        return styles.rootSmall(this.theme);
     }
   };
   _proto.getBoxWrapperSizeClassName = function getBoxWrapperSizeClassName() {
     switch (this.getProps().size) {
       case 'large':
-        return this.styles.boxWrapperLarge(this.theme);
+        return styles.boxWrapperLarge(this.theme);
       case 'medium':
-        return this.styles.boxWrapperMedium(this.theme);
+        return styles.boxWrapperMedium(this.theme);
       case 'small':
       default:
-        return this.styles.boxWrapperSmall(this.theme);
+        return styles.boxWrapperSmall(this.theme);
     }
   };
   _proto.getCheckboxBoxSize = function getCheckboxBoxSize() {
@@ -265,18 +265,11 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
   };
   _proto.render = function render() {
     var _this2 = this;
-    return /*#__PURE__*/React.createElement(RenderEnvironmentContext.Consumer, null, function (_ref) {
-      var globalObject = _ref.globalObject,
-        emotion = _ref.emotion;
-      _this2.globalObject = globalObject;
-      _this2.cx = emotion.cx;
-      _this2.styles = getStyles(emotion);
-      return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
-        _this2.theme = theme;
-        return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
-          rootNodeRef: _this2.setRootNode
-        }, _this2.getProps()), _this2.renderMain);
-      });
+    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+      _this2.theme = theme;
+      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+        rootNodeRef: _this2.setRootNode
+      }, _this2.getProps()), _this2.renderMain);
     });
   } /**
     * Программная установка фокуса чекбоксу.
@@ -284,7 +277,7 @@ export var Checkbox = rootNode(_class = (_Checkbox = /*#__PURE__*/function (_Rea
     */;
   _proto.focus = function focus() {
     var _this$input$current;
-    this.keyListener.isTabPressed = true;
+    keyListener.isTabPressed = true;
     (_this$input$current = this.input.current) == null || _this$input$current.focus();
   } /**
     * Программное снятие фокуса с чекбокса.