@skbkontur/react-ui 0.0.0-50f666af0e → 0.0.0-52df310f7c

package/cjs/components/Modal/ModalHeader.js

@@ -1,55 +1,75 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");exports.__esModule = true;exports.ModalHeader = ModalHeader;var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
+"use strict";exports.__esModule = true;exports.ModalHeader = ModalHeader;exports.ModalHeaderDataTids = void 0;var _react = _interopRequireWildcard(require("react"));
 
 var _Sticky = require("../Sticky");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _ZIndex = require("../../internal/ZIndex");
+var _CommonWrapper = require("../../internal/CommonWrapper");
+var _Emotion = require("../../lib/theming/Emotion");
+var _ResponsiveLayout = require("../ResponsiveLayout");
 
 var _Modal = require("./Modal.styles");
 var _ModalClose = require("./ModalClose");
-var _ModalContext = require("./ModalContext");
+var _ModalContext = require("./ModalContext");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
 
 
 
 
-/**
-                                                * Шапка модального окна
-                                                *
-                                                * @visibleName Modal.Header
-                                                */
-function ModalHeader(_ref) {var _ref$sticky = _ref.sticky,sticky = _ref$sticky === void 0 ? true : _ref$sticky,children = _ref.children;
+
+var ModalHeaderDataTids = {
+  root: 'ModalHeader__root' };
+
+
+/**
+ * Шапка модального окна
+ *
+ * @visibleName Modal.Header
+ */exports.ModalHeaderDataTids = ModalHeaderDataTids;
+function ModalHeader(props) {
+  var _useState = (0, _react.useState)(false),isFixed = _useState[0],setIsFixed = _useState[1];
+
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
+  var modal = (0, _react.useContext)(_ModalContext.ModalContext);
+  var layout = (0, _ResponsiveLayout.useResponsiveLayout)();
+
+  var _props$sticky = props.sticky,sticky = _props$sticky === void 0 ? !layout.isMobile : _props$sticky,children = props.children;
+
+  (0, _react.useLayoutEffect)(function () {
+    modal.setHasHeader == null ? void 0 : modal.setHasHeader();
+
+    return function () {return modal.setHasHeader == null ? void 0 : modal.setHasHeader(false);};
+  }, []);
 
-  var renderContent = function renderContent(close, additionalPadding) {return function (fixed) {var _cn;if (fixed === void 0) {fixed = false;}
-      return (
-        _react.default.createElement("div", {
-          className: (0, _classnames.default)((_cn = {}, _cn[
-          _Modal.jsStyles.header()] = true, _cn[
-          _Modal.jsStyles.fixedHeader(theme)] = fixed, _cn[
-          _Modal.jsStyles.headerAddPadding()] = Boolean(additionalPadding), _cn)) },
+  var renderContent = function renderContent(fixed) {var _cx;if (fixed === void 0) {fixed = false;}
+    return /*#__PURE__*/(
+      _react.default.createElement("div", {
+        "data-tid": ModalHeaderDataTids.root,
+        className: (0, _Emotion.cx)((_cx = {}, _cx[
+        _Modal.styles.header(theme)] = true, _cx[
+        _Modal.styles.mobileHeader(theme)] = layout.isMobile, _cx[
+        _Modal.styles.headerAddPadding()] = Boolean(modal.additionalPadding), _cx[
+        _Modal.styles.fixedHeader(theme)] = fixed, _cx[
+        _Modal.styles.mobileFixedHeader(theme)] = fixed && layout.isMobile, _cx[
+        _Modal.styles.headerWithClose(theme)] = Boolean(modal.close), _cx[
+        _Modal.styles.mobileHeaderWithClose(theme)] = layout.isMobile, _cx)) },
 
 
-        close &&
-        _react.default.createElement("div", { className: _Modal.jsStyles.absoluteClose() },
-        _react.default.createElement(_ModalClose.ModalClose, { requestClose: close.requestClose, disableClose: close.disableClose })),
+      modal.close && /*#__PURE__*/_react.default.createElement(_ModalClose.ModalClose, { requestClose: modal.close.requestClose, disableClose: modal.close.disableClose }),
+      children));
 
 
-        children));
+  };
 
+  return /*#__PURE__*/(
+    _react.default.createElement(_CommonWrapper.CommonWrapper, props, /*#__PURE__*/
+    _react.default.createElement(_ZIndex.ZIndex, { priority: isFixed ? 'ModalFixedHeader' : undefined, className: _Modal.styles.headerWrapper() },
+    sticky ? /*#__PURE__*/
+    _react.default.createElement(_Sticky.Sticky, { getIsFixed: setIsFixed, side: "top" },
+    renderContent) :
 
-    };};
 
-  return (
-    _react.default.createElement(_ZIndex.ZIndex, { style: { position: 'relative' }, priority: 'ModalHeader' },
-    _react.default.createElement(_ModalContext.ModalContext.Consumer, null,
-    function (_ref2) {var close = _ref2.close,additionalPadding = _ref2.additionalPadding;
-      if (sticky) {
-        return _react.default.createElement(_Sticky.Sticky, { side: "top" }, renderContent(close, additionalPadding));
-      }
+    renderContent())));
 
-      return renderContent(close, additionalPadding)();
-    })));
 
 
 

package/cjs/components/Modal/ModalHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ModalHeader.tsx"],"names":["ModalHeader","sticky","children","theme","ThemeContext","renderContent","close","additionalPadding","fixed","jsStyles","header","fixedHeader","headerAddPadding","Boolean","absoluteClose","requestClose","disableClose","position","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"qPAAA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;;;;;AAMA;;;;;AAKA,SAASA,WAAT,OAAoE,wBAA7CC,MAA6C,CAA7CA,MAA6C,4BAApC,IAAoC,eAA9BC,QAA8B,QAA9BA,QAA8B;AAClE,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAqBC,iBAArB,UAAqD,UAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AAC5F;AACE;AACE,UAAA,SAAS,EAAE;AACRC,0BAASC,MAAT,EADQ,IACY,IADZ;AAERD,0BAASE,WAAT,CAAqBR,KAArB,CAFQ,IAEsBK,KAFtB;AAGRC,0BAASG,gBAAT,EAHQ,IAGsBC,OAAO,CAACN,iBAAD,CAH7B,OADb;;;AAOGD,QAAAA,KAAK;AACJ,8CAAK,SAAS,EAAEG,gBAASK,aAAT,EAAhB;AACE,qCAAC,sBAAD,IAAY,YAAY,EAAER,KAAK,CAACS,YAAhC,EAA8C,YAAY,EAAET,KAAK,CAACU,YAAlE,GADF,CARJ;;;AAYGd,QAAAA,QAZH,CADF;;;AAgBD,KAjBqB,EAAtB;;AAmBA;AACE,iCAAC,cAAD,IAAQ,KAAK,EAAE,EAAEe,QAAQ,EAAE,UAAZ,EAAf,EAAyC,QAAQ,EAAE,aAAnD;AACE,iCAAC,0BAAD,CAAc,QAAd;AACG,qBAAkC,KAA/BX,KAA+B,SAA/BA,KAA+B,CAAxBC,iBAAwB,SAAxBA,iBAAwB;AACjC,UAAIN,MAAJ,EAAY;AACV,eAAO,6BAAC,cAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBI,aAAa,CAACC,KAAD,EAAQC,iBAAR,CAAjC,CAAP;AACD;;AAED,aAAOF,aAAa,CAACC,KAAD,EAAQC,iBAAR,CAAb,EAAP;AACD,KAPH,CADF,CADF;;;;AAaD;;AAEDP,WAAW,CAACkB,mBAAZ,GAAkC,aAAlC;AACAlB,WAAW,CAACmB,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext } from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport { Sticky } from '../Sticky';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { ZIndex } from '../../internal/ZIndex';\r\n\r\nimport { jsStyles } from './Modal.styles';\r\nimport { ModalClose } from './ModalClose';\r\nimport { CloseProps, ModalContext } from './ModalContext';\r\n\r\nexport interface ModalHeaderProps {\r\n  sticky?: boolean;\r\n  children?: ReactNode;\r\n}\r\n/**\r\n * Шапка модального окна\r\n *\r\n * @visibleName Modal.Header\r\n */\r\nfunction ModalHeader({ sticky = true, children }: ModalHeaderProps) {\r\n  const theme = useContext(ThemeContext);\r\n\r\n  const renderContent = (close?: CloseProps, additionalPadding?: boolean) => (fixed = false) => {\r\n    return (\r\n      <div\r\n        className={cn({\r\n          [jsStyles.header()]: true,\r\n          [jsStyles.fixedHeader(theme)]: fixed,\r\n          [jsStyles.headerAddPadding()]: Boolean(additionalPadding),\r\n        })}\r\n      >\r\n        {close && (\r\n          <div className={jsStyles.absoluteClose()}>\r\n            <ModalClose requestClose={close.requestClose} disableClose={close.disableClose} />\r\n          </div>\r\n        )}\r\n        {children}\r\n      </div>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <ZIndex style={{ position: 'relative' }} priority={'ModalHeader'}>\r\n      <ModalContext.Consumer>\r\n        {({ close, additionalPadding }) => {\r\n          if (sticky) {\r\n            return <Sticky side=\"top\">{renderContent(close, additionalPadding)}</Sticky>;\r\n          }\r\n\r\n          return renderContent(close, additionalPadding)();\r\n        }}\r\n      </ModalContext.Consumer>\r\n    </ZIndex>\r\n  );\r\n}\r\n\r\nModalHeader.__KONTUR_REACT_UI__ = 'ModalHeader';\r\nModalHeader.__MODAL_HEADER__ = true;\r\n\r\nexport { ModalHeader };\r\n"]}
+{"version":3,"sources":["ModalHeader.tsx"],"names":["ModalHeaderDataTids","root","ModalHeader","props","isFixed","setIsFixed","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","children","setHasHeader","renderContent","fixed","styles","header","mobileHeader","headerAddPadding","Boolean","additionalPadding","fixedHeader","mobileFixedHeader","headerWithClose","close","mobileHeaderWithClose","requestClose","disableClose","undefined","headerWrapper","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,8C;;;;;;;AAOO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,kBAA8B,qBAAS,KAAT,CAA9B,CAAOC,OAAP,gBAAgBC,UAAhB;;AAEA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAgDP,KAAhD,CAAQQ,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,QAAnC,GAAgDV,KAAhD,CAAmCU,QAAnC;;AAEA,8BAAgB,YAAM;AACpBL,IAAAA,KAAK,CAACM,YAAN,oBAAAN,KAAK,CAACM,YAAN;;AAEA,WAAO,oBAAMN,KAAK,CAACM,YAAZ,oBAAMN,KAAK,CAACM,YAAN,CAAqB,KAArB,CAAN,EAAP;AACD,GAJD,EAIG,EAJH;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE,oBAAUhB,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACRgB,sBAAOC,MAAP,CAAcZ,KAAd,CADQ,IACe,IADf;AAERW,sBAAOE,YAAP,CAAoBb,KAApB,CAFQ,IAEqBI,MAAM,CAACE,QAF5B;AAGRK,sBAAOG,gBAAP,EAHQ,IAGoBC,OAAO,CAACb,KAAK,CAACc,iBAAP,CAH3B;AAIRL,sBAAOM,WAAP,CAAmBjB,KAAnB,CAJQ,IAIoBU,KAJpB;AAKRC,sBAAOO,iBAAP,CAAyBlB,KAAzB,CALQ,IAK0BU,KAAK,IAAIN,MAAM,CAACE,QAL1C;AAMRK,sBAAOQ,eAAP,CAAuBnB,KAAvB,CANQ,IAMwBe,OAAO,CAACb,KAAK,CAACkB,KAAP,CAN/B;AAORT,sBAAOU,qBAAP,CAA6BrB,KAA7B,CAPQ,IAO8BI,MAAM,CAACE,QAPrC,OAFb;;;AAYGJ,MAAAA,KAAK,CAACkB,KAAN,iBAAe,6BAAC,sBAAD,IAAY,YAAY,EAAElB,KAAK,CAACkB,KAAN,CAAYE,YAAtC,EAAoD,YAAY,EAAEpB,KAAK,CAACkB,KAAN,CAAYG,YAA9E,GAZlB;AAaGhB,MAAAA,QAbH,CADF;;;AAiBD,GAlBD;;AAoBA;AACE,iCAAC,4BAAD,EAAmBV,KAAnB;AACE,iCAAC,cAAD,IAAQ,QAAQ,EAAEC,OAAO,GAAG,kBAAH,GAAwB0B,SAAjD,EAA4D,SAAS,EAAEb,cAAOc,aAAP,EAAvE;AACGpB,IAAAA,MAAM;AACL,iCAAC,cAAD,IAAQ,UAAU,EAAEN,UAApB,EAAgC,IAAI,EAAC,KAArC;AACGU,IAAAA,aADH,CADK;;;AAKLA,IAAAA,aAAa,EANjB,CADF,CADF;;;;;AAaD;;AAEDb,WAAW,CAAC8B,mBAAZ,GAAkC,aAAlC;AACA9B,WAAW,CAAC+B,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect, useState } from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\n\nimport { styles } from './Modal.styles';\nimport { ModalClose } from './ModalClose';\nimport { ModalContext } from './ModalContext';\n\nexport interface ModalHeaderProps extends CommonProps {\n  sticky?: boolean;\n  children?: ReactNode;\n}\n\nexport const ModalHeaderDataTids = {\n  root: 'ModalHeader__root',\n} as const;\n\n/**\n * Шапка модального окна\n *\n * @visibleName Modal.Header\n */\nfunction ModalHeader(props: ModalHeaderProps) {\n  const [isFixed, setIsFixed] = useState(false);\n\n  const theme = useContext(ThemeContext);\n  const modal = useContext(ModalContext);\n  const layout = useResponsiveLayout();\n\n  const { sticky = !layout.isMobile, children } = props;\n\n  useLayoutEffect(() => {\n    modal.setHasHeader?.();\n\n    return () => modal.setHasHeader?.(false);\n  }, []);\n\n  const renderContent = (fixed = false) => {\n    return (\n      <div\n        data-tid={ModalHeaderDataTids.root}\n        className={cx({\n          [styles.header(theme)]: true,\n          [styles.mobileHeader(theme)]: layout.isMobile,\n          [styles.headerAddPadding()]: Boolean(modal.additionalPadding),\n          [styles.fixedHeader(theme)]: fixed,\n          [styles.mobileFixedHeader(theme)]: fixed && layout.isMobile,\n          [styles.headerWithClose(theme)]: Boolean(modal.close),\n          [styles.mobileHeaderWithClose(theme)]: layout.isMobile,\n        })}\n      >\n        {modal.close && <ModalClose requestClose={modal.close.requestClose} disableClose={modal.close.disableClose} />}\n        {children}\n      </div>\n    );\n  };\n\n  return (\n    <CommonWrapper {...props}>\n      <ZIndex priority={isFixed ? 'ModalFixedHeader' : undefined} className={styles.headerWrapper()}>\n        {sticky ? (\n          <Sticky getIsFixed={setIsFixed} side=\"top\">\n            {renderContent}\n          </Sticky>\n        ) : (\n          renderContent()\n        )}\n      </ZIndex>\n    </CommonWrapper>\n  );\n}\n\nModalHeader.__KONTUR_REACT_UI__ = 'ModalHeader';\nModalHeader.__MODAL_HEADER__ = true;\n\nexport { ModalHeader };\n"]}

package/cjs/components/Modal/index.js

@@ -1,4 +1,4 @@
-"use strict";exports.__esModule = true;var _Modal = require("./Modal");Object.keys(_Modal).forEach(function (key) {if (key === "default" || key === "__esModule") return;exports[key] = _Modal[key];});
-var _ModalHeader = require("./ModalHeader");Object.keys(_ModalHeader).forEach(function (key) {if (key === "default" || key === "__esModule") return;exports[key] = _ModalHeader[key];});
-var _ModalBody = require("./ModalBody");Object.keys(_ModalBody).forEach(function (key) {if (key === "default" || key === "__esModule") return;exports[key] = _ModalBody[key];});
-var _ModalFooter = require("./ModalFooter");Object.keys(_ModalFooter).forEach(function (key) {if (key === "default" || key === "__esModule") return;exports[key] = _ModalFooter[key];});
+"use strict";exports.__esModule = true;var _Modal = require("./Modal");Object.keys(_Modal).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Modal[key]) return;exports[key] = _Modal[key];});
+var _ModalHeader = require("./ModalHeader");Object.keys(_ModalHeader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _ModalHeader[key]) return;exports[key] = _ModalHeader[key];});
+var _ModalBody = require("./ModalBody");Object.keys(_ModalBody).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _ModalBody[key]) return;exports[key] = _ModalBody[key];});
+var _ModalFooter = require("./ModalFooter");Object.keys(_ModalFooter).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _ModalFooter[key]) return;exports[key] = _ModalFooter[key];});

package/cjs/components/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA;AACA;AACA;AACA","sourcesContent":["export * from './Modal';\r\nexport * from './ModalHeader';\r\nexport * from './ModalBody';\r\nexport * from './ModalFooter';\r\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA;AACA;AACA;AACA","sourcesContent":["export * from './Modal';\nexport * from './ModalHeader';\nexport * from './ModalBody';\nexport * from './ModalFooter';\n"]}

package/cjs/components/Paging/NavigationHelper.d.ts

@@ -4,4 +4,4 @@ export interface KeyDescriptionType {
     checkPressed: (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => boolean;
 }
 export declare const getKeyName: () => string;
-export declare const checkKeyPressed: (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => boolean;
+export declare const checkKeyPressed: (event: KeyboardEvent | React.KeyboardEvent<HTMLElement>) => boolean;

package/cjs/components/Paging/NavigationHelper.js

@@ -1,4 +1,4 @@
-"use strict";exports.__esModule = true;exports.checkKeyPressed = exports.getKeyName = void 0;
+"use strict";exports.__esModule = true;exports.getKeyName = exports.checkKeyPressed = void 0;
 
 
 
@@ -23,4 +23,5 @@ var createKeyDescription = function createKeyDescription() {return (
 
 
 var getKeyName = function getKeyName() {return getKeyDescription().name;};exports.getKeyName = getKeyName;
-var checkKeyPressed = function checkKeyPressed(event) {return getKeyDescription().checkPressed(event);};exports.checkKeyPressed = checkKeyPressed;
+var checkKeyPressed = function checkKeyPressed(event) {return (
+    getKeyDescription().checkPressed(event));};exports.checkKeyPressed = checkKeyPressed;

package/cjs/components/Paging/NavigationHelper.js.map

@@ -1 +1 @@
-{"version":3,"sources":["NavigationHelper.tsx"],"names":["keyDescription","getKeyDescription","createKeyDescription","navigator","platform","includes","name","checkPressed","event","altKey","ctrlKey","getKeyName","checkKeyPressed"],"mappings":";;;;;;;;;AASA,IAAIA,cAA4C,GAAG,IAAnD;;AAEA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,WAAMD,cAAc,KAAKA,cAAc,GAAGE,oBAAoB,EAA1C,CAApB,EAA1B;;AAEA,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAuB;AAC3BC,IAAAA,SAAS,CAACC,QAAV,CAAmBC,QAAnB,CAA4B,KAA5B;AACI;AACEC,MAAAA,IAAI,EAAE,KADR;AAEEC,MAAAA,YAAY,EAAE,sBAACC,KAAD,UAA6DA,KAAK,CAACC,MAAnE,EAFhB,EADJ;;AAKI;AACEH,MAAAA,IAAI,EAAE,MADR;AAEEC,MAAAA,YAAY,EAAE,sBAACC,KAAD,UAA6DA,KAAK,CAACE,OAAnE,EAFhB,EANuB,GAA7B;;;AAWO,IAAMC,UAAU,GAAG,SAAbA,UAAa,WAAMV,iBAAiB,GAAGK,IAA1B,EAAnB,C;AACA,IAAMM,eAAe,GAAG,SAAlBA,eAAkB,CAACJ,KAAD,UAA6DP,iBAAiB,GAAGM,YAApB,CAAiCC,KAAjC,CAA7D,EAAxB,C","sourcesContent":["import React from 'react';\r\n\r\nimport { Nullable } from '../../typings/utility-types';\r\n\r\nexport interface KeyDescriptionType {\r\n  name: string;\r\n  checkPressed: (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => boolean;\r\n}\r\n\r\nlet keyDescription: Nullable<KeyDescriptionType> = null;\r\n\r\nconst getKeyDescription = () => keyDescription || (keyDescription = createKeyDescription());\r\n\r\nconst createKeyDescription = () =>\r\n  navigator.platform.includes('Mac')\r\n    ? {\r\n        name: 'Alt',\r\n        checkPressed: (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => event.altKey,\r\n      }\r\n    : {\r\n        name: 'Ctrl',\r\n        checkPressed: (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => event.ctrlKey,\r\n      };\r\n\r\nexport const getKeyName = () => getKeyDescription().name;\r\nexport const checkKeyPressed = (event: KeyboardEvent | React.KeyboardEvent<HTMLElement>) => getKeyDescription().checkPressed(event);\r\n"]}
+{"version":3,"sources":["NavigationHelper.tsx"],"names":["keyDescription","getKeyDescription","createKeyDescription","navigator","platform","includes","name","checkPressed","event","altKey","ctrlKey","getKeyName","checkKeyPressed"],"mappings":";;;;;;;;;AASA,IAAIA,cAA4C,GAAG,IAAnD;;AAEA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,WAAMD,cAAc,KAAKA,cAAc,GAAGE,oBAAoB,EAA1C,CAApB,EAA1B;;AAEA,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAuB;AAC3BC,IAAAA,SAAS,CAACC,QAAV,CAAmBC,QAAnB,CAA4B,KAA5B;AACI;AACEC,MAAAA,IAAI,EAAE,KADR;AAEEC,MAAAA,YAAY,EAAE,sBAACC,KAAD,UAA6DA,KAAK,CAACC,MAAnE,EAFhB,EADJ;;AAKI;AACEH,MAAAA,IAAI,EAAE,MADR;AAEEC,MAAAA,YAAY,EAAE,sBAACC,KAAD,UAA6DA,KAAK,CAACE,OAAnE,EAFhB,EANuB,GAA7B;;;AAWO,IAAMC,UAAU,GAAG,SAAbA,UAAa,WAAMV,iBAAiB,GAAGK,IAA1B,EAAnB,C;AACA,IAAMM,eAAe,GAAG,SAAlBA,eAAkB,CAACJ,KAAD;AAC7BP,IAAAA,iBAAiB,GAAGM,YAApB,CAAiCC,KAAjC,CAD6B,GAAxB,C","sourcesContent":["import React from 'react';\n\nimport { Nullable } from '../../typings/utility-types';\n\nexport interface KeyDescriptionType {\n  name: string;\n  checkPressed: (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => boolean;\n}\n\nlet keyDescription: Nullable<KeyDescriptionType> = null;\n\nconst getKeyDescription = () => keyDescription || (keyDescription = createKeyDescription());\n\nconst createKeyDescription = () =>\n  navigator.platform.includes('Mac')\n    ? {\n        name: 'Alt',\n        checkPressed: (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => event.altKey,\n      }\n    : {\n        name: 'Ctrl',\n        checkPressed: (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => event.ctrlKey,\n      };\n\nexport const getKeyName = () => getKeyDescription().name;\nexport const checkKeyPressed = (event: KeyboardEvent | React.KeyboardEvent<HTMLElement>) =>\n  getKeyDescription().checkPressed(event);\n"]}

package/cjs/components/Paging/Paging.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Nullable } from '../../typings/utility-types';
-interface ItemComponentProps {
+import { CommonProps } from '../../internal/CommonWrapper';
+export interface ItemComponentProps {
     active: boolean;
     children?: React.ReactNode;
     className: string;
@@ -8,13 +9,13 @@ interface ItemComponentProps {
     pageNumber: number | 'forward';
     tabIndex: number;
 }
-export interface PagingProps {
+export interface PagingProps extends CommonProps {
     activePage: number;
     /**
      * Компонент обертки по умолчанию
      * @default <span />
      */
-    component: React.ComponentType<ItemComponentProps>;
+    component?: React.ComponentType<ItemComponentProps>;
     onPageChange: (pageNumber: number) => void;
     pagesCount: number;
     disabled?: boolean;
@@ -31,7 +32,16 @@ export interface PagingProps {
      * **Paging** с useGlobalListener === true, то обработчик keyDown будет вызываться
      * на каждом из них. Такие случаи лучше обрабатывать отдельно.
      */
-    useGlobalListener: boolean;
+    useGlobalListener?: boolean;
+    /**
+     * Определяет, нужно ли показывать `Paging` когда страница всего одна.
+     *
+     * Этот проп будет удалён в 5-ой версии библиотеки,
+     * так как поведение со скрытием `Paging`'а станет поведением по умолчанию.
+     *
+     * @default false
+     */
+    shouldBeVisibleWithLessThanTwoPages?: boolean;
 }
 export interface PagingState {
     focusedByTab: boolean;
@@ -39,13 +49,20 @@ export interface PagingState {
     keyboardControl: boolean;
 }
 export declare type ItemType = number | '.' | 'forward';
-export declare class Paging extends React.Component<PagingProps, PagingState> {
+export declare const PagingDataTids: {
+    readonly root: "Paging__root";
+    readonly dots: "Paging__dots";
+    readonly forwardLink: "Paging__forwardLink";
+    readonly pageLinkWrapper: "Paging__pageLinkWrapper";
+    readonly pageLink: "Paging__pageLink";
+};
+declare type DefaultProps = Required<Pick<PagingProps, 'component' | 'shouldBeVisibleWithLessThanTwoPages' | 'useGlobalListener' | 'data-tid'>>;
+export declare class Paging extends React.PureComponent<PagingProps, PagingState> {
     static __KONTUR_REACT_UI__: string;
-    static defaultProps: {
-        component: ({ className, onClick, children }: any) => JSX.Element;
-        useGlobalListener: boolean;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     static propTypes: {};
+    private setRootNode;
     static isForward(pageNumber: number | 'forward'): boolean;
     state: PagingState;
     private theme;
@@ -53,10 +70,9 @@ export declare class Paging extends React.Component<PagingProps, PagingState> {
     private addedGlobalListener;
     private container;
     componentDidMount(): void;
-    UNSAFE_componentWillReceiveProps(nextProps: PagingProps): void;
     componentDidUpdate(prevProps: PagingProps): void;
     componentWillUnmount(): void;
-    render(): JSX.Element;
+    render(): JSX.Element | null;
     private renderMain;
     private renderItem;
     private renderDots;

package/cjs/components/Paging/Paging.js

@@ -1,22 +1,27 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");exports.__esModule = true;exports.Paging = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.PagingDataTids = exports.Paging = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _propTypes = require("prop-types");
-var _classnames = _interopRequireDefault(require("classnames"));
 
 var _identifiers = require("../../lib/events/keyboard/identifiers");
 var _decorators = require("../../lib/locale/decorators");
 
-var _tabListener = require("../../lib/events/tabListener");
+var _keyListener = require("../../lib/events/keyListener");
 var _utils = require("../../lib/utils");
+var _client = require("../../lib/client");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _px = require("../../internal/icons/16px");
+var _CommonWrapper = require("../../internal/CommonWrapper");
+var _Emotion = require("../../lib/theming/Emotion");
+var _rootNode = require("../../lib/rootNode");
+var _createPropsGetter = require("../../lib/createPropsGetter");
 
 var _Paging = require("./Paging.styles");
 var NavigationHelper = _interopRequireWildcard(require("./NavigationHelper"));
 var _PagingHelper = require("./PagingHelper");
-var _locale = require("./locale");var _dec, _class, _class2, _temp;
+var _locale = require("./locale");
+var _PagingDefaultComponent = require("./PagingDefaultComponent");var _dec, _class, _class2, _temp;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
-var IGNORE_EVENT_TAGS = ['input', 'textarea'];var
+var IGNORE_EVENT_TAGS = ['input', 'textarea'];
 
 
 
@@ -62,7 +67,6 @@ var IGNORE_EVENT_TAGS = ['input', 'textarea'];var
 
 
 
-Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Paging, _React$Component);function Paging() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
 
 
 
@@ -71,6 +75,12 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
 
 
+var PagingDataTids = {
+  root: 'Paging__root',
+  dots: 'Paging__dots',
+  forwardLink: 'Paging__forwardLink',
+  pageLinkWrapper: 'Paging__pageLinkWrapper',
+  pageLink: 'Paging__pageLink' };exports.PagingDataTids = PagingDataTids;var
 
 
 
@@ -79,15 +89,33 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
 
 
+Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper), (0, _rootNode.rootNode)(_class = _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsLoose2.default)(Paging, _React$PureComponent);function Paging() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;_this.
+
+
+
+
+
+
+
+
+
+    getProps = (0, _createPropsGetter.createPropsGetter)(Paging.defaultProps);_this.
+
+
+
+
+
+
+
 
     state = {
       focusedByTab: false,
       focusedItem: null,
-      keyboardControl: _this.props.useGlobalListener };_this.
+      keyboardControl: _this.getProps().useGlobalListener };_this.
+
+
 
 
-    theme = void 0;_this.
-    locale = void 0;_this.
     addedGlobalListener = false;_this.
     container = null;_this.
 
@@ -141,6 +169,12 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
 
 
+
+
+
+
+
+
 
 
 
@@ -166,59 +200,65 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
     };_this.
 
-    renderDots = function (key) {
-      return (
-        _react.default.createElement("span", { "data-tid": "Paging__dots", key: key, className: _Paging.jsStyles.dots(_this.theme) },
+    renderDots = function (key) {var _cx;
+      return /*#__PURE__*/(
+        _react.default.createElement("span", {
+          "data-tid": PagingDataTids.dots,
+          key: key,
+          className: (0, _Emotion.cx)((_cx = {}, _cx[_Paging.styles.dots(_this.theme)] = true, _cx[_Paging.styles.dotsDisabled(_this.theme)] = _this.props.disabled, _cx)) },
+
         '...'));
 
 
     };_this.
 
-    renderForwardLink = function (disabled, focused) {var _cn;
-      var classes = (0, _classnames.default)((_cn = {}, _cn[
-      _Paging.jsStyles.forwardLink(_this.theme)] = true, _cn[
-      _Paging.jsStyles.forwardLinkFocused()] = focused, _cn[
-      _Paging.jsStyles.disabled(_this.theme)] = disabled, _cn));var _this$props =
+    renderForwardLink = function (disabled, focused) {var _cx2;
+      var classes = (0, _Emotion.cx)((_cx2 = {}, _cx2[
+      _Paging.styles.forwardLink(_this.theme)] = true, _cx2[
+      _Paging.styles.forwardLinkFocused()] = focused, _cx2[
+      _Paging.styles.forwardLinkDisabled(_this.theme)] = disabled || _this.props.disabled, _cx2));
 
-      _this.props,Component = _this$props.component,caption = _this$props.caption;var
-      forward = _this.locale.forward;
+      var Component = _this.getProps().component;
+      var forward = _this.locale.forward;
 
-      return (
+      return /*#__PURE__*/(
         _react.default.createElement(Component, {
           key: 'forward',
-          "data-tid": "Paging__forwardLink",
+          "data-tid": PagingDataTids.forwardLink,
           active: false,
           className: classes,
           onClick: disabled ? _utils.emptyHandler : _this.goForward,
           tabIndex: -1,
           pageNumber: 'forward' },
 
-        caption || forward,
-        _react.default.createElement("span", { className: _Paging.jsStyles.forwardIcon() },
-        _react.default.createElement(_px.ArrowChevronRightIcon, { size: "18px" }))));
+        _this.props.caption || forward, /*#__PURE__*/
+        _react.default.createElement("span", { className: _Paging.styles.forwardIcon(_this.theme) }, /*#__PURE__*/
+        _react.default.createElement(_px.ArrowChevronRightIcon, { size: _this.theme.pagingForwardIconSize }))));
 
 
 
     };_this.
 
-    renderPageLink = function (pageNumber, active, focused) {var _cn2;
-      var classes = (0, _classnames.default)((_cn2 = {}, _cn2[
-      _Paging.jsStyles.pageLink(_this.theme)] = true, _cn2[
-      _Paging.jsStyles.pageLinkFocused(_this.theme)] = focused, _cn2[
-      _Paging.jsStyles.active()] = active, _cn2));
+    renderPageLink = function (pageNumber, active, focused) {var _cx3;
+      var classes = (0, _Emotion.cx)((_cx3 = {}, _cx3[
+      _Paging.styles.pageLink(_this.theme)] = true, _cx3[
+      _Paging.styles.pageLinkFocused(_this.theme)] = focused, _cx3[
+      _Paging.styles.pageLinkDisabled(_this.theme)] = _this.props.disabled, _cx3[
+      _Paging.styles.pageLinkCurrent(_this.theme)] = active, _cx3[
+      _Paging.styles.pageLinkCurrentDisabled(_this.theme)] = active && _this.props.disabled, _cx3));
 
-      var Component = _this.props.component;
+      var Component = _this.getProps().component;
       var handleClick = function handleClick() {return _this.goToPage(pageNumber);};
 
-      return (
+      return /*#__PURE__*/(
         _react.default.createElement("span", {
-          "data-tid": "Paging__pageLinkWrapper",
+          "data-tid": PagingDataTids.pageLinkWrapper,
           key: pageNumber,
-          className: _Paging.jsStyles.pageLinkWrapper(),
-          onMouseDown: _this.handleMouseDownPageLink },
+          className: _Paging.styles.pageLinkWrapper(),
+          onMouseDown: _this.handleMouseDownPageLink }, /*#__PURE__*/
 
         _react.default.createElement(Component, {
-          "data-tid": "Paging__pageLink",
+          "data-tid": PagingDataTids.pageLink,
           active: active,
           className: classes,
           onClick: handleClick,
@@ -235,23 +275,23 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
     renderNavigationHint = function () {
       if (_this.props.withoutNavigationHint) {
         return null;
-      }var
+      }
 
-      keyboardControl = _this.state.keyboardControl;
+      var keyboardControl = _this.state.keyboardControl;
       var canGoBackward = _this.canGoBackward();
       var canGoForward = _this.canGoForward();
 
       if (keyboardControl && (canGoBackward || canGoForward)) {
-        return (
-          _react.default.createElement("span", { className: _Paging.jsStyles.pageLinkHint(_this.theme) },
-          _react.default.createElement("span", { className: canGoBackward ? '' : _Paging.jsStyles.transparent() }, '←'),
-          _react.default.createElement("span", null, NavigationHelper.getKeyName()),
-          _react.default.createElement("span", { className: canGoForward ? '' : _Paging.jsStyles.transparent() }, '→')));
+        return /*#__PURE__*/(
+          _react.default.createElement("span", { className: _Paging.styles.pageLinkHint(_this.theme) }, /*#__PURE__*/
+          _react.default.createElement("span", { className: canGoBackward ? '' : _Paging.styles.transparent() }, '←'), /*#__PURE__*/
+          _react.default.createElement("span", null, NavigationHelper.getKeyName()), /*#__PURE__*/
+          _react.default.createElement("span", { className: canGoForward ? '' : _Paging.styles.transparent() }, '→')));
 
 
       }
 
-      return _react.default.createElement("div", { className: _Paging.jsStyles.pageLinkHintPlaceHolder() });
+      return /*#__PURE__*/_react.default.createElement("div", { className: _Paging.styles.pageLinkHintPlaceHolder(_this.theme) });
     };_this.
 
     handleMouseDown = function () {
@@ -259,7 +299,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
     };_this.
 
     handleMouseDownPageLink = function () {
-      if (_utils.isIE11) {
+      if (_client.isIE11) {
         // Клик по span внутри контейнера с tabindex="0" переносит фокус именно на этот span.
         // Поэтому горячие клавиши работают пока span существует на странице.
         setTimeout(function () {return _this.container && _this.container.focus();}, 0);
@@ -308,7 +348,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
       }
     };_this.
 
-    handleFocus = function (e) {
+    handleFocus = function () {
       if (_this.props.disabled) {
         return;
       }
@@ -317,8 +357,8 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
       // focus event fires before keyDown eventlistener
       // so we should check tabPressed in async way
-      process.nextTick(function () {
-        if (_tabListener.tabListener.isTabPressed) {
+      requestAnimationFrame(function () {
+        if (_keyListener.keyListener.isTabPressed) {
           _this.setState({ focusedByTab: true });
         }
       });
@@ -327,7 +367,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
     handleBlur = function () {
       _this.setState({
         focusedByTab: false,
-        keyboardControl: _this.props.useGlobalListener || false });
+        keyboardControl: _this.getProps().useGlobalListener || false });
 
     };_this.
 
@@ -338,9 +378,9 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
     getFocusedItem = function () {
       if (!_this.state.focusedByTab) {
         return null;
-      }var
+      }
 
-      focusedItem = _this.state.focusedItem;
+      var focusedItem = _this.state.focusedItem;
       if (focusedItem && _this.getItems().includes(focusedItem) && _this.isItemFocusable(focusedItem)) {
         return focusedItem;
       }
@@ -407,7 +447,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
     };_this.
 
     goToPage = function (pageNumber) {
-      if (1 <= pageNumber && pageNumber !== _this.props.activePage && pageNumber <= _this.props.pagesCount) {
+      if (pageNumber >= 1 && pageNumber !== _this.props.activePage && pageNumber <= _this.props.pagesCount) {
         _this.props.onPageChange(pageNumber);
       }
     };_this.
@@ -431,28 +471,28 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
     refContainer = function (element) {
       _this.container = element;
-    };return _this;}Paging.isForward = function isForward(pageNumber) /* %checks */{return pageNumber === 'forward';};var _proto = Paging.prototype;_proto.componentDidMount = function componentDidMount() {var useGlobalListener = this.props.useGlobalListener;if (useGlobalListener) {this.addGlobalListener();}};_proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {if (this.props.useGlobalListener !== nextProps.useGlobalListener) {this.setState({ keyboardControl: nextProps.useGlobalListener });}};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (!prevProps.useGlobalListener && this.props.useGlobalListener) {this.addGlobalListener();}if (prevProps.useGlobalListener && !this.props.useGlobalListener) {this.removeGlobalListener();}};_proto.componentWillUnmount = function componentWillUnmount() {this.removeGlobalListener();};_proto.render = function render() {var _this2 = this;return _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {return _react.default.createElement("span", { tabIndex: 0, "data-tid": "Paging__root", className: _Paging.jsStyles.paging(), onKeyDown: this.props.useGlobalListener ? undefined : this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseDown: this.handleMouseDown, ref: this.refContainer }, this.getItems().map(this.renderItem));};return Paging;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Paging', _class2.defaultProps = { component: function component(_ref) {var className = _ref.className,onClick = _ref.onClick,children = _ref.children;return _react.default.createElement("span", { className: className, onClick: onClick }, children);}, useGlobalListener: false }, _class2.propTypes = {}, _temp)) || _class);exports.Paging = Paging;
+    };return _this;}Paging.isForward = function isForward(pageNumber) /* %checks */{return pageNumber === 'forward';};var _proto = Paging.prototype;_proto.componentDidMount = function componentDidMount() {var useGlobalListener = this.getProps().useGlobalListener;if (useGlobalListener) {this.addGlobalListener();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var useGlobalListener = this.getProps().useGlobalListener;if (!prevProps.useGlobalListener && useGlobalListener) {this.addGlobalListener();}if (prevProps.useGlobalListener && !useGlobalListener) {this.removeGlobalListener();}if (prevProps.useGlobalListener !== useGlobalListener) {this.setState({ keyboardControl: useGlobalListener });}};_proto.componentWillUnmount = function componentWillUnmount() {this.removeGlobalListener();};_proto.render = function render() {var _this2 = this;if (this.props.pagesCount < 2 && !this.getProps().shouldBeVisibleWithLessThanTwoPages) {return null;}return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cx4;var _this$getProps = this.getProps(),dataTid = _this$getProps['data-tid'],useGlobalListener = _this$getProps.useGlobalListener;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("span", { tabIndex: this.props.disabled ? -1 : 0, "data-tid": dataTid, className: (0, _Emotion.cx)((_cx4 = {}, _cx4[_Paging.styles.paging(this.theme)] = true, _cx4[_Paging.styles.pagingDisabled()] = this.props.disabled, _cx4)), onKeyDown: useGlobalListener ? undefined : this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseDown: this.handleMouseDown, ref: this.refContainer }, this.getItems().map(this.renderItem)));};return Paging;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Paging', _class2.defaultProps = { component: _PagingDefaultComponent.PagingDefaultComponent, shouldBeVisibleWithLessThanTwoPages: true, useGlobalListener: false, 'data-tid': PagingDataTids.root }, _class2.propTypes = {}, _temp)) || _class) || _class);exports.Paging = Paging;
 
 
 Paging.propTypes = {
-  /**
-                      * Current active page
-                      */
+  /**
+   * Current active page
+   */
   activePage: _propTypes.number.isRequired,
 
-  /**
-                                             * React component that would be used for rendering items
-                                             *
-                                             * Usefull for router integration
-                                             */
+  /**
+   * React component that would be used for rendering items
+   *
+   * Usefull for router integration
+   */
   component: _propTypes.func,
 
-  /**
-                               * Total page count
-                               */
+  /**
+   * Total page count
+   */
   pagesCount: _propTypes.number.isRequired,
 
-  /**
-                                             * Calls when page has been changed
-                                             */
+  /**
+   * Calls when page has been changed
+   */
   onPageChange: _propTypes.func.isRequired };