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

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

@@ -1 +1 @@
-{"version":3,"sources":["ModalFooter.tsx"],"names":["ModalFooter","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","panel","children","setHasFooter","setHasPanel","renderContent","fixed","styles","footer","fixedFooter","Boolean","mobileFooter","footerWrapper","horizontalScroll","__KONTUR_REACT_UI__","__MODAL_FOOTER__"],"mappings":"yEAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8C;;;;;;;;;;;AAWA;AACA;AACA;AACA;AACA;AACA,SAASA,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAqEL,KAArE,CAAQM,MAAR,CAAQA,MAAR,8BAAiBD,MAAM,CAACE,QAAP,GAAkB,KAAlB,GAA0B,IAA3C,iBAAiDC,KAAjD,GAAqER,KAArE,CAAiDQ,KAAjD,CAAwDC,QAAxD,GAAqET,KAArE,CAAwDS,QAAxD;;AAEA,wBAAU,YAAM;AACdN,IAAAA,KAAK,CAACO,YAAN,oBAAAP,KAAK,CAACO,YAAN;AACAP,IAAAA,KAAK,CAACQ,WAAN,oBAAAR,KAAK,CAACQ,WAAN,CAAoBH,KAApB;;AAEA,WAAO,YAAM;AACXL,MAAAA,KAAK,CAACO,YAAN,oBAAAP,KAAK,CAACO,YAAN,CAAqB,KAArB;AACAP,MAAAA,KAAK,CAACQ,WAAN,oBAAAR,KAAK,CAACQ,WAAN,CAAoB,KAApB;AACD,KAHD;AAID,GARD,EAQG,CAACH,KAAD,CARH;;AAUA,MAAMI,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE,QAAA,SAAS,EAAE;AACRC,sBAAOC,MAAP,CAAcd,KAAd,CADQ,IACe,IADf;AAERa,sBAAOE,WAAP,CAAmBf,KAAnB,CAFQ,IAEoBY,KAFpB;AAGRC,sBAAON,KAAP,CAAaP,KAAb,CAHQ,IAGcgB,OAAO,CAACT,KAAD,CAHrB;AAIRM,sBAAOI,YAAP,CAAoBjB,KAApB,CAJQ,IAIqBI,MAAM,CAACE,QAJ5B,OADb;;;AAQGE,MAAAA,QARH,CADF;;;AAYD,GAbD;;AAeA;AACE,iCAAC,4BAAD,EAAmBT,KAAnB;AACE,iCAAC,cAAD,IAAQ,QAAQ,EAAE,aAAlB,EAAiC,SAAS,EAAEc,cAAOK,aAAP,EAA5C;AACGb,IAAAA,MAAM;AACL,iCAAC,cAAD,IAAQ,IAAI,EAAC,QAAb,EAAsB,MAAM,EAAEH,KAAK,CAACiB,gBAAN,GAAyB,qCAAzB,GAA4C,CAA1E;AACGR,IAAAA,aADH,CADK;;;AAKLA,IAAAA,aAAa,EANjB,CADF,CADF;;;;;AAaD;;AAEDb,WAAW,CAACsB,mBAAZ,GAAkC,aAAlC;AACAtB,WAAW,CAACuB,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useEffect } from 'react';\n\nimport { getScrollWidth } from '../../lib/dom/getScrollWidth';\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 { ModalContext } from './ModalContext';\n\nexport interface ModalFooterProps extends CommonProps {\n  /**\n   * Включает серый цвет в футере\n   */\n  panel?: boolean;\n  sticky?: boolean;\n  children?: ReactNode;\n}\n\n/**\n * Футер модального окна.\n *\n * @visibleName Modal.Footer\n */\nfunction ModalFooter(props: ModalFooterProps) {\n  const theme = useContext(ThemeContext);\n  const modal = useContext(ModalContext);\n  const layout = useResponsiveLayout();\n\n  const { sticky = layout.isMobile ? false : true, panel, children } = props;\n\n  useEffect(() => {\n    modal.setHasFooter?.();\n    modal.setHasPanel?.(panel);\n\n    return () => {\n      modal.setHasFooter?.(false);\n      modal.setHasPanel?.(false);\n    };\n  }, [panel]);\n\n  const renderContent = (fixed = false) => {\n    return (\n      <div\n        className={cx({\n          [styles.footer(theme)]: true,\n          [styles.fixedFooter(theme)]: fixed,\n          [styles.panel(theme)]: Boolean(panel),\n          [styles.mobileFooter(theme)]: layout.isMobile,\n        })}\n      >\n        {children}\n      </div>\n    );\n  };\n\n  return (\n    <CommonWrapper {...props}>\n      <ZIndex priority={'ModalFooter'} className={styles.footerWrapper()}>\n        {sticky ? (\n          <Sticky side=\"bottom\" offset={modal.horizontalScroll ? getScrollWidth() : 0}>\n            {renderContent}\n          </Sticky>\n        ) : (\n          renderContent()\n        )}\n      </ZIndex>\n    </CommonWrapper>\n  );\n}\n\nModalFooter.__KONTUR_REACT_UI__ = 'ModalFooter';\nModalFooter.__MODAL_FOOTER__ = true;\n\nexport { ModalFooter };\n"]}
+{"version":3,"sources":["ModalFooter.tsx"],"names":["ModalFooterDataTids","root","ModalFooter","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","gap","panel","children","setHasFooter","setHasPanel","renderContent","fixed","styles","footer","fixedFooter","Boolean","fixedPanel","mobileFooter","horizontalScroll","__KONTUR_REACT_UI__","__MODAL_FOOTER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,kD;;;;;;;;;;;;;;;;;;;;;;;;AAwBO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAA4DL,KAA5D,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,GAAnC,GAA4DR,KAA5D,CAAmCQ,GAAnC,CAAwCC,KAAxC,GAA4DT,KAA5D,CAAwCS,KAAxC,CAA+CC,QAA/C,GAA4DV,KAA5D,CAA+CU,QAA/C;;AAEA,8BAAgB,YAAM;AACpBP,IAAAA,KAAK,CAACQ,YAAN,oBAAAR,KAAK,CAACQ,YAAN;AACAR,IAAAA,KAAK,CAACS,WAAN,oBAAAT,KAAK,CAACS,WAAN,CAAoBH,KAApB;;AAEA,WAAO,YAAM;AACXN,MAAAA,KAAK,CAACQ,YAAN,oBAAAR,KAAK,CAACQ,YAAN,CAAqB,KAArB;AACAR,MAAAA,KAAK,CAACS,WAAN,oBAAAT,KAAK,CAACS,WAAN,CAAoB,KAApB;AACD,KAHD;AAID,GARD,EAQG,CAACH,KAAD,CARH;;AAUA,MAAMI,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,KAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACG,OAACL,KAAK,IAAIK,KAAV,kBAAoB,6BAAC,8BAAD,IAAgB,KAAK,EAAEA,KAAvB,GADvB;AAEE;AACE,oBAAUjB,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACTiB,sBAAOC,MAAP,CAAcf,KAAd,CADS;AAETa,QAAAA,KAAK,IAAIC,cAAOE,WAAP,CAAmBhB,KAAnB,CAFA;AAGTiB,QAAAA,OAAO,CAACT,KAAD,CAAP,IAAkBM,cAAON,KAAP,CAAaR,KAAb,CAHT;AAITa,QAAAA,KAAK,IAAII,OAAO,CAACT,KAAD,CAAhB,IAA2BM,cAAOI,UAAP,CAAkBlB,KAAlB,CAJlB;AAKTI,QAAAA,MAAM,CAACE,QAAP,IAAmBQ,cAAOK,YAAP,CAAoBnB,KAApB,CALV,CAFb;;;AAUG,gCAAcO,GAAd;AACC,mCAAC,cAAD,IAAQ,QAAQ,EAAEH,MAAM,CAACE,QAAzB,EAAmC,GAAG,EAAEC,GAAxC;AACGE,MAAAA,QADH,CADD;;;AAKCA,MAAAA,QAfJ,CAFF,CADF;;;;;AAuBD,GAxBD;;AA0BA;AACE,iCAAC,4BAAD,EAAmBV,KAAnB;AACGM,IAAAA,MAAM;AACL,iCAAC,cAAD,IAAQ,IAAI,EAAC,QAAb,EAAsB,MAAM,EAAEH,KAAK,CAACkB,gBAAN,GAAyB,qCAAzB,GAA4C,CAA1E;AACGR,IAAAA,aADH,CADK;;;AAKLA,IAAAA,aAAa,EANjB,CADF;;;;AAWD;;AAEDd,WAAW,CAACuB,mBAAZ,GAAkC,aAAlC;AACAvB,WAAW,CAACwB,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect } from 'react';\n\nimport { getScrollWidth } from '../../lib/dom/getScrollWidth';\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\nimport { Gapped, GappedProps } from '../Gapped';\nimport { isNonNullable } from '../../lib/utils';\n\nimport { styles } from './Modal.styles';\nimport { ModalContext } from './ModalContext';\nimport { ModalSeparator } from './ModalSeparator';\n\nexport interface ModalFooterProps extends CommonProps {\n  /**\n   * Включает серый цвет в футере\n   */\n  panel?: boolean;\n  /**\n   * Закрепляет футер снизу модального окна\n   *\n   * На десктопе по умолчанию равен `true`\n   * На мобильных по умолчанию равен `false`\n   */\n  sticky?: boolean;\n  /**\n   * Контент футера\n   */\n  children?: ReactNode;\n  /**\n   * Задаёт отступ между элементами футера\n   */\n  gap?: GappedProps['gap'];\n}\n\nexport const ModalFooterDataTids = {\n  root: 'ModalFooter__root',\n} as const;\n\n/**\n * Футер модального окна.\n *\n * @visibleName Modal.Footer\n */\nfunction ModalFooter(props: ModalFooterProps) {\n  const theme = useContext(ThemeContext);\n  const modal = useContext(ModalContext);\n  const layout = useResponsiveLayout();\n\n  const { sticky = !layout.isMobile, gap, panel, children } = props;\n\n  useLayoutEffect(() => {\n    modal.setHasFooter?.();\n    modal.setHasPanel?.(panel);\n\n    return () => {\n      modal.setHasFooter?.(false);\n      modal.setHasPanel?.(false);\n    };\n  }, [panel]);\n\n  const renderContent = (fixed = false) => {\n    return (\n      <>\n        {(panel || fixed) && <ModalSeparator fixed={fixed} />}\n        <div\n          data-tid={ModalFooterDataTids.root}\n          className={cx(\n            styles.footer(theme),\n            fixed && styles.fixedFooter(theme),\n            Boolean(panel) && styles.panel(theme),\n            fixed && Boolean(panel) && styles.fixedPanel(theme),\n            layout.isMobile && styles.mobileFooter(theme),\n          )}\n        >\n          {isNonNullable(gap) ? (\n            <Gapped vertical={layout.isMobile} gap={gap}>\n              {children}\n            </Gapped>\n          ) : (\n            children\n          )}\n        </div>\n      </>\n    );\n  };\n\n  return (\n    <CommonWrapper {...props}>\n      {sticky ? (\n        <Sticky side=\"bottom\" offset={modal.horizontalScroll ? getScrollWidth() : 0}>\n          {renderContent}\n        </Sticky>\n      ) : (\n        renderContent()\n      )}\n    </CommonWrapper>\n  );\n}\n\nModalFooter.__KONTUR_REACT_UI__ = 'ModalFooter';\nModalFooter.__MODAL_FOOTER__ = true;\n\nexport { ModalFooter };\n"]}

package/cjs/components/Modal/ModalHeader.d.ts

@@ -4,6 +4,9 @@ export interface ModalHeaderProps extends CommonProps {
     sticky?: boolean;
     children?: ReactNode;
 }
+export declare const ModalHeaderDataTids: {
+    readonly root: "ModalHeader__root";
+};
 /**
  * Шапка модального окна
  *

package/cjs/components/Modal/ModalHeader.js

@@ -1,63 +1,70 @@
-"use strict";exports.__esModule = true;exports.ModalHeader = ModalHeader;var _react = _interopRequireWildcard(require("react"));
+"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");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 _ModalContext = require("./ModalContext");
+var _ModalSeparator = require("./ModalSeparator");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 ModalHeaderDataTids = {
+  root: 'ModalHeader__root' };
+
+
 /**
  * Шапка модального окна
  *
  * @visibleName Modal.Header
- */
+ */exports.ModalHeaderDataTids = ModalHeaderDataTids;
 function ModalHeader(props) {
   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 ? false : true : _props$sticky,children = props.children;
+  var _props$sticky = props.sticky,sticky = _props$sticky === void 0 ? !layout.isMobile : _props$sticky,children = props.children;
 
-  (0, _react.useEffect)(function () {
+  (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(fixed) {var _cx;if (fixed === void 0) {fixed = false;}
+  var renderContent = function renderContent(fixed) {if (fixed === void 0) {fixed = false;}
     return /*#__PURE__*/(
+      _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/
       _react.default.createElement("div", {
-        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)) },
+        "data-tid": ModalHeaderDataTids.root,
+        className: (0, _Emotion.cx)(
+        _Modal.styles.header(theme),
+        layout.isMobile && _Modal.styles.mobileHeader(theme),
+        Boolean(modal.additionalPadding) && _Modal.styles.headerAddPadding(theme),
+        fixed && _Modal.styles.fixedHeader(theme),
+        fixed && layout.isMobile && _Modal.styles.mobileFixedHeader(theme),
+        Boolean(modal.close) && _Modal.styles.headerWithClose(theme),
+        layout.isMobile && _Modal.styles.mobileHeaderWithClose(theme)) },
 
 
-      modal.close && /*#__PURE__*/_react.default.createElement(_ModalClose.ModalClose, { requestClose: modal.close.requestClose, disableClose: modal.close.disableClose }),
-      children));
+      modal.close && /*#__PURE__*/
+      _react.default.createElement(_ModalClose.ModalClose, { requestClose: modal.close.requestClose, disableClose: modal.close.disableClose }),
 
+      children),
 
-  };
+      fixed && /*#__PURE__*/_react.default.createElement(_ModalSeparator.ModalSeparator, { fixed: fixed })));
 
-  return /*#__PURE__*/(
-    _react.default.createElement(_CommonWrapper.CommonWrapper, props, /*#__PURE__*/
-    _react.default.createElement(_ZIndex.ZIndex, { priority: 'ModalHeader', className: _Modal.styles.headerWrapper() },
-    sticky ? /*#__PURE__*/_react.default.createElement(_Sticky.Sticky, { side: "top" }, renderContent) : renderContent())));
 
+  };
 
+  return /*#__PURE__*/(
+    _react.default.createElement(_CommonWrapper.CommonWrapper, props, sticky ? /*#__PURE__*/_react.default.createElement(_Sticky.Sticky, { side: "top" }, renderContent) : renderContent()));
 
 }
 

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

@@ -1 +1 @@
-{"version":3,"sources":["ModalHeader.tsx"],"names":["ModalHeader","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","children","setHasHeader","renderContent","fixed","styles","header","mobileHeader","headerAddPadding","Boolean","additionalPadding","fixedHeader","mobileFixedHeader","headerWithClose","close","mobileHeaderWithClose","requestClose","disableClose","headerWrapper","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"yEAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,8C;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA,SAASA,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAA8DL,KAA9D,CAAQM,MAAR,CAAQA,MAAR,8BAAiBD,MAAM,CAACE,QAAP,GAAkB,KAAlB,GAA0B,IAA3C,iBAAiDC,QAAjD,GAA8DR,KAA9D,CAAiDQ,QAAjD;;AAEA,wBAAU,YAAM;AACdL,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,QAAA,SAAS,EAAE;AACRC,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,OADb;;;AAWGJ,MAAAA,KAAK,CAACkB,KAAN,iBAAe,6BAAC,sBAAD,IAAY,YAAY,EAAElB,KAAK,CAACkB,KAAN,CAAYE,YAAtC,EAAoD,YAAY,EAAEpB,KAAK,CAACkB,KAAN,CAAYG,YAA9E,GAXlB;AAYGhB,MAAAA,QAZH,CADF;;;AAgBD,GAjBD;;AAmBA;AACE,iCAAC,4BAAD,EAAmBR,KAAnB;AACE,iCAAC,cAAD,IAAQ,QAAQ,EAAE,aAAlB,EAAiC,SAAS,EAAEY,cAAOa,aAAP,EAA5C;AACGnB,IAAAA,MAAM,gBAAG,6BAAC,cAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBI,aAApB,CAAH,GAAiDA,aAAa,EADvE,CADF,CADF;;;;AAOD;;AAEDX,WAAW,CAAC2B,mBAAZ,GAAkC,aAAlC;AACA3B,WAAW,CAAC4B,gBAAZ,GAA+B,IAA/B","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"]}
+{"version":3,"sources":["ModalHeader.tsx"],"names":["ModalHeaderDataTids","root","ModalHeader","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","children","setHasHeader","renderContent","fixed","styles","header","mobileHeader","Boolean","additionalPadding","headerAddPadding","fixedHeader","mobileFixedHeader","close","headerWithClose","mobileHeaderWithClose","requestClose","disableClose","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,kD;;;;;;;AAOO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAgDL,KAAhD,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,QAAnC,GAAgDR,KAAhD,CAAmCQ,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,KAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE;AACE,oBAAUd,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACTc,sBAAOC,MAAP,CAAcZ,KAAd,CADS;AAETI,QAAAA,MAAM,CAACE,QAAP,IAAmBK,cAAOE,YAAP,CAAoBb,KAApB,CAFV;AAGTc,QAAAA,OAAO,CAACZ,KAAK,CAACa,iBAAP,CAAP,IAAoCJ,cAAOK,gBAAP,CAAwBhB,KAAxB,CAH3B;AAITU,QAAAA,KAAK,IAAIC,cAAOM,WAAP,CAAmBjB,KAAnB,CAJA;AAKTU,QAAAA,KAAK,IAAIN,MAAM,CAACE,QAAhB,IAA4BK,cAAOO,iBAAP,CAAyBlB,KAAzB,CALnB;AAMTc,QAAAA,OAAO,CAACZ,KAAK,CAACiB,KAAP,CAAP,IAAwBR,cAAOS,eAAP,CAAuBpB,KAAvB,CANf;AAOTI,QAAAA,MAAM,CAACE,QAAP,IAAmBK,cAAOU,qBAAP,CAA6BrB,KAA7B,CAPV,CAFb;;;AAYGE,MAAAA,KAAK,CAACiB,KAAN;AACC,mCAAC,sBAAD,IAAY,YAAY,EAAEjB,KAAK,CAACiB,KAAN,CAAYG,YAAtC,EAAoD,YAAY,EAAEpB,KAAK,CAACiB,KAAN,CAAYI,YAA9E,GAbJ;;AAeGhB,MAAAA,QAfH,CADF;;AAkBGG,MAAAA,KAAK,iBAAI,6BAAC,8BAAD,IAAgB,KAAK,EAAEA,KAAvB,GAlBZ,CADF;;;AAsBD,GAvBD;;AAyBA;AACE,iCAAC,4BAAD,EAAmBX,KAAnB,EAA2BM,MAAM,gBAAG,6BAAC,cAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBI,aAApB,CAAH,GAAiDA,aAAa,EAA/F,CADF;;AAGD;;AAEDX,WAAW,CAAC0B,mBAAZ,GAAkC,aAAlC;AACA1B,WAAW,CAAC2B,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect } from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\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';\nimport { ModalSeparator } from './ModalSeparator';\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 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      <>\n        <div\n          data-tid={ModalHeaderDataTids.root}\n          className={cx(\n            styles.header(theme),\n            layout.isMobile && styles.mobileHeader(theme),\n            Boolean(modal.additionalPadding) && styles.headerAddPadding(theme),\n            fixed && styles.fixedHeader(theme),\n            fixed && layout.isMobile && styles.mobileFixedHeader(theme),\n            Boolean(modal.close) && styles.headerWithClose(theme),\n            layout.isMobile && styles.mobileHeaderWithClose(theme),\n          )}\n        >\n          {modal.close && (\n            <ModalClose requestClose={modal.close.requestClose} disableClose={modal.close.disableClose} />\n          )}\n          {children}\n        </div>\n        {fixed && <ModalSeparator fixed={fixed} />}\n      </>\n    );\n  };\n\n  return (\n    <CommonWrapper {...props}>{sticky ? <Sticky side=\"top\">{renderContent}</Sticky> : renderContent()}</CommonWrapper>\n  );\n}\n\nModalHeader.__KONTUR_REACT_UI__ = 'ModalHeader';\nModalHeader.__MODAL_HEADER__ = true;\n\nexport { ModalHeader };\n"]}

package/cjs/components/Modal/ModalSeparator.d.ts

@@ -0,0 +1,5 @@
+import { CommonProps } from '../../internal/CommonWrapper';
+export interface ModalSeparatorProps extends CommonProps {
+    fixed?: boolean;
+}
+export declare function ModalSeparator({ fixed }: ModalSeparatorProps): JSX.Element;

package/cjs/components/Modal/ModalSeparator.js

@@ -0,0 +1,21 @@
+"use strict";exports.__esModule = true;exports.ModalSeparator = ModalSeparator;var _react = _interopRequireWildcard(require("react"));
+
+var _Emotion = require("../../lib/theming/Emotion");
+
+var _ThemeContext = require("../../lib/theming/ThemeContext");
+
+var _Modal = require("./Modal.styles");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;}
+
+
+
+
+
+function ModalSeparator(_ref) {var fixed = _ref.fixed;
+  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
+
+  return /*#__PURE__*/(
+    _react.default.createElement("div", { className: _Modal.styles.modalSeparatorWrapper() }, /*#__PURE__*/
+    _react.default.createElement("div", { className: (0, _Emotion.cx)(_Modal.styles.modalSeparator(theme), fixed && _Modal.styles.modalSeparatorFixed()) })));
+
+
+}

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

@@ -0,0 +1 @@
+{"version":3,"sources":["ModalSeparator.tsx"],"names":["ModalSeparator","fixed","theme","ThemeContext","styles","modalSeparatorWrapper","modalSeparator","modalSeparatorFixed"],"mappings":"+EAAA;;AAEA;;AAEA;;AAEA,uC;;;;;;AAMO,SAASA,cAAT,OAAwD,KAA9BC,KAA8B,QAA9BA,KAA8B;AAC7D,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,0CAAK,SAAS,EAAEC,cAAOC,qBAAP,EAAhB;AACE,0CAAK,SAAS,EAAE,iBAAGD,cAAOE,cAAP,CAAsBJ,KAAtB,CAAH,EAAiCD,KAAK,IAAIG,cAAOG,mBAAP,EAA1C,CAAhB,GADF,CADF;;;AAKD","sourcesContent":["import React, { useContext } from 'react';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { CommonProps } from '../../internal/CommonWrapper';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { styles } from './Modal.styles';\n\nexport interface ModalSeparatorProps extends CommonProps {\n  fixed?: boolean;\n}\n\nexport function ModalSeparator({ fixed }: ModalSeparatorProps) {\n  const theme = useContext(ThemeContext);\n\n  return (\n    <div className={styles.modalSeparatorWrapper()}>\n      <div className={cx(styles.modalSeparator(theme), fixed && styles.modalSeparatorFixed())} />\n    </div>\n  );\n}\n"]}

package/cjs/components/Modal/getModalBodyTheme.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '../../lib/theming/Theme';
+export declare const getModalBodyTheme: (theme: Theme) => Theme;

package/cjs/components/Modal/getModalBodyTheme.js

@@ -0,0 +1,11 @@
+"use strict";exports.__esModule = true;exports.getModalBodyTheme = void 0;var _ThemeFactory = require("../../lib/theming/ThemeFactory");
+
+
+var getModalBodyTheme = function getModalBodyTheme(theme) {
+  return _ThemeFactory.ThemeFactory.create(
+  {
+    loaderBorderRadius: theme.modalBodyBorderRadius },
+
+  theme);
+
+};exports.getModalBodyTheme = getModalBodyTheme;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["getModalBodyTheme.ts"],"names":["getModalBodyTheme","theme","ThemeFactory","create","loaderBorderRadius","modalBodyBorderRadius"],"mappings":"0EAAA;;;AAGO,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,KAAD,EAAyB;AACxD,SAAOC,2BAAaC,MAAb;AACL;AACEC,IAAAA,kBAAkB,EAAEH,KAAK,CAACI,qBAD5B,EADK;;AAILJ,EAAAA,KAJK,CAAP;;AAMD,CAPM,C","sourcesContent":["import { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const getModalBodyTheme = (theme: Theme): Theme => {\n  return ThemeFactory.create(\n    {\n      loaderBorderRadius: theme.modalBodyBorderRadius,\n    },\n    theme,\n  );\n};\n"]}

package/cjs/components/Modal/getModalTheme.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '../../lib/theming/Theme';
+export declare const getModalTheme: (theme: Theme) => Theme;

package/cjs/components/Modal/getModalTheme.js

@@ -0,0 +1,11 @@
+"use strict";exports.__esModule = true;exports.getModalTheme = void 0;var _ThemeFactory = require("../../lib/theming/ThemeFactory");
+
+
+var getModalTheme = function getModalTheme(theme) {
+  return _ThemeFactory.ThemeFactory.create(
+  {
+    loaderBorderRadius: theme.modalBorderRadius },
+
+  theme);
+
+};exports.getModalTheme = getModalTheme;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["getModalTheme.ts"],"names":["getModalTheme","theme","ThemeFactory","create","loaderBorderRadius","modalBorderRadius"],"mappings":"sEAAA;;;AAGO,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAyB;AACpD,SAAOC,2BAAaC,MAAb;AACL;AACEC,IAAAA,kBAAkB,EAAEH,KAAK,CAACI,iBAD5B,EADK;;AAILJ,EAAAA,KAJK,CAAP;;AAMD,CAPM,C","sourcesContent":["import { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const getModalTheme = (theme: Theme): Theme => {\n  return ThemeFactory.create(\n    {\n      loaderBorderRadius: theme.modalBorderRadius,\n    },\n    theme,\n  );\n};\n"]}

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

@@ -0,0 +1,3 @@
+export declare const ForwardIcon: import("../../lib/forwardRefAndName").ReactUIIconWithRef<SVGSVGElement, Omit<import("../../internal/icons2022/BaseIcon").IconProps, "size"> & {
+    size?: number | "small" | "medium" | "large" | undefined;
+}>;

package/cjs/components/Paging/ForwardIcon.js

@@ -0,0 +1,15 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ForwardIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+
+var _ArrowCRightIcon16Light = require("../../internal/icons2022/ArrowCRightIcon/ArrowCRightIcon16Light");
+var _ArrowCRightIcon20Light = require("../../internal/icons2022/ArrowCRightIcon/ArrowCRightIcon20Light");
+var _ArrowCRightIcon24Regular = require("../../internal/icons2022/ArrowCRightIcon/ArrowCRightIcon24Regular");
+var _iconSizer = require("../../internal/icons2022/iconSizer"); /* eslint-disable react/display-name */
+
+var ForwardIcon = (0, _iconSizer.iconSizer)(
+{
+  small: function small() {return /*#__PURE__*/_react.default.createElement(_ArrowCRightIcon16Light.ArrowCRightIcon16Light, null);},
+  medium: function medium() {return /*#__PURE__*/_react.default.createElement(_ArrowCRightIcon20Light.ArrowCRightIcon20Light, null);},
+  large: function large() {return /*#__PURE__*/_react.default.createElement(_ArrowCRightIcon24Regular.ArrowCRightIcon24Regular, null);} },
+
+'ForwardIcon');exports.ForwardIcon = ForwardIcon;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["ForwardIcon.tsx"],"names":["ForwardIcon","small","medium","large"],"mappings":";AACA;;AAEA;AACA;AACA;AACA,+D,CANA;;AAQO,IAAMA,WAAW,GAAG;AACzB;AACEC,EAAAA,KAAK,EAAE,sCAAM,6BAAC,8CAAD,OAAN,EADT;AAEEC,EAAAA,MAAM,EAAE,uCAAM,6BAAC,8CAAD,OAAN,EAFV;AAGEC,EAAAA,KAAK,EAAE,sCAAM,6BAAC,kDAAD,OAAN,EAHT,EADyB;;AAMzB,aANyB,CAApB,C","sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\n\nimport { ArrowCRightIcon16Light } from '../../internal/icons2022/ArrowCRightIcon/ArrowCRightIcon16Light';\nimport { ArrowCRightIcon20Light } from '../../internal/icons2022/ArrowCRightIcon/ArrowCRightIcon20Light';\nimport { ArrowCRightIcon24Regular } from '../../internal/icons2022/ArrowCRightIcon/ArrowCRightIcon24Regular';\nimport { iconSizer } from '../../internal/icons2022/iconSizer';\n\nexport const ForwardIcon = iconSizer(\n  {\n    small: () => <ArrowCRightIcon16Light />,\n    medium: () => <ArrowCRightIcon20Light />,\n    large: () => <ArrowCRightIcon24Regular />,\n  },\n  'ForwardIcon',\n);\n"]}

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Nullable } from '../../typings/utility-types';
 import { CommonProps } from '../../internal/CommonWrapper';
-interface ItemComponentProps {
+export interface ItemComponentProps {
     active: boolean;
     children?: React.ReactNode;
     className: string;
@@ -15,7 +15,7 @@ export interface PagingProps extends CommonProps {
      * Компонент обертки по умолчанию
      * @default <span />
      */
-    component: React.ComponentType<ItemComponentProps>;
+    component?: React.ComponentType<ItemComponentProps>;
     onPageChange: (pageNumber: number) => void;
     pagesCount: number;
     disabled?: boolean;
@@ -32,7 +32,16 @@ export interface PagingProps extends CommonProps {
      * **Paging** с useGlobalListener === true, то обработчик keyDown будет вызываться
      * на каждом из них. Такие случаи лучше обрабатывать отдельно.
      */
-    useGlobalListener: boolean;
+    useGlobalListener?: boolean;
+    /**
+     * Определяет, нужно ли показывать `Paging` когда страница всего одна.
+     *
+     * Этот проп будет удалён в 5-ой версии библиотеки,
+     * так как поведение со скрытием `Paging`'а станет поведением по умолчанию.
+     *
+     * @default false
+     */
+    shouldBeVisibleWithLessThanTwoPages?: boolean;
 }
 export interface PagingState {
     focusedByTab: boolean;
@@ -40,13 +49,18 @@ export interface PagingState {
     keyboardControl: boolean;
 }
 export declare type ItemType = number | '.' | 'forward';
+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;
-        "data-tid": string;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     static propTypes: {};
     private setRootNode;
     static isForward(pageNumber: number | 'forward'): boolean;
@@ -58,7 +72,7 @@ export declare class Paging extends React.PureComponent<PagingProps, PagingState
     componentDidMount(): 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,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;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"));
+"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 _identifiers = require("../../lib/events/keyboard/identifiers");
@@ -13,13 +13,17 @@ 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 _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
 
 var _Paging = require("./Paging.styles");
 var NavigationHelper = _interopRequireWildcard(require("./NavigationHelper"));
 var _PagingHelper = require("./PagingHelper");
-var _locale = require("./locale");var _dec, _class, _class2, _temp, _class2$defaultProps;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 _locale = require("./locale");
+var _PagingDefaultComponent = require("./PagingDefaultComponent");
+var _ForwardIcon = require("./ForwardIcon");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'];
 
 
 
@@ -66,9 +70,28 @@ var IGNORE_EVENT_TAGS = ['input', 'textarea'];var
 
 
 
-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.
 
 
+
+
+
+
+
+var PagingDataTids = {
+  root: 'Paging__root',
+  dots: 'Paging__dots',
+  forwardLink: 'Paging__forwardLink',
+  pageLinkWrapper: 'Paging__pageLinkWrapper',
+  pageLink: 'Paging__pageLink' };exports.PagingDataTids = PagingDataTids;var
+
+
+
+
+
+
+
+
+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.
 
 
 
@@ -78,6 +101,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
 
 
+    getProps = (0, _createPropsGetter.createPropsGetter)(Paging.defaultProps);_this.
 
 
 
@@ -89,7 +113,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
     state = {
       focusedByTab: false,
       focusedItem: null,
-      keyboardControl: _this.props.useGlobalListener };_this.
+      keyboardControl: _this.getProps().useGlobalListener };_this.
 
 
 
@@ -147,6 +171,12 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
 
 
+
+
+
+
+
+
 
 
 
@@ -172,59 +202,78 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
 
     };_this.
 
-    renderDots = function (key) {
+    renderDots = function (key) {var _cx;
       return /*#__PURE__*/(
-        _react.default.createElement("span", { "data-tid": "Paging__dots", key: key, className: _Paging.styles.dots(_this.theme) },
+        _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 _cx;
-      var classes = (0, _Emotion.cx)((_cx = {}, _cx[
-      _Paging.styles.forwardLink(_this.theme)] = true, _cx[
-      _Paging.styles.forwardLinkFocused()] = focused, _cx[
-      _Paging.styles.disabled(_this.theme)] = disabled, _cx));
+    renderForwardLink = function (disabled, focused) {var _cx2;
+      var classes = (0, _ThemeHelpers.isTheme2022)(_this.theme) ?
+      (0, _Emotion.cx)(
+      _Paging.styles.pageLink(_this.theme),
+      _Paging.styles.forwardLink(_this.theme),
+      focused && _Paging.styles.pageLinkFocused(_this.theme),
+      disabled || _this.props.disabled && _Paging.styles.pageLinkDisabled(_this.theme)) :
+
+      (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));
 
-      var _this$props = _this.props,Component = _this$props.component,caption = _this$props.caption;
+      var Component = _this.getProps().component;
       var forward = _this.locale.forward;
 
+      var forwardIcon = (0, _ThemeHelpers.isTheme2022)(_this.theme) ? /*#__PURE__*/
+      _react.default.createElement(_ForwardIcon.ForwardIcon, { size: parseInt(_this.theme.pagingForwardIconSize), style: { marginLeft: 4 } }) : /*#__PURE__*/
+
+      _react.default.createElement("span", { className: _Paging.styles.forwardIcon(_this.theme) }, /*#__PURE__*/
+      _react.default.createElement(_px.ArrowChevronRightIcon, { size: _this.theme.pagingForwardIconSize }));
+
+
+
       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, /*#__PURE__*/
-        _react.default.createElement("span", { className: _Paging.styles.forwardIcon(_this.theme) }, /*#__PURE__*/
-        _react.default.createElement(_px.ArrowChevronRightIcon, { size: _this.theme.pagingForwardIconSize }))));
-
+        _this.props.caption || forward,
+        forwardIcon));
 
 
     };_this.
 
-    renderPageLink = function (pageNumber, active, focused) {var _cx2;
-      var classes = (0, _Emotion.cx)((_cx2 = {}, _cx2[
-      _Paging.styles.pageLink(_this.theme)] = true, _cx2[
-      _Paging.styles.pageLinkFocused(_this.theme)] = focused, _cx2[
-      _Paging.styles.active(_this.theme)] = active, _cx2));
+    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 /*#__PURE__*/(
         _react.default.createElement("span", {
-          "data-tid": "Paging__pageLinkWrapper",
+          "data-tid": PagingDataTids.pageLinkWrapper,
           key: pageNumber,
           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,
@@ -314,7 +363,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
       }
     };_this.
 
-    handleFocus = function (e) {
+    handleFocus = function () {
       if (_this.props.disabled) {
         return;
       }
@@ -333,7 +382,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.
 
@@ -413,7 +462,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.
@@ -437,7 +486,7 @@ 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.componentDidUpdate = function componentDidUpdate(prevProps) {if (!prevProps.useGlobalListener && this.props.useGlobalListener) {this.addGlobalListener();}if (prevProps.useGlobalListener && !this.props.useGlobalListener) {this.removeGlobalListener();}if (prevProps.useGlobalListener !== this.props.useGlobalListener) {this.setState({ keyboardControl: this.props.useGlobalListener });}};_proto.componentWillUnmount = function componentWillUnmount() {this.removeGlobalListener();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("span", { tabIndex: 0, "data-tid": this.props['data-tid'], className: _Paging.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)));};return Paging;}(_react.default.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 /*#__PURE__*/_react.default.createElement("span", { className: className, onClick: onClick }, children);}, useGlobalListener: false }, _class2$defaultProps['data-tid'] = 'Paging__root', _class2$defaultProps), _class2.propTypes = {}, _temp)) || _class) || _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 = {