@skbkontur/react-ui 0.0.0-aaf2aabecb → 0.0.0-bb4cbfe9c6

package/components/Modal/ModalHeader/ModalHeader.js

@@ -1,59 +1,54 @@
-import React, { useContext } from 'react';
-import cn from 'classnames';
-import { Sticky } from "..\\..\\Sticky";
-import { ThemeContext } from "..\\..\\..\\lib\\theming\\ThemeContext";
-import { ZIndex } from "..\\..\\..\\internal\\ZIndex";
-import { jsStyles } from "..\\Modal.styles";
-import { ModalClose } from "..\\ModalClose";
-import { ModalContext } from "..\\ModalContext";
-/**
-                                                * Шапка модального окна
-                                                *
-                                                * @visibleName Modal.Header
-                                                */
-
-function ModalHeader(_ref) {
-  var _ref$sticky = _ref.sticky,
-      sticky = _ref$sticky === void 0 ? true : _ref$sticky,
-      children = _ref.children;
+import React, { useContext, useEffect } from 'react';
+import { Sticky } from "../../Sticky";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { ZIndex } from "../../../internal/ZIndex";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { cx } from "../../../lib/theming/Emotion";
+import { useResponsiveLayout } from "../../ResponsiveLayout";
+import { styles } from "../Modal.styles";
+import { ModalClose } from "../ModalClose";
+import { ModalContext } from "../ModalContext";
+/**
+ * Шапка модального окна
+ *
+ * @visibleName Modal.Header
+ */
+
+function ModalHeader(props) {
   var theme = useContext(ThemeContext);
-
-  var renderContent = function renderContent(close, additionalPadding) {
-    return function (fixed) {
-      var _cn;
-
-      if (fixed === void 0) {
-        fixed = false;
-      }
-
-      return React.createElement("div", {
-        className: cn((_cn = {}, _cn[jsStyles.header()] = true, _cn[jsStyles.fixedHeader(theme)] = fixed, _cn[jsStyles.headerAddPadding()] = Boolean(additionalPadding), _cn))
-      }, close && React.createElement("div", {
-        className: jsStyles.absoluteClose()
-      }, React.createElement(ModalClose, {
-        requestClose: close.requestClose,
-        disableClose: close.disableClose
-      })), children);
+  var modal = useContext(ModalContext);
+  var layout = useResponsiveLayout();
+  var _props$sticky = props.sticky,
+      sticky = _props$sticky === void 0 ? layout.isMobile ? false : true : _props$sticky,
+      children = props.children;
+  useEffect(function () {
+    modal.setHasHeader == null ? void 0 : modal.setHasHeader();
+    return function () {
+      return modal.setHasHeader == null ? void 0 : modal.setHasHeader(false);
     };
-  };
+  }, []);
 
-  return React.createElement(ZIndex, {
-    style: {
-      position: 'relative'
-    },
-    priority: 'ModalHeader'
-  }, React.createElement(ModalContext.Consumer, null, function (_ref2) {
-    var close = _ref2.close,
-        additionalPadding = _ref2.additionalPadding;
+  var renderContent = function renderContent(fixed) {
+    var _cx;
 
-    if (sticky) {
-      return React.createElement(Sticky, {
-        side: "top"
-      }, renderContent(close, additionalPadding));
+    if (fixed === void 0) {
+      fixed = false;
     }
 
-    return renderContent(close, additionalPadding)();
-  }));
+    return /*#__PURE__*/React.createElement("div", {
+      className: cx((_cx = {}, _cx[styles.header(theme)] = true, _cx[styles.mobileHeader(theme)] = layout.isMobile, _cx[styles.headerAddPadding()] = Boolean(modal.additionalPadding), _cx[styles.fixedHeader(theme)] = fixed, _cx[styles.mobileFixedHeader(theme)] = fixed && layout.isMobile, _cx[styles.headerWithClose(theme)] = Boolean(modal.close), _cx[styles.mobileHeaderWithClose(theme)] = layout.isMobile, _cx))
+    }, modal.close && /*#__PURE__*/React.createElement(ModalClose, {
+      requestClose: modal.close.requestClose,
+      disableClose: modal.close.disableClose
+    }), children);
+  };
+
+  return /*#__PURE__*/React.createElement(CommonWrapper, props, /*#__PURE__*/React.createElement(ZIndex, {
+    priority: 'ModalHeader',
+    className: styles.headerWrapper()
+  }, sticky ? /*#__PURE__*/React.createElement(Sticky, {
+    side: "top"
+  }, renderContent) : renderContent()));
 }
 
 ModalHeader.__KONTUR_REACT_UI__ = 'ModalHeader';

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

@@ -1 +1 @@
-{"version":3,"sources":["ModalHeader.tsx"],"names":["React","useContext","cn","Sticky","ThemeContext","ZIndex","jsStyles","ModalClose","ModalContext","ModalHeader","sticky","children","theme","renderContent","close","additionalPadding","fixed","header","fixedHeader","headerAddPadding","Boolean","absoluteClose","requestClose","disableClose","position","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"AAAA,OAAOA,KAAP,IAA2BC,UAA3B,QAA6C,OAA7C;AACA,OAAOC,EAAP,MAAe,YAAf;;AAEA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,YAAT,QAA6B,gCAA7B;AACA,SAASC,MAAT,QAAuB,uBAAvB;;AAEA,SAASC,QAAT,QAAyB,gBAAzB;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,SAAqBC,YAArB,QAAyC,gBAAzC;;;;;;AAMA;;;;;AAKA,SAASC,WAAT,OAAoE,wBAA7CC,MAA6C,CAA7CA,MAA6C,4BAApC,IAAoC,eAA9BC,QAA8B,QAA9BA,QAA8B;AAClE,MAAMC,KAAK,GAAGX,UAAU,CAACG,YAAD,CAAxB;;AAEA,MAAMS,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAqBC,iBAArB,UAAqD,UAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AAC5F;AACE;AACE,UAAA,SAAS,EAAEd,EAAE;AACVI,UAAAA,QAAQ,CAACW,MAAT,EADU,IACU,IADV;AAEVX,UAAAA,QAAQ,CAACY,WAAT,CAAqBN,KAArB,CAFU,IAEoBI,KAFpB;AAGVV,UAAAA,QAAQ,CAACa,gBAAT,EAHU,IAGoBC,OAAO,CAACL,iBAAD,CAH3B,OADf;;;AAOGD,QAAAA,KAAK;AACJ,qCAAK,SAAS,EAAER,QAAQ,CAACe,aAAT,EAAhB;AACE,4BAAC,UAAD,IAAY,YAAY,EAAEP,KAAK,CAACQ,YAAhC,EAA8C,YAAY,EAAER,KAAK,CAACS,YAAlE,GADF,CARJ;;;AAYGZ,QAAAA,QAZH,CADF;;;AAgBD,KAjBqB,EAAtB;;AAmBA;AACE,wBAAC,MAAD,IAAQ,KAAK,EAAE,EAAEa,QAAQ,EAAE,UAAZ,EAAf,EAAyC,QAAQ,EAAE,aAAnD;AACE,wBAAC,YAAD,CAAc,QAAd;AACG,qBAAkC,KAA/BV,KAA+B,SAA/BA,KAA+B,CAAxBC,iBAAwB,SAAxBA,iBAAwB;AACjC,UAAIL,MAAJ,EAAY;AACV,eAAO,oBAAC,MAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBG,aAAa,CAACC,KAAD,EAAQC,iBAAR,CAAjC,CAAP;AACD;;AAED,aAAOF,aAAa,CAACC,KAAD,EAAQC,iBAAR,CAAb,EAAP;AACD,KAPH,CADF,CADF;;;;AAaD;;AAEDN,WAAW,CAACgB,mBAAZ,GAAkC,aAAlC;AACAhB,WAAW,CAACiB,gBAAZ,GAA+B,IAA/B;;AAEA,SAASjB,WAAT","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":["React","useContext","useEffect","Sticky","ThemeContext","ZIndex","CommonWrapper","cx","useResponsiveLayout","styles","ModalClose","ModalContext","ModalHeader","props","theme","modal","layout","sticky","isMobile","children","setHasHeader","renderContent","fixed","header","mobileHeader","headerAddPadding","Boolean","additionalPadding","fixedHeader","mobileFixedHeader","headerWithClose","close","mobileHeaderWithClose","requestClose","disableClose","headerWrapper","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"AAAA,OAAOA,KAAP,IAA2BC,UAA3B,EAAuCC,SAAvC,QAAwD,OAAxD;;AAEA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,YAAT,QAA6B,gCAA7B;AACA,SAASC,MAAT,QAAuB,uBAAvB;AACA,SAASC,aAAT,QAA2C,8BAA3C;AACA,SAASC,EAAT,QAAmB,2BAAnB;AACA,SAASC,mBAAT,QAAoC,qBAApC;;AAEA,SAASC,MAAT,QAAuB,gBAAvB;AACA,SAASC,UAAT,QAA2B,cAA3B;AACA,SAASC,YAAT,QAA6B,gBAA7B;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAGb,UAAU,CAACG,YAAD,CAAxB;AACA,MAAMW,KAAK,GAAGd,UAAU,CAACU,YAAD,CAAxB;AACA,MAAMK,MAAM,GAAGR,mBAAmB,EAAlC;;AAEA,sBAA8DK,KAA9D,CAAQI,MAAR,CAAQA,MAAR,8BAAiBD,MAAM,CAACE,QAAP,GAAkB,KAAlB,GAA0B,IAA3C,iBAAiDC,QAAjD,GAA8DN,KAA9D,CAAiDM,QAAjD;;AAEAjB,EAAAA,SAAS,CAAC,YAAM;AACda,IAAAA,KAAK,CAACK,YAAN,oBAAAL,KAAK,CAACK,YAAN;;AAEA,WAAO,oBAAML,KAAK,CAACK,YAAZ,oBAAML,KAAK,CAACK,YAAN,CAAqB,KAArB,CAAN,EAAP;AACD,GAJQ,EAIN,EAJM,CAAT;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE,QAAA,SAAS,EAAEf,EAAE;AACVE,QAAAA,MAAM,CAACc,MAAP,CAAcT,KAAd,CADU,IACa,IADb;AAEVL,QAAAA,MAAM,CAACe,YAAP,CAAoBV,KAApB,CAFU,IAEmBE,MAAM,CAACE,QAF1B;AAGVT,QAAAA,MAAM,CAACgB,gBAAP,EAHU,IAGkBC,OAAO,CAACX,KAAK,CAACY,iBAAP,CAHzB;AAIVlB,QAAAA,MAAM,CAACmB,WAAP,CAAmBd,KAAnB,CAJU,IAIkBQ,KAJlB;AAKVb,QAAAA,MAAM,CAACoB,iBAAP,CAAyBf,KAAzB,CALU,IAKwBQ,KAAK,IAAIN,MAAM,CAACE,QALxC;AAMVT,QAAAA,MAAM,CAACqB,eAAP,CAAuBhB,KAAvB,CANU,IAMsBY,OAAO,CAACX,KAAK,CAACgB,KAAP,CAN7B;AAOVtB,QAAAA,MAAM,CAACuB,qBAAP,CAA6BlB,KAA7B,CAPU,IAO4BE,MAAM,CAACE,QAPnC,OADf;;;AAWGH,MAAAA,KAAK,CAACgB,KAAN,iBAAe,oBAAC,UAAD,IAAY,YAAY,EAAEhB,KAAK,CAACgB,KAAN,CAAYE,YAAtC,EAAoD,YAAY,EAAElB,KAAK,CAACgB,KAAN,CAAYG,YAA9E,GAXlB;AAYGf,MAAAA,QAZH,CADF;;;AAgBD,GAjBD;;AAmBA;AACE,wBAAC,aAAD,EAAmBN,KAAnB;AACE,wBAAC,MAAD,IAAQ,QAAQ,EAAE,aAAlB,EAAiC,SAAS,EAAEJ,MAAM,CAAC0B,aAAP,EAA5C;AACGlB,IAAAA,MAAM,gBAAG,oBAAC,MAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBI,aAApB,CAAH,GAAiDA,aAAa,EADvE,CADF,CADF;;;;AAOD;;AAEDT,WAAW,CAACwB,mBAAZ,GAAkC,aAAlC;AACAxB,WAAW,CAACyB,gBAAZ,GAA+B,IAA/B;;AAEA,SAASzB,WAAT","sourcesContent":["import React, { ReactNode, useContext, useEffect } 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/**\n * Шапка модального окна\n *\n * @visibleName Modal.Header\n */\nfunction ModalHeader(props: ModalHeaderProps) {\n  const theme = useContext(ThemeContext);\n  const modal = useContext(ModalContext);\n  const layout = useResponsiveLayout();\n\n  const { sticky = layout.isMobile ? false : true, children } = props;\n\n  useEffect(() => {\n    modal.setHasHeader?.();\n\n    return () => modal.setHasHeader?.(false);\n  }, []);\n\n  const renderContent = (fixed = false) => {\n    return (\n      <div\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={'ModalHeader'} className={styles.headerWrapper()}>\n        {sticky ? <Sticky side=\"top\">{renderContent}</Sticky> : renderContent()}\n      </ZIndex>\n    </CommonWrapper>\n  );\n}\n\nModalHeader.__KONTUR_REACT_UI__ = 'ModalHeader';\nModalHeader.__MODAL_HEADER__ = true;\n\nexport { ModalHeader };\n"]}

package/components/Modal/ModalHeader/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\components\\Modal\\ModalHeader.js",
+  "main": "../../../cjs/components/Modal/ModalHeader.js",
   "module": "ModalHeader",
-  "types": "..\\ModalHeader.d.ts",
+  "types": "../ModalHeader.d.ts",
   "sideEffects": false
 }

package/components/Modal/ModalHeader.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
-export interface ModalHeaderProps {
+import { CommonProps } from '../../internal/CommonWrapper';
+export interface ModalHeaderProps extends CommonProps {
     sticky?: boolean;
     children?: ReactNode;
 }
@@ -8,7 +9,7 @@ export interface ModalHeaderProps {
  *
  * @visibleName Modal.Header
  */
-declare function ModalHeader({ sticky, children }: ModalHeaderProps): JSX.Element;
+declare function ModalHeader(props: ModalHeaderProps): JSX.Element;
 declare namespace ModalHeader {
     var __KONTUR_REACT_UI__: string;
     var __MODAL_HEADER__: boolean;

package/components/Modal/index/index.js

@@ -1,4 +1,4 @@
-export * from "..\\Modal";
-export * from "..\\ModalHeader";
-export * from "..\\ModalBody";
-export * from "..\\ModalFooter";
+export * from "../Modal";
+export * from "../ModalHeader";
+export * from "../ModalBody";
+export * from "../ModalFooter";

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd;AACA,cAAc,eAAd;AACA,cAAc,aAAd;AACA,cAAc,eAAd","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":"AAAA,cAAc,SAAd;AACA,cAAc,eAAd;AACA,cAAc,aAAd;AACA,cAAc,eAAd","sourcesContent":["export * from './Modal';\nexport * from './ModalHeader';\nexport * from './ModalBody';\nexport * from './ModalFooter';\n"]}

package/components/Modal/index/package.json

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

package/components/Modal/package.json

@@ -1,5 +1,5 @@
 {
-  "main": "..\\..\\cjs\\components\\Modal\\index.js",
+  "main": "../../cjs/components/Modal/index.js",
   "module": "index",
   "types": "index.d.ts",
   "sideEffects": false

package/components/Paging/NavigationHelper/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;;;AAWA,OAAO,IAAMC,UAAU,GAAG,SAAbA,UAAa,WAAMV,iBAAiB,GAAGK,IAA1B,EAAnB;AACP,OAAO,IAAMM,eAAe,GAAG,SAAlBA,eAAkB,CAACJ,KAAD,UAA6DP,iBAAiB,GAAGM,YAApB,CAAiCC,KAAjC,CAA7D,EAAxB","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;;;AAWA,OAAO,IAAMC,UAAU,GAAG,SAAbA,UAAa,WAAMV,iBAAiB,GAAGK,IAA1B,EAAnB;AACP,OAAO,IAAMM,eAAe,GAAG,SAAlBA,eAAkB,CAACJ,KAAD;AAC7BP,IAAAA,iBAAiB,GAAGM,YAApB,CAAiCC,KAAjC,CAD6B,GAAxB","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/components/Paging/NavigationHelper/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\components\\Paging\\NavigationHelper.js",
+  "main": "../../../cjs/components/Paging/NavigationHelper.js",
   "module": "NavigationHelper",
-  "types": "..\\NavigationHelper.d.ts",
+  "types": "../NavigationHelper.d.ts",
   "sideEffects": false
 }

package/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/components/Paging/Paging/Paging.js

@@ -1,25 +1,27 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 
-var _dec, _class, _class2, _temp;
+var _dec, _class, _class2, _temp, _class2$defaultProps;
 
 import React from 'react';
 import { func, number } from 'prop-types';
-import cn from 'classnames';
-import { isKeyArrowLeft, isKeyArrowRight, isKeyEnter } from "..\\..\\..\\lib\\events\\keyboard\\identifiers";
-import { locale } from "..\\..\\..\\lib\\locale\\decorators";
-import { tabListener } from "..\\..\\..\\lib\\events\\tabListener";
-import { emptyHandler, isIE11 } from "..\\..\\..\\lib\\utils";
-import { ThemeContext } from "..\\..\\..\\lib\\theming\\ThemeContext";
-import { ArrowChevronRightIcon } from "..\\..\\..\\internal\\icons\\16px";
-import { jsStyles } from "..\\Paging.styles";
-import * as NavigationHelper from "..\\NavigationHelper";
-import { getItems } from "..\\PagingHelper";
-import { PagingLocaleHelper } from "..\\locale";
+import { isKeyArrowLeft, isKeyArrowRight, isKeyEnter } from "../../../lib/events/keyboard/identifiers";
+import { locale } from "../../../lib/locale/decorators";
+import { keyListener } from "../../../lib/events/keyListener";
+import { emptyHandler } from "../../../lib/utils";
+import { isIE11 } from "../../../lib/client";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { ArrowChevronRightIcon } from "../../../internal/icons/16px";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { cx } from "../../../lib/theming/Emotion";
+import { rootNode } from "../../../lib/rootNode";
+import { styles } from "../Paging.styles";
+import * as NavigationHelper from "../NavigationHelper";
+import { getItems } from "../PagingHelper";
+import { PagingLocaleHelper } from "../locale";
 var IGNORE_EVENT_TAGS = ['input', 'textarea'];
-export var Paging = (_dec = locale('Paging', PagingLocaleHelper), _dec(_class = (_temp = _class2 =
-/*#__PURE__*/
-function (_React$Component) {
-  _inheritsLoose(Paging, _React$Component);
+export var Paging = (_dec = locale('Paging', PagingLocaleHelper), rootNode(_class = _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_React$PureComponent) {
+  _inheritsLoose(Paging, _React$PureComponent);
 
   function Paging() {
     var _this;
@@ -28,14 +30,12 @@ function (_React$Component) {
       args[_key] = arguments[_key];
     }
 
-    _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;
     _this.state = {
       focusedByTab: false,
       focusedItem: null,
       keyboardControl: _this.props.useGlobalListener
     };
-    _this.theme = void 0;
-    _this.locale = void 0;
     _this.addedGlobalListener = false;
     _this.container = null;
 
@@ -65,22 +65,22 @@ function (_React$Component) {
     };
 
     _this.renderDots = function (key) {
-      return React.createElement("span", {
+      return /*#__PURE__*/React.createElement("span", {
         "data-tid": "Paging__dots",
         key: key,
-        className: jsStyles.dots(_this.theme)
+        className: styles.dots(_this.theme)
       }, '...');
     };
 
     _this.renderForwardLink = function (disabled, focused) {
-      var _cn;
+      var _cx;
 
-      var classes = cn((_cn = {}, _cn[jsStyles.forwardLink(_this.theme)] = true, _cn[jsStyles.forwardLinkFocused()] = focused, _cn[jsStyles.disabled(_this.theme)] = disabled, _cn));
+      var classes = cx((_cx = {}, _cx[styles.forwardLink(_this.theme)] = true, _cx[styles.forwardLinkFocused()] = focused, _cx[styles.disabled(_this.theme)] = disabled, _cx));
       var _this$props = _this.props,
           Component = _this$props.component,
           caption = _this$props.caption;
       var forward = _this.locale.forward;
-      return React.createElement(Component, {
+      return /*#__PURE__*/React.createElement(Component, {
         key: 'forward',
         "data-tid": "Paging__forwardLink",
         active: false,
@@ -88,29 +88,29 @@ function (_React$Component) {
         onClick: disabled ? emptyHandler : _this.goForward,
         tabIndex: -1,
         pageNumber: 'forward'
-      }, caption || forward, React.createElement("span", {
-        className: jsStyles.forwardIcon()
-      }, React.createElement(ArrowChevronRightIcon, {
-        size: "18px"
+      }, caption || forward, /*#__PURE__*/React.createElement("span", {
+        className: styles.forwardIcon(_this.theme)
+      }, /*#__PURE__*/React.createElement(ArrowChevronRightIcon, {
+        size: _this.theme.pagingForwardIconSize
       })));
     };
 
     _this.renderPageLink = function (pageNumber, active, focused) {
-      var _cn2;
+      var _cx2;
 
-      var classes = cn((_cn2 = {}, _cn2[jsStyles.pageLink(_this.theme)] = true, _cn2[jsStyles.pageLinkFocused(_this.theme)] = focused, _cn2[jsStyles.active()] = active, _cn2));
+      var classes = cx((_cx2 = {}, _cx2[styles.pageLink(_this.theme)] = true, _cx2[styles.pageLinkFocused(_this.theme)] = focused, _cx2[styles.active(_this.theme)] = active, _cx2));
       var Component = _this.props.component;
 
       var handleClick = function handleClick() {
         return _this.goToPage(pageNumber);
       };
 
-      return React.createElement("span", {
+      return /*#__PURE__*/React.createElement("span", {
         "data-tid": "Paging__pageLinkWrapper",
         key: pageNumber,
-        className: jsStyles.pageLinkWrapper(),
+        className: styles.pageLinkWrapper(),
         onMouseDown: _this.handleMouseDownPageLink
-      }, React.createElement(Component, {
+      }, /*#__PURE__*/React.createElement(Component, {
         "data-tid": "Paging__pageLink",
         active: active,
         className: classes,
@@ -132,17 +132,17 @@ function (_React$Component) {
       var canGoForward = _this.canGoForward();
 
       if (keyboardControl && (canGoBackward || canGoForward)) {
-        return React.createElement("span", {
-          className: jsStyles.pageLinkHint(_this.theme)
-        }, React.createElement("span", {
-          className: canGoBackward ? '' : jsStyles.transparent()
-        }, '←'), React.createElement("span", null, NavigationHelper.getKeyName()), React.createElement("span", {
-          className: canGoForward ? '' : jsStyles.transparent()
+        return /*#__PURE__*/React.createElement("span", {
+          className: styles.pageLinkHint(_this.theme)
+        }, /*#__PURE__*/React.createElement("span", {
+          className: canGoBackward ? '' : styles.transparent()
+        }, '←'), /*#__PURE__*/React.createElement("span", null, NavigationHelper.getKeyName()), /*#__PURE__*/React.createElement("span", {
+          className: canGoForward ? '' : styles.transparent()
         }, '→'));
       }
 
-      return React.createElement("div", {
-        className: jsStyles.pageLinkHintPlaceHolder()
+      return /*#__PURE__*/React.createElement("div", {
+        className: styles.pageLinkHintPlaceHolder(_this.theme)
       });
     };
 
@@ -228,8 +228,8 @@ function (_React$Component) {
       // so we should check tabPressed in async way
 
 
-      process.nextTick(function () {
-        if (tabListener.isTabPressed) {
+      requestAnimationFrame(function () {
+        if (keyListener.isTabPressed) {
           _this.setState({
             focusedByTab: true
           });
@@ -376,14 +376,6 @@ function (_React$Component) {
     }
   };
 
-  _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();
@@ -392,6 +384,12 @@ function (_React$Component) {
     if (prevProps.useGlobalListener && !this.props.useGlobalListener) {
       this.removeGlobalListener();
     }
+
+    if (prevProps.useGlobalListener !== this.props.useGlobalListener) {
+      this.setState({
+        keyboardControl: this.props.useGlobalListener
+      });
+    }
   };
 
   _proto.componentWillUnmount = function componentWillUnmount() {
@@ -401,58 +399,60 @@ function (_React$Component) {
   _proto.render = function render() {
     var _this2 = this;
 
-    return React.createElement(ThemeContext.Consumer, null, function (theme) {
+    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
       _this2.theme = theme;
       return _this2.renderMain();
     });
   };
 
   _proto.renderMain = function renderMain() {
-    return React.createElement("span", {
+    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.props), /*#__PURE__*/React.createElement("span", {
       tabIndex: 0,
-      "data-tid": "Paging__root",
-      className: jsStyles.paging(),
+      "data-tid": this.props['data-tid'],
+      className: styles.paging(this.theme),
       onKeyDown: this.props.useGlobalListener ? undefined : this.handleKeyDown,
       onFocus: this.handleFocus,
       onBlur: this.handleBlur,
       onMouseDown: this.handleMouseDown,
       ref: this.refContainer
-    }, this.getItems().map(this.renderItem));
+    }, this.getItems().map(this.renderItem)));
   };
 
   return Paging;
-}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Paging', _class2.defaultProps = {
+}(React.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Paging', _class2.defaultProps = (_class2$defaultProps = {
   component: function component(_ref) {
     var className = _ref.className,
         onClick = _ref.onClick,
         children = _ref.children;
-    return React.createElement("span", {
+    return /*#__PURE__*/React.createElement("span", {
       className: className,
       onClick: onClick
     }, children);
   },
   useGlobalListener: false
-}, _class2.propTypes = {}, _temp)) || _class);
+}, _class2$defaultProps['data-tid'] = 'Paging__root', _class2$defaultProps), _class2.propTypes = {}, _temp)) || _class) || _class);
 Paging.propTypes = {
-  /**
-                      * Current active page
-                      */
+  /**
+   * Current active page
+   */
   activePage: 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: func,
 
-  /**
-                    * Total page count
-                    */
+  /**
+   * Total page count
+   */
   pagesCount: number.isRequired,
 
-  /**
-                                  * Calls when page has been changed
-                                  */
+  /**
+   * Calls when page has been changed
+   */
   onPageChange: func.isRequired
 };