@skbkontur/react-ui 0.0.0-69a6fa606f → 0.0.0-6fbd9fadb2

package/components/Calendar/locale/locales/en/en.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["en.ts"],"names":["componentsLocales","months","dayCellChooseDateAriaLabel"],"mappings":";;AAEA,OAAO,IAAMA,iBAAiC,GAAG;AAC/CC,EAAAA,MAAM,EAAE;AACN,WADM;AAEN,YAFM;AAGN,SAHM;AAIN,SAJM;AAKN,OALM;AAMN,QANM;AAON,QAPM;AAQN,UARM;AASN,aATM;AAUN,WAVM;AAWN,YAXM;AAYN,YAZM,CADuC;;AAe/CC,EAAAA,0BAA0B,EAAE,aAfmB,EAA1C","sourcesContent":["import { CalendarLocale } from '../types';\n\nexport const componentsLocales: CalendarLocale = {\n  months: [\n    'January',\n    'February',\n    'March',\n    'April',\n    'May',\n    'June',\n    'July',\n    'August',\n    'September',\n    'October',\n    'November',\n    'December',\n  ],\n  dayCellChooseDateAriaLabel: 'Choose date',\n};\n"]}

package/components/Calendar/locale/locales/en/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../../cjs/components/Calendar/locale/locales/en.js",
+  "module": "en",
+  "types": "../en.d.ts",
+  "sideEffects": false
+}

package/components/Calendar/locale/locales/en.d.ts

@@ -0,0 +1,2 @@
+import { CalendarLocale } from '../types';
+export declare const componentsLocales: CalendarLocale;

package/components/Calendar/locale/locales/ru/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../../cjs/components/Calendar/locale/locales/ru.js",
+  "module": "ru",
+  "types": "../ru.d.ts",
+  "sideEffects": false
+}

package/components/Calendar/locale/locales/ru/ru.js

@@ -0,0 +1,4 @@
+export var componentsLocales = {
+  months: ['Январь', 'Февраль', 'Март', 'Апрель', 'Май', 'Июнь', 'Июль', 'Август', 'Сентябрь', 'Октябрь', 'Ноябрь', 'Декабрь'],
+  dayCellChooseDateAriaLabel: 'Выбрать дату'
+};

package/components/Calendar/locale/locales/ru/ru.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ru.ts"],"names":["componentsLocales","months","dayCellChooseDateAriaLabel"],"mappings":";;AAEA,OAAO,IAAMA,iBAAiC,GAAG;AAC/CC,EAAAA,MAAM,EAAE;AACN,UADM;AAEN,WAFM;AAGN,QAHM;AAIN,UAJM;AAKN,OALM;AAMN,QANM;AAON,QAPM;AAQN,UARM;AASN,YATM;AAUN,WAVM;AAWN,UAXM;AAYN,WAZM,CADuC;;AAe/CC,EAAAA,0BAA0B,EAAE,cAfmB,EAA1C","sourcesContent":["import { CalendarLocale } from '../types';\n\nexport const componentsLocales: CalendarLocale = {\n  months: [\n    'Январь',\n    'Февраль',\n    'Март',\n    'Апрель',\n    'Май',\n    'Июнь',\n    'Июль',\n    'Август',\n    'Сентябрь',\n    'Октябрь',\n    'Ноябрь',\n    'Декабрь',\n  ],\n  dayCellChooseDateAriaLabel: 'Выбрать дату',\n};\n"]}

package/components/Calendar/locale/locales/ru.d.ts

@@ -0,0 +1,2 @@
+import { CalendarLocale } from '../types';
+export declare const componentsLocales: CalendarLocale;

package/components/Calendar/locale/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Calendar/locale/index.js",
+  "module": "index",
+  "types": "index.d.ts",
+  "sideEffects": false
+}

package/components/Calendar/locale/types/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/Calendar/locale/types.js",
+  "module": "types",
+  "types": "../types.d.ts",
+  "sideEffects": false
+}

package/components/Calendar/locale/types/types.js

@@ -0,0 +1 @@
+export {};

package/components/Calendar/locale/types/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/components/Calendar/locale/types.d.ts

@@ -0,0 +1,7 @@
+export interface CalendarLocale {
+    months?: string[];
+    selectMonthAriaLabel?: string;
+    selectYearAriaLabel?: string;
+    selectChosenAriaLabel?: string;
+    dayCellChooseDateAriaLabel?: string;
+}

package/components/Calendar/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../cjs/components/Calendar/index.js",
+  "module": "index",
+  "types": "index.d.ts",
+  "sideEffects": false
+}

package/components/Center/Center/Center.js

@@ -7,17 +7,18 @@ var _class, _class2, _temp;
 
 import React from 'react';
 import { CommonWrapper } from "../../../internal/CommonWrapper";
-import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
-import { styles } from "../Center.styles";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
+import { getStyles } from "../Center.styles";
 export var CenterDataTids = {
   root: 'Center__root'
 };
+export
 /**
- * Контейнер, который центрирует элементы внутри себя.
- */
-
-export var Center = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+* Контейнер, который центрирует элементы внутри себя.
+*/
+var Center = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(Center, _React$Component);
 
   function Center() {
@@ -28,17 +29,19 @@ export var Center = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
     }
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Center.defaultProps);
 
     _this.renderMain = function (props) {
-      var _cx;
+      var _this$emotion$cx;
 
       var align = props.align,
           rest = _objectWithoutPropertiesLoose(props, _excluded);
 
+      var styles = getStyles(_this.emotion);
       return /*#__PURE__*/React.createElement("div", _extends({
         "data-tid": CenterDataTids.root
       }, rest, {
-        className: cx((_cx = {}, _cx[styles.root()] = true, _cx[styles.rootAlignLeft()] = align === 'left', _cx[styles.rootAlignRight()] = align === 'right', _cx))
+        className: _this.emotion.cx((_this$emotion$cx = {}, _this$emotion$cx[styles.root()] = true, _this$emotion$cx[styles.rootAlignLeft()] = align === 'left', _this$emotion$cx[styles.rootAlignRight()] = align === 'right', _this$emotion$cx))
       }), /*#__PURE__*/React.createElement("span", {
         className: styles.spring()
       }), /*#__PURE__*/React.createElement("span", {
@@ -52,12 +55,17 @@ export var Center = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (
   var _proto = Center.prototype;
 
   _proto.render = function render() {
-    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
-      rootNodeRef: this.setRootNode
-    }, this.props), this.renderMain);
+    var _this2 = this;
+
+    return /*#__PURE__*/React.createElement(EmotionConsumer, null, function (emotion) {
+      _this2.emotion = emotion;
+      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+        rootNodeRef: _this2.setRootNode
+      }, _this2.getProps()), _this2.renderMain);
+    });
   };
 
   return Center;
-}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Center', _class2.defaultProps = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Center', _class2.displayName = 'Center', _class2.defaultProps = {
   align: 'center'
 }, _temp)) || _class;

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

@@ -1 +1 @@
-{"version":3,"sources":["Center.tsx"],"names":["React","CommonWrapper","cx","rootNode","styles","CenterDataTids","root","Center","renderMain","props","align","rest","rootAlignLeft","rootAlignRight","spring","container","children","render","setRootNode","Component","__KONTUR_REACT_UI__","defaultProps"],"mappings":"yRAAA,OAAOA,KAAP,MAAkB,OAAlB;;;AAGA,SAAsBC,aAAtB,QAAmE,8BAAnE;AACA,SAASC,EAAT,QAAmB,2BAAnB;AACA,SAASC,QAAT,QAAuC,oBAAvC;;AAEA,SAASC,MAAT,QAAuB,iBAAvB;;;;;;;;;;;;;;;;;;AAkBA,OAAO,IAAMC,cAAc,GAAG;AAC5BC,EAAAA,IAAI,EAAE,cADsB,EAAvB;;;AAIP;AACA;AACA;;AAEA,WAAaC,MAAb,GADCJ,QACD;;;;;;;;;;;;;;;AAeUK,IAAAA,UAfV,GAeuB,UAACC,KAAD,EAAgD;AACnE,UAAQC,KAAR,GAA2BD,KAA3B,CAAQC,KAAR,CAAkBC,IAAlB,iCAA2BF,KAA3B;;AAEA;AACE;AACE,sBAAUJ,cAAc,CAACC,IAD3B;AAEMK,QAAAA,IAFN;AAGE,UAAA,SAAS,EAAET,EAAE;AACVE,UAAAA,MAAM,CAACE,IAAP,EADU,IACM,IADN;AAEVF,UAAAA,MAAM,CAACQ,aAAP,EAFU,IAEeF,KAAK,KAAK,MAFzB;AAGVN,UAAAA,MAAM,CAACS,cAAP,EAHU,IAGgBH,KAAK,KAAK,OAH1B,OAHf;;;AASE,sCAAM,SAAS,EAAEN,MAAM,CAACU,MAAP,EAAjB,GATF;AAUE,sCAAM,SAAS,EAAEV,MAAM,CAACW,SAAP,EAAjB,IAAsC,MAAKN,KAAL,CAAWO,QAAjD,CAVF,CADF;;;AAcD,KAhCH,oDAQSC,MART,GAQE,kBAAgB,CACd,oBACE,oBAAC,aAAD,aAAe,WAAW,EAAE,KAAKC,WAAjC,IAAkD,KAAKT,KAAvD,GACG,KAAKD,UADR,CADF,CAKD,CAdH,iBAA4BR,KAAK,CAACmB,SAAlC,WACgBC,mBADhB,GACsC,QADtC,UAGgBC,YAHhB,GAG+B,EAC3BX,KAAK,EAAE,QADoB,EAH/B","sourcesContent":["import React from 'react';\n\nimport { Override } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\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         * Определяет, как контент будет выровнен по горизонтали.\n         *\n         * **Допустимые значения**: `\"left\"`, `\"center\"`, `\"right\"`.\n         */\n        align?: HorizontalAlign;\n      }\n    > {}\n\nexport const CenterDataTids = {\n  root: 'Center__root',\n} as const;\n\n/**\n * Контейнер, который центрирует элементы внутри себя.\n */\n@rootNode\nexport class Center extends React.Component<CenterProps> {\n  public static __KONTUR_REACT_UI__ = 'Center';\n\n  public static defaultProps = {\n    align: 'center',\n  };\n  private setRootNode!: TSetRootNode;\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        {this.renderMain}\n      </CommonWrapper>\n    );\n  }\n  private renderMain = (props: CommonWrapperRestProps<CenterProps>) => {\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"]}
+{"version":3,"sources":["Center.tsx"],"names":["React","CommonWrapper","rootNode","createPropsGetter","EmotionConsumer","getStyles","CenterDataTids","root","Center","getProps","defaultProps","renderMain","props","align","rest","styles","emotion","cx","rootAlignLeft","rootAlignRight","spring","container","children","render","setRootNode","Component","__KONTUR_REACT_UI__","displayName"],"mappings":"yRAAA,OAAOA,KAAP,MAAkB,OAAlB;;;;AAIA,SAAsBC,aAAtB,QAAmE,8BAAnE;AACA,SAASC,QAAT,QAAuC,oBAAvC;AACA,SAASC,iBAAT,QAAoD,6BAApD;AACA,SAASC,eAAT,QAAgC,2BAAhC;;AAEA,SAASC,SAAT,QAA0B,iBAA1B;;;;;;;;;;;;;;;;;;AAkBA,OAAO,IAAMC,cAAc,GAAG;AAC5BC,EAAAA,IAAI,EAAE,cADsB,EAAvB;;;;;;;;;;AAWP,OAJA;AACA;AACA,GAEA,IAAaC,MAAb,GADCN,QACD;;;;;AAOUO,IAAAA,QAPV,GAOqBN,iBAAiB,CAACK,MAAM,CAACE,YAAR,CAPtC;;;;;;;;;;;;;;;;;;;AA0BUC,IAAAA,UA1BV,GA0BuB,UAACC,KAAD,EAA2D;AAC9E,UAAQC,KAAR,GAA2BD,KAA3B,CAAQC,KAAR,CAAkBC,IAAlB,iCAA2BF,KAA3B;AACA,UAAMG,MAAM,GAAGV,SAAS,CAAC,MAAKW,OAAN,CAAxB;AACA;AACE;AACE,sBAAUV,cAAc,CAACC,IAD3B;AAEMO,QAAAA,IAFN;AAGE,UAAA,SAAS,EAAE,MAAKE,OAAL,CAAaC,EAAb;AACRF,UAAAA,MAAM,CAACR,IAAP,EADQ,IACQ,IADR;AAERQ,UAAAA,MAAM,CAACG,aAAP,EAFQ,IAEiBL,KAAK,KAAK,MAF3B;AAGRE,UAAAA,MAAM,CAACI,cAAP,EAHQ,IAGkBN,KAAK,KAAK,OAH5B,oBAHb;;;AASE,sCAAM,SAAS,EAAEE,MAAM,CAACK,MAAP,EAAjB,GATF;AAUE,sCAAM,SAAS,EAAEL,MAAM,CAACM,SAAP,EAAjB,IAAsC,MAAKT,KAAL,CAAWU,QAAjD,CAVF,CADF;;;AAcD,KA3CH,oDAYSC,MAZT,GAYE,kBAAgB,mBACd,oBACE,oBAAC,eAAD,QACG,UAACP,OAAD,EAAa,CACZ,MAAI,CAACA,OAAL,GAAeA,OAAf,CACA,oBACE,oBAAC,aAAD,aAAe,WAAW,EAAE,MAAI,CAACQ,WAAjC,IAAkD,MAAI,CAACf,QAAL,EAAlD,GACG,MAAI,CAACE,UADR,CADF,CAKD,CARH,CADF,CAYD,CAzBH,iBAA4BX,KAAK,CAACyB,SAAlC,WACgBC,mBADhB,GACsC,QADtC,UAEgBC,WAFhB,GAE8B,QAF9B,UAIgBjB,YAJhB,GAI6C,EACzCG,KAAK,EAAE,QADkC,EAJ7C","sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { Override } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter, DefaultizedProps } from '../../lib/createPropsGetter';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\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         * Определяет, как контент будет выровнен по горизонтали.\n         *\n         * **Допустимые значения**: `\"left\"`, `\"center\"`, `\"right\"`.\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 * Контейнер, который центрирует элементы внутри себя.\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  private emotion!: Emotion;\n  private setRootNode!: TSetRootNode;\n\n  public render() {\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n              {this.renderMain}\n            </CommonWrapper>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedCenterProps>) => {\n    const { align, ...rest } = props;\n    const styles = getStyles(this.emotion);\n    return (\n      <div\n        data-tid={CenterDataTids.root}\n        {...rest}\n        className={this.emotion.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"]}

package/components/Center/Center.d.ts

@@ -14,15 +14,18 @@ export interface CenterProps extends CommonProps, Override<React.HTMLAttributes<
 export declare const CenterDataTids: {
     readonly root: "Center__root";
 };
+declare type DefaultProps = Required<Pick<CenterProps, 'align'>>;
 /**
  * Контейнер, который центрирует элементы внутри себя.
  */
 export declare class Center extends React.Component<CenterProps> {
     static __KONTUR_REACT_UI__: string;
-    static defaultProps: {
-        align: string;
-    };
+    static displayName: string;
+    static defaultProps: DefaultProps;
+    private getProps;
+    private emotion;
     private setRootNode;
     render(): JSX.Element;
     private renderMain;
 }
+export {};

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

@@ -2,21 +2,23 @@ import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTempla
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 
-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    "])));
-  }
-});
+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      "])));
+    }
+  });
+};

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

@@ -1 +1 @@
-{"version":3,"sources":["Center.styles.ts"],"names":["css","memoizeStyle","styles","root","rootAlignLeft","rootAlignRight","spring","container"],"mappings":"4LAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,IADiC,kBAC1B;AACL,WAAOH,GAAP;;;;AAID,GANgC;;AAQjCI,EAAAA,aARiC,2BAQjB;AACd,WAAOJ,GAAP;;;AAGD,GAZgC;;AAcjCK,EAAAA,cAdiC,4BAchB;AACf,WAAOL,GAAP;;;AAGD,GAlBgC;;AAoBjCM,EAAAA,MApBiC,oBAoBxB;AACP,WAAON,GAAP;;;;;AAKD,GA1BgC;;AA4BjCO,EAAAA,SA5BiC,uBA4BrB;AACV,WAAOP,GAAP;;;;;AAKD,GAlCgC,EAAD,CAA3B","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"]}
+{"version":3,"sources":["Center.styles.ts"],"names":["memoizeStyle","getStyles","emotion","root","css","rootAlignLeft","rootAlignRight","spring","container"],"mappings":";;AAEA,SAASA,YAAT,QAA6B,2BAA7B;;AAEA,OAAO,IAAMC,SAAS,GAAG,SAAZA,SAAY,CAACC,OAAD;AACvBF,IAAAA,YAAY,CAAC;AACXG,MAAAA,IADW,kBACJ;AACL,eAAOD,OAAO,CAACE,GAAf;;;;AAID,OANU;;AAQXC,MAAAA,aARW,2BAQK;AACd,eAAOH,OAAO,CAACE,GAAf;;;AAGD,OAZU;;AAcXE,MAAAA,cAdW,4BAcM;AACf,eAAOJ,OAAO,CAACE,GAAf;;;AAGD,OAlBU;;AAoBXG,MAAAA,MApBW,oBAoBF;AACP,eAAOL,OAAO,CAACE,GAAf;;;;;AAKD,OA1BU;;AA4BXI,MAAAA,SA5BW,uBA4BC;AACV,eAAON,OAAO,CAACE,GAAf;;;;;AAKD,OAlCU,EAAD,CADW,GAAlB","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"]}

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

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

package/components/Checkbox/Checkbox/Checkbox.js

@@ -1,21 +1,34 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
-var _excluded = ["error", "warning", "onMouseEnter", "onMouseLeave", "onMouseOver", "onValueChange", "type", "initialIndeterminate"];
+var _excluded = ["error", "warning", "size", "onMouseEnter", "onMouseLeave", "onMouseOver", "onValueChange", "type", "initialIndeterminate", "aria-describedby", "aria-label"];
+
+var _class, _class2, _temp; // TODO: Enable this rule in functional components.
+
+/* eslint-disable @typescript-eslint/no-unused-vars */
 
-var _class, _class2, _temp;
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import { globalObject } from '@skbkontur/global-object';
 import { keyListener } from "../../../lib/events/keyListener";
-import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { OkIcon, SquareIcon } from "../../../internal/icons/16px";
 import { isEdge, isIE11 } from "../../../lib/client";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
-import { cx } from "../../../lib/theming/Emotion";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
 import { fixFirefoxModifiedClickOnLabel } from "../../../lib/events/fixFirefoxModifiedClickOnLabel";
-import { styles, globalClasses } from "../Checkbox.styles";
+import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { FocusControlWrapper } from "../../../internal/FocusControlWrapper";
+import { ThemeConsumer } from "../../../lib/theming/ThemeContext";
+import { getStyles, globalClasses } from "../Checkbox.styles";
+import { CheckedIcon } from "../CheckedIcon";
+import { IndeterminateIcon } from "../IndeterminateIcon";
+/**
+ * @deprecated use SizeProp
+ */
+
 export var CheckboxDataTids = {
   root: 'Checkbox__root'
 };
@@ -30,16 +43,48 @@ export var Checkbox = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
     }
 
     _this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Checkbox.defaultProps);
     _this.state = {
       focusedByTab: false,
-      indeterminate: _this.props.initialIndeterminate || false
+      indeterminate: _this.props.initialIndeterminate || false,
+      isShiftPressed: false
     };
     _this.input = /*#__PURE__*/React.createRef();
 
+    _this.handleShiftPress = function (e) {
+      if (e.key === 'Shift') {
+        _this.setState(function () {
+          return {
+            isShiftPressed: true
+          };
+        });
+      }
+    };
+
+    _this.handleShiftRelease = function (e) {
+      if (e.key === 'Shift') {
+        _this.setState({
+          isShiftPressed: false
+        });
+      }
+    };
+
     _this.componentDidMount = function () {
+      var _globalObject$documen, _globalObject$documen2;
+
       if (_this.state.indeterminate && _this.input.current) {
         _this.input.current.indeterminate = true;
       }
+
+      (_globalObject$documen = globalObject.document) == null ? void 0 : _globalObject$documen.addEventListener('keydown', _this.handleShiftPress);
+      (_globalObject$documen2 = globalObject.document) == null ? void 0 : _globalObject$documen2.addEventListener('keyup', _this.handleShiftRelease);
+    };
+
+    _this.componentWillUnmount = function () {
+      var _globalObject$documen3, _globalObject$documen4;
+
+      (_globalObject$documen3 = globalObject.document) == null ? void 0 : _globalObject$documen3.removeEventListener('keydown', _this.handleShiftPress);
+      (_globalObject$documen4 = globalObject.document) == null ? void 0 : _globalObject$documen4.removeEventListener('keyup', _this.handleShiftRelease);
     };
 
     _this.setIndeterminate = function () {
@@ -63,20 +108,46 @@ export var Checkbox = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
     };
 
     _this.renderMain = function (props) {
-      var _cx, _cx3, _cx4;
+      var _this$emotion$cx, _this$emotion$cx3, _this$emotion$cx4;
 
       var error = props.error,
           warning = props.warning,
+          size = props.size,
           onMouseEnter = props.onMouseEnter,
           onMouseLeave = props.onMouseLeave,
           onMouseOver = props.onMouseOver,
           onValueChange = props.onValueChange,
           type = props.type,
           initialIndeterminate = props.initialIndeterminate,
+          ariaDescribedby = props['aria-describedby'],
+          ariaLabel = props['aria-label'],
           rest = _objectWithoutPropertiesLoose(props, _excluded);
 
       var isIndeterminate = _this.state.indeterminate;
-      var rootClass = cx((_cx = {}, _cx[styles.root(_this.theme)] = true, _cx[styles.rootFallback()] = isIE11 || isEdge, _cx[styles.rootChecked(_this.theme)] = props.checked || isIndeterminate, _cx[styles.disabled(_this.theme)] = Boolean(props.disabled), _cx));
+
+      var _isTheme2022 = isTheme2022(_this.theme);
+
+      var styles = getStyles(_this.emotion);
+
+      var iconClass = _this.emotion.cx(styles.icon(), !_isTheme2022 && styles.iconFixPosition(), !props.checked && !isIndeterminate && styles.iconUnchecked());
+
+      var iconSize = parseInt(_this.getCheckboxBoxSize());
+      var IconCheck = _isTheme2022 ? /*#__PURE__*/React.createElement("span", {
+        className: iconClass
+      }, /*#__PURE__*/React.createElement(CheckedIcon, {
+        size: iconSize
+      })) : /*#__PURE__*/React.createElement(OkIcon, {
+        className: iconClass
+      });
+      var IconSquare = _isTheme2022 ? /*#__PURE__*/React.createElement("span", {
+        className: iconClass
+      }, /*#__PURE__*/React.createElement(IndeterminateIcon, {
+        size: iconSize
+      })) : /*#__PURE__*/React.createElement(SquareIcon, {
+        className: iconClass
+      });
+
+      var rootClass = _this.emotion.cx(_this.getRootSizeClassName(), (_this$emotion$cx = {}, _this$emotion$cx[styles.root(_this.theme)] = true, _this$emotion$cx[styles.rootFallback()] = isIE11 || isEdge, _this$emotion$cx[styles.rootChecked(_this.theme)] = props.checked || isIndeterminate, _this$emotion$cx[styles.rootDisableTextSelect()] = _this.state.isShiftPressed, _this$emotion$cx[styles.disabled(_this.theme)] = Boolean(props.disabled), _this$emotion$cx));
 
       var inputProps = _extends({}, rest, {
         type: 'checkbox',
@@ -91,24 +162,20 @@ export var Checkbox = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
       var caption = null;
 
       if (_this.props.children) {
-        var _cx2;
+        var _this$emotion$cx2;
+
+        var captionClass = _this.emotion.cx((_this$emotion$cx2 = {}, _this$emotion$cx2[styles.caption(_this.theme)] = true, _this$emotion$cx2[styles.captionIE11()] = isIE11 || isEdge, _this$emotion$cx2[styles.disabled(_this.theme)] = Boolean(props.disabled), _this$emotion$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 iconClass = cx((_cx3 = {}, _cx3[styles.icon(_this.theme)] = true, _cx3[styles.iconUnchecked()] = !props.checked && !isIndeterminate, _cx3));
       var box = /*#__PURE__*/React.createElement("div", {
-        className: cx(styles.boxWrapper(_this.theme))
+        className: _this.emotion.cx(_this.getBoxWrapperSizeClassName(), (_this$emotion$cx3 = {}, _this$emotion$cx3[styles.boxWrapper(_this.theme)] = true, _this$emotion$cx3))
       }, /*#__PURE__*/React.createElement("div", {
-        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 && /*#__PURE__*/React.createElement(SquareIcon, {
-        className: iconClass
-      }) || /*#__PURE__*/React.createElement(OkIcon, {
-        className: iconClass
-      })));
+        className: _this.emotion.cx(styles.box(_this.theme), globalClasses.box, (_this$emotion$cx4 = {}, _this$emotion$cx4[styles.boxChecked(_this.theme)] = props.checked || isIndeterminate, _this$emotion$cx4[styles.boxFocus(_this.theme)] = _this.state.focusedByTab, _this$emotion$cx4[styles.boxError(_this.theme)] = props.error, _this$emotion$cx4[styles.boxWarning(_this.theme)] = props.warning, _this$emotion$cx4[styles.boxDisabled(_this.theme)] = props.disabled, _this$emotion$cx4))
+      }, isIndeterminate && IconSquare || IconCheck));
       return /*#__PURE__*/React.createElement("label", {
         "data-tid": CheckboxDataTids.root,
         className: rootClass,
@@ -116,14 +183,19 @@ export var Checkbox = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
         onMouseLeave: onMouseLeave,
         onMouseOver: onMouseOver,
         onClick: fixFirefoxModifiedClickOnLabel(_this.input)
-      }, /*#__PURE__*/React.createElement("input", inputProps), box, caption);
+      }, /*#__PURE__*/React.createElement(FocusControlWrapper, {
+        onBlurWhenDisabled: _this.resetFocus
+      }, /*#__PURE__*/React.createElement("input", _extends({}, inputProps, {
+        "aria-label": ariaLabel,
+        "aria-describedby": ariaDescribedby
+      }))), box, caption);
     };
 
     _this.handleFocus = function (e) {
       if (!_this.props.disabled) {
         // focus event fires before keyDown eventlistener
         // so we should check tabPressed in async way
-        requestAnimationFrame(function () {
+        globalObject.requestAnimationFrame == null ? void 0 : globalObject.requestAnimationFrame(function () {
           if (keyListener.isTabPressed) {
             _this.setState({
               focusedByTab: true
@@ -137,14 +209,18 @@ export var Checkbox = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
       }
     };
 
-    _this.handleBlur = function (e) {
-      _this.props.onBlur == null ? void 0 : _this.props.onBlur(e);
-
-      _this.setState({
+    _this.resetFocus = function () {
+      return _this.setState({
         focusedByTab: false
       });
     };
 
+    _this.handleBlur = function (e) {
+      _this.resetFocus();
+
+      _this.props.onBlur == null ? void 0 : _this.props.onBlur(e);
+    };
+
     _this.handleChange = function (event) {
       var checked = event.currentTarget.checked;
       _this.props.onValueChange == null ? void 0 : _this.props.onValueChange(checked);
@@ -181,6 +257,52 @@ export var Checkbox = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
 
   var _proto = Checkbox.prototype;
 
+  _proto.getRootSizeClassName = function getRootSizeClassName() {
+    var styles = getStyles(this.emotion);
+
+    switch (this.getProps().size) {
+      case 'large':
+        return styles.rootLarge(this.theme);
+
+      case 'medium':
+        return styles.rootMedium(this.theme);
+
+      case 'small':
+      default:
+        return styles.rootSmall(this.theme);
+    }
+  };
+
+  _proto.getBoxWrapperSizeClassName = function getBoxWrapperSizeClassName() {
+    var styles = getStyles(this.emotion);
+
+    switch (this.getProps().size) {
+      case 'large':
+        return styles.boxWrapperLarge(this.theme);
+
+      case 'medium':
+        return styles.boxWrapperMedium(this.theme);
+
+      case 'small':
+      default:
+        return styles.boxWrapperSmall(this.theme);
+    }
+  };
+
+  _proto.getCheckboxBoxSize = function getCheckboxBoxSize() {
+    switch (this.getProps().size) {
+      case 'large':
+        return this.theme.checkboxBoxSizeLarge;
+
+      case 'medium':
+        return this.theme.checkboxBoxSizeMedium;
+
+      case 'small':
+      default:
+        return this.theme.checkboxBoxSizeSmall;
+    }
+  };
+
   _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
     if (prevProps.checked !== this.props.checked) {
       this.resetIndeterminate();
@@ -190,11 +312,14 @@ export var Checkbox = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
   _proto.render = function render() {
     var _this2 = this;
 
-    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
-      _this2.theme = theme;
-      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
-        rootNodeRef: _this2.setRootNode
-      }, _this2.props), _this2.renderMain);
+    return /*#__PURE__*/React.createElement(EmotionConsumer, null, function (emotion) {
+      _this2.emotion = emotion;
+      return /*#__PURE__*/React.createElement(ThemeConsumer, null, function (theme) {
+        _this2.theme = theme;
+        return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+          rootNodeRef: _this2.setRootNode
+        }, _this2.props), _this2.renderMain);
+      });
     });
   }
   /**
@@ -227,7 +352,9 @@ export var Checkbox = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function
   ;
 
   return Checkbox;
-}(React.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Checkbox', _class2.propTypes = {
+}(React.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Checkbox', _class2.displayName = 'Checkbox', _class2.defaultProps = {
+  size: 'small'
+}, _class2.propTypes = {
   checked: PropTypes.bool,
   disabled: PropTypes.bool,
   error: PropTypes.bool,