@skbkontur/react-ui 0.0.0-1b188ff0e7 → 0.0.0-1da9bba033

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.js

@@ -1,4 +1,5 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.CloseButtonIcon = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.CloseButtonIcon = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireDefault(require("react"));
+var _globalObject = require("@skbkontur/global-object");
 
 var _Emotion = require("../../lib/theming/Emotion");
 var _keyListener = require("../../lib/events/keyListener");
@@ -39,6 +40,9 @@ var _CrossIcon = require("./CrossIcon");var _excluded = ["side", "size", "color"
 
 
 
+
+
+
 
 
 
@@ -65,7 +69,7 @@ var CloseButtonIcon = function CloseButtonIcon(_ref)
   var handleFocus = function handleFocus() {
     // focus event fires before keyDown eventlistener
     // so we should check tabPressed in async way
-    requestAnimationFrame(function () {
+    _globalObject.globalObject.requestAnimationFrame == null ? void 0 : _globalObject.globalObject.requestAnimationFrame(function () {
       if (_keyListener.keyListener.isTabPressed) {
         setFocusedByTab(true);
       }
@@ -95,4 +99,7 @@ var CloseButtonIcon = function CloseButtonIcon(_ref)
 
 
 
-};exports.CloseButtonIcon = CloseButtonIcon;
+};exports.CloseButtonIcon = CloseButtonIcon;
+
+CloseButtonIcon.__KONTUR_REACT_UI__ = 'CloseButtonIcon';
+CloseButtonIcon.displayName = 'CloseButtonIcon';

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CloseButtonIcon.tsx"],"names":["CloseButtonIcon","side","DEFAULT_ICON_SIZE","size","color","colorHover","tabbable","style","rest","_theme","React","useContext","ThemeContext","theme","ThemeFactory","create","closeBtnIconColor","closeBtnIconHoverColor","useState","focusedByTab","setFocusedByTab","handleFocus","requestAnimationFrame","keyListener","isTabPressed","handleBlur","tabIndex","disabled","styles","root","focus","rootDisabled","width","height","wrapper"],"mappings":"2WAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,wC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCO,IAAMA,eAA8D,GAAG,SAAjEA,eAAiE;;;;;;;;AAQxE,sBAPJC,IAOI,CAPJA,IAOI,0BAPGC,gCAOH,8BANJC,IAMI,CANJA,IAMI,0BANGD,gCAMH,aALJE,KAKI,QALJA,KAKI,CAJJC,UAII,QAJJA,UAII,sBAHJC,QAGI,CAHJA,QAGI,8BAHO,IAGP,iBAFJC,KAEI,QAFJA,KAEI,CADDC,IACC;AACJ,MAAMC,MAAM,GAAGC,eAAMC,UAAN,CAAiBC,0BAAjB,CAAf;AACA,MAAMC,KAAK,GAAGC,2BAAaC,MAAb;AACZ;AACEC,IAAAA,iBAAiB,EAAEZ,KAAF,WAAEA,KAAF,GAAWK,MAAM,CAACO,iBADrC;AAEEC,IAAAA,sBAAsB,EAAEZ,UAAF,WAAEA,UAAF,GAAgBI,MAAM,CAACQ,sBAF/C,EADY;;AAKZR,EAAAA,MALY,CAAd;;AAOA,wBAAwCC,eAAMQ,QAAN,CAAe,KAAf,CAAxC,CAAOC,YAAP,sBAAqBC,eAArB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB;AACA;AACAC,IAAAA,qBAAqB,CAAC,YAAM;AAC1B,UAAIC,yBAAYC,YAAhB,EAA8B;AAC5BJ,QAAAA,eAAe,CAAC,IAAD,CAAf;AACD;AACF,KAJoB,CAArB;AAKD,GARD;AASA,MAAMK,UAAU,GAAG,SAAbA,UAAa,WAAML,eAAe,CAAC,KAAD,CAArB,EAAnB;;AAEA,MAAMM,QAAQ,GAAG,CAACpB,QAAD,IAAaE,IAAI,CAACmB,QAAlB,GAA6B,CAAC,CAA9B,GAAkC,CAAnD;;AAEA;AACE,iCAAC,4BAAD,EAAmBnB,IAAnB;AACE;AACE,MAAA,QAAQ,EAAEkB,QADZ;AAEE,MAAA,SAAS,EAAE;AACTE,8BAAOC,IAAP,CAAYhB,KAAZ,CADS;AAET,OAACL,IAAI,CAACmB,QAAN,IAAkBR,YAAlB,IAAkCS,wBAAOE,KAAP,CAAajB,KAAb,CAFzB;AAGTL,MAAAA,IAAI,CAACmB,QAAL,IAAiBC,wBAAOG,YAAP,CAAoBlB,KAApB,CAHR,CAFb;;AAOE,MAAA,KAAK,6BAAON,KAAP,IAAcyB,KAAK,EAAE/B,IAArB,EAA2BgC,MAAM,EAAEhC,IAAnC,GAPP;AAQE,MAAA,OAAO,EAAEoB,WARX;AASE,MAAA,MAAM,EAAEI,UATV;AAUMjB,IAAAA,IAVN;;AAYE,2CAAM,SAAS,EAAEoB,wBAAOM,OAAP,EAAjB;AACE,iCAAC,oBAAD,IAAW,IAAI,EAAEjC,IAAI,GAAGE,IAAP,GAAcF,IAAd,GAAqBE,IAAtC,EAA4C,SAAS,EAAEuB,QAAQ,IAAI,CAAnE,GADF,CAZF,CADF,CADF;;;;;AAoBD,CApDM,C","sourcesContent":["import React, { CSSProperties } from 'react';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { DEFAULT_ICON_SIZE } from '../icons2022/iconConstants';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../CommonWrapper';\n\nimport { styles } from './CloseButtonIcon.styles';\nimport { CrossIcon } from './CrossIcon';\n\nexport interface CloseButtonIconProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, CommonProps {\n  /**\n   * Ширина и высота иконки крестика\n   *\n   * @default 16\n   */\n  size?: number;\n  /**\n   * Ширина и высота всей кнопки\n   *\n   * @default 16\n   */\n  side?: number;\n  /**\n   * Цвет иконки\n   *\n   * Переменная темы: `closeBtnIconColor`\n   */\n  color?: CSSProperties['color'];\n  /**\n   * Цвет иконки при наведении мышью и при фокусе\n   *\n   * Переменная темы: `closeBtnIconHoverColor`\n   */\n  colorHover?: CSSProperties['color'];\n  /**\n   * Возможность сфокусироваться на кнопке клавишей TAB\n   *\n   * @default true\n   * */\n  tabbable?: boolean;\n}\n\nexport const CloseButtonIcon: React.FunctionComponent<CloseButtonIconProps> = ({\n  side = DEFAULT_ICON_SIZE,\n  size = DEFAULT_ICON_SIZE,\n  color,\n  colorHover,\n  tabbable = true,\n  style,\n  ...rest\n}) => {\n  const _theme = React.useContext(ThemeContext);\n  const theme = ThemeFactory.create(\n    {\n      closeBtnIconColor: color ?? _theme.closeBtnIconColor,\n      closeBtnIconHoverColor: colorHover ?? _theme.closeBtnIconHoverColor,\n    },\n    _theme,\n  );\n  const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener\n    // so we should check tabPressed in async way\n    requestAnimationFrame(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n  const handleBlur = () => setFocusedByTab(false);\n\n  const tabIndex = !tabbable || rest.disabled ? -1 : 0;\n\n  return (\n    <CommonWrapper {...rest}>\n      <button\n        tabIndex={tabIndex}\n        className={cx(\n          styles.root(theme),\n          !rest.disabled && focusedByTab && styles.focus(theme),\n          rest.disabled && styles.rootDisabled(theme),\n        )}\n        style={{ ...style, width: side, height: side }}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        {...rest}\n      >\n        <span className={styles.wrapper()}>\n          <CrossIcon size={side < size ? side : size} focusable={tabIndex >= 0} />\n        </span>\n      </button>\n    </CommonWrapper>\n  );\n};\n"]}
+{"version":3,"sources":["CloseButtonIcon.tsx"],"names":["CloseButtonIcon","side","DEFAULT_ICON_SIZE","size","color","colorHover","tabbable","style","rest","_theme","React","useContext","ThemeContext","theme","ThemeFactory","create","closeBtnIconColor","closeBtnIconHoverColor","useState","focusedByTab","setFocusedByTab","handleFocus","globalObject","requestAnimationFrame","keyListener","isTabPressed","handleBlur","tabIndex","disabled","styles","root","focus","rootDisabled","width","height","wrapper","__KONTUR_REACT_UI__","displayName"],"mappings":"mXAAA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,wC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCO,IAAMA,eAA8D,GAAG,SAAjEA,eAAiE;;;;;;;;AAQxE,sBAPJC,IAOI,CAPJA,IAOI,0BAPGC,gCAOH,8BANJC,IAMI,CANJA,IAMI,0BANGD,gCAMH,aALJE,KAKI,QALJA,KAKI,CAJJC,UAII,QAJJA,UAII,sBAHJC,QAGI,CAHJA,QAGI,8BAHO,IAGP,iBAFJC,KAEI,QAFJA,KAEI,CADDC,IACC;AACJ,MAAMC,MAAM,GAAGC,eAAMC,UAAN,CAAiBC,0BAAjB,CAAf;AACA,MAAMC,KAAK,GAAGC,2BAAaC,MAAb;AACZ;AACEC,IAAAA,iBAAiB,EAAEZ,KAAF,WAAEA,KAAF,GAAWK,MAAM,CAACO,iBADrC;AAEEC,IAAAA,sBAAsB,EAAEZ,UAAF,WAAEA,UAAF,GAAgBI,MAAM,CAACQ,sBAF/C,EADY;;AAKZR,EAAAA,MALY,CAAd;;AAOA,wBAAwCC,eAAMQ,QAAN,CAAe,KAAf,CAAxC,CAAOC,YAAP,sBAAqBC,eAArB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB;AACA;AACAC,+BAAaC,qBAAb,+CAAaA,qBAAb,CAAqC,YAAM;AACzC,UAAIC,yBAAYC,YAAhB,EAA8B;AAC5BL,QAAAA,eAAe,CAAC,IAAD,CAAf;AACD;AACF,KAJD;AAKD,GARD;AASA,MAAMM,UAAU,GAAG,SAAbA,UAAa,WAAMN,eAAe,CAAC,KAAD,CAArB,EAAnB;;AAEA,MAAMO,QAAQ,GAAG,CAACrB,QAAD,IAAaE,IAAI,CAACoB,QAAlB,GAA6B,CAAC,CAA9B,GAAkC,CAAnD;;AAEA;AACE,iCAAC,4BAAD,EAAmBpB,IAAnB;AACE;AACE,MAAA,QAAQ,EAAEmB,QADZ;AAEE,MAAA,SAAS,EAAE;AACTE,8BAAOC,IAAP,CAAYjB,KAAZ,CADS;AAET,OAACL,IAAI,CAACoB,QAAN,IAAkBT,YAAlB,IAAkCU,wBAAOE,KAAP,CAAalB,KAAb,CAFzB;AAGTL,MAAAA,IAAI,CAACoB,QAAL,IAAiBC,wBAAOG,YAAP,CAAoBnB,KAApB,CAHR,CAFb;;AAOE,MAAA,KAAK,6BAAON,KAAP,IAAc0B,KAAK,EAAEhC,IAArB,EAA2BiC,MAAM,EAAEjC,IAAnC,GAPP;AAQE,MAAA,OAAO,EAAEoB,WARX;AASE,MAAA,MAAM,EAAEK,UATV;AAUMlB,IAAAA,IAVN;;AAYE,2CAAM,SAAS,EAAEqB,wBAAOM,OAAP,EAAjB;AACE,iCAAC,oBAAD,IAAW,IAAI,EAAElC,IAAI,GAAGE,IAAP,GAAcF,IAAd,GAAqBE,IAAtC,EAA4C,SAAS,EAAEwB,QAAQ,IAAI,CAAnE,GADF,CAZF,CADF,CADF;;;;;AAoBD,CApDM,C;;AAsDP3B,eAAe,CAACoC,mBAAhB,GAAsC,iBAAtC;AACApC,eAAe,CAACqC,WAAhB,GAA8B,iBAA9B","sourcesContent":["import React, { AriaAttributes, CSSProperties } from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { DEFAULT_ICON_SIZE } from '../icons2022/iconConstants';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../CommonWrapper';\n\nimport { styles } from './CloseButtonIcon.styles';\nimport { CrossIcon } from './CrossIcon';\n\nexport interface CloseButtonIconProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    CommonProps {\n  /**\n   * Ширина и высота иконки крестика\n   *\n   * @default 16\n   */\n  size?: number;\n  /**\n   * Ширина и высота всей кнопки\n   *\n   * @default 16\n   */\n  side?: number;\n  /**\n   * Цвет иконки\n   *\n   * Переменная темы: `closeBtnIconColor`\n   */\n  color?: CSSProperties['color'];\n  /**\n   * Цвет иконки при наведении мышью и при фокусе\n   *\n   * Переменная темы: `closeBtnIconHoverColor`\n   */\n  colorHover?: CSSProperties['color'];\n  /**\n   * Возможность сфокусироваться на кнопке клавишей TAB\n   *\n   * @default true\n   * */\n  tabbable?: boolean;\n}\n\nexport const CloseButtonIcon: React.FunctionComponent<CloseButtonIconProps> = ({\n  side = DEFAULT_ICON_SIZE,\n  size = DEFAULT_ICON_SIZE,\n  color,\n  colorHover,\n  tabbable = true,\n  style,\n  ...rest\n}) => {\n  const _theme = React.useContext(ThemeContext);\n  const theme = ThemeFactory.create(\n    {\n      closeBtnIconColor: color ?? _theme.closeBtnIconColor,\n      closeBtnIconHoverColor: colorHover ?? _theme.closeBtnIconHoverColor,\n    },\n    _theme,\n  );\n  const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener\n    // so we should check tabPressed in async way\n    globalObject.requestAnimationFrame?.(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n  const handleBlur = () => setFocusedByTab(false);\n\n  const tabIndex = !tabbable || rest.disabled ? -1 : 0;\n\n  return (\n    <CommonWrapper {...rest}>\n      <button\n        tabIndex={tabIndex}\n        className={cx(\n          styles.root(theme),\n          !rest.disabled && focusedByTab && styles.focus(theme),\n          rest.disabled && styles.rootDisabled(theme),\n        )}\n        style={{ ...style, width: side, height: side }}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        {...rest}\n      >\n        <span className={styles.wrapper()}>\n          <CrossIcon size={side < size ? side : size} focusable={tabIndex >= 0} />\n        </span>\n      </button>\n    </CommonWrapper>\n  );\n};\n\nCloseButtonIcon.__KONTUR_REACT_UI__ = 'CloseButtonIcon';\nCloseButtonIcon.displayName = 'CloseButtonIcon';\n"]}

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.styles.js

@@ -1,16 +1,17 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
 
 var _Mixins = require("../../lib/styles/Mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
 var styles = (0, _Emotion.memoizeStyle)({
   root: function root(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "\n      display: inline-block;\n      position: relative;\n      border-radius: ", ";\n      color: ", ";\n      cursor: pointer;\n\n      &:enabled:focus,\n      &:enabled:hover {\n        color: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "\n      display: inline-block;\n      position: relative;\n      border-radius: ", ";\n      color: ", ";\n      cursor: pointer;\n      transition: color ", " ", ";\n\n      &:enabled:focus,\n      &:enabled:hover {\n        color: ", ";\n      }\n    "])),
     (0, _Mixins.resetButton)(),
 
 
     t.closeBtnIconBorderRadius,
     t.closeBtnIconColor,
 
+    t.transitionDuration, t.transitionTimingFunction,
 
 
 

package/cjs/internal/CloseButtonIcon/CloseButtonIcon.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CloseButtonIcon.styles.tsx"],"names":["styles","root","t","css","closeBtnIconBorderRadius","closeBtnIconColor","closeBtnIconHoverColor","rootDisabled","closeBtnIconDisabledColor","focus","closeBtnIconFocusShadow","wrapper"],"mappings":"4QAAA;;AAEA,iD;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;AACI,8BADJ;;;AAImBD,IAAAA,CAAC,CAACE,wBAJrB;AAKWF,IAAAA,CAAC,CAACG,iBALb;;;;;AAUaH,IAAAA,CAAC,CAACI,sBAVf;;;AAaD,GAfgC;AAgBjCC,EAAAA,YAhBiC,wBAgBpBL,CAhBoB,EAgBV;AACrB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACM,yBADb;;AAGD,GApBgC;AAqBjCC,EAAAA,KArBiC,iBAqB3BP,CArB2B,EAqBjB;AACd,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACQ,uBADlB;;AAGD,GAzBgC;AA0BjCC,EAAAA,OA1BiC,qBA0BvB;AACR,eAAOR,YAAP;;;;;;;;;AASD,GApCgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      ${resetButton()}\n      display: inline-block;\n      position: relative;\n      border-radius: ${t.closeBtnIconBorderRadius};\n      color: ${t.closeBtnIconColor};\n      cursor: pointer;\n\n      &:enabled:focus,\n      &:enabled:hover {\n        color: ${t.closeBtnIconHoverColor};\n      }\n    `;\n  },\n  rootDisabled(t: Theme) {\n    return css`\n      color: ${t.closeBtnIconDisabledColor};\n    `;\n  },\n  focus(t: Theme) {\n    return css`\n      box-shadow: ${t.closeBtnIconFocusShadow};\n    `;\n  },\n  wrapper() {\n    return css`\n      box-sizing: content-box;\n      display: flex;\n      width: 100%;\n      height: 100%;\n      align-items: center;\n      justify-content: center;\n      pointer-events: none;\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["CloseButtonIcon.styles.tsx"],"names":["styles","root","t","css","closeBtnIconBorderRadius","closeBtnIconColor","transitionDuration","transitionTimingFunction","closeBtnIconHoverColor","rootDisabled","closeBtnIconDisabledColor","focus","closeBtnIconFocusShadow","wrapper"],"mappings":"oRAAA;;AAEA,iD;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;AACI,8BADJ;;;AAImBD,IAAAA,CAAC,CAACE,wBAJrB;AAKWF,IAAAA,CAAC,CAACG,iBALb;;AAOsBH,IAAAA,CAAC,CAACI,kBAPxB,EAO8CJ,CAAC,CAACK,wBAPhD;;;;AAWaL,IAAAA,CAAC,CAACM,sBAXf;;;AAcD,GAhBgC;AAiBjCC,EAAAA,YAjBiC,wBAiBpBP,CAjBoB,EAiBV;AACrB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACQ,yBADb;;AAGD,GArBgC;AAsBjCC,EAAAA,KAtBiC,iBAsB3BT,CAtB2B,EAsBjB;AACd,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACU,uBADlB;;AAGD,GA1BgC;AA2BjCC,EAAAA,OA3BiC,qBA2BvB;AACR,eAAOV,YAAP;;;;;;;;;AASD,GArCgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      ${resetButton()}\n      display: inline-block;\n      position: relative;\n      border-radius: ${t.closeBtnIconBorderRadius};\n      color: ${t.closeBtnIconColor};\n      cursor: pointer;\n      transition: color ${t.transitionDuration} ${t.transitionTimingFunction};\n\n      &:enabled:focus,\n      &:enabled:hover {\n        color: ${t.closeBtnIconHoverColor};\n      }\n    `;\n  },\n  rootDisabled(t: Theme) {\n    return css`\n      color: ${t.closeBtnIconDisabledColor};\n    `;\n  },\n  focus(t: Theme) {\n    return css`\n      box-shadow: ${t.closeBtnIconFocusShadow};\n    `;\n  },\n  wrapper() {\n    return css`\n      box-sizing: content-box;\n      display: flex;\n      width: 100%;\n      height: 100%;\n      align-items: center;\n      justify-content: center;\n      pointer-events: none;\n    `;\n  },\n});\n"]}

package/cjs/internal/CloseButtonIcon/CrossIcon.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.CrossIcon = void 0;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.CrossIcon = void 0;
 var _react = _interopRequireDefault(require("react"));
 
 var _iconSizer = require("../icons2022/iconSizer");

package/cjs/internal/CommonWrapper/CommonWrapper.d.ts

@@ -1,33 +1,12 @@
 import React from 'react';
-import { Nullable } from '../../typings/utility-types';
-export interface CommonProps {
-    /**
-     * HTML-атрибут `class`.
-     */
-    className?: React.HTMLAttributes<HTMLElement>['className'];
-    /**
-     * HTML-атрибут `style`.
-     */
-    style?: React.HTMLAttributes<HTMLElement>['style'];
-    /**
-     * На равне с data-tid транслируются любые data-атрибуты. Они попадают на корневой элемент.
-     */
-    'data-tid'?: string;
-    children?: React.ReactNode;
-}
-interface CommonPropsRootNodeRef {
-    rootNodeRef?: (instance: Nullable<Element>) => void;
-}
-export declare type NotCommonProps<P> = Omit<P, keyof CommonProps>;
-export declare type CommonWrapperProps<P> = P & {
-    children: React.ReactNode | ((rest: CommonWrapperRestProps<P>) => React.ReactNode);
-};
-export declare type CommonWrapperRestProps<P> = Omit<NotCommonProps<P>, 'children'>;
-export declare class CommonWrapper<P extends CommonProps & CommonPropsRootNodeRef> extends React.Component<CommonWrapperProps<P> & CommonPropsRootNodeRef> {
+import type { CommonProps, CommonPropsRootNodeRef, CommonWrapperProps } from './types';
+export declare type CommonPropsWithRootNodeRef = CommonProps & CommonPropsRootNodeRef;
+export declare class CommonWrapper<P extends CommonPropsWithRootNodeRef> extends React.Component<CommonWrapperProps<P> & CommonPropsRootNodeRef> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     private child;
     private setRootNode;
     private rootNodeSubscription;
     render(): React.ReactNode;
     private ref;
 }
-export {};

package/cjs/internal/CommonWrapper/CommonWrapper.js

@@ -1,16 +1,19 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.CommonWrapper = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.CommonWrapper = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
 var _utils = require("../../lib/utils");
 var _Emotion = require("../../lib/theming/Emotion");
 
 var _rootNode = require("../../lib/rootNode");
-var _callChildRef = require("../../lib/callChildRef/callChildRef");var _excluded = ["className", "style", "children", "rootNodeRef"];var _class;var
+var _callChildRef = require("../../lib/callChildRef/callChildRef");
 
 
+var _extractCommonProps2 = require("./extractCommonProps");
+var _getCommonVisualStateDataAttributes = require("./getCommonVisualStateDataAttributes");var _excluded = ["className", "style", "children", "rootNodeRef"];var _class, _class2, _temp;var
 
 
 
 
+CommonWrapper = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(CommonWrapper, _React$Component);function CommonWrapper() {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.
 
 
 
@@ -18,27 +21,6 @@ var _callChildRef = require("../../lib/callChildRef/callChildRef");var _excluded
 
 
 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-CommonWrapper = (0, _rootNode.rootNode)(_class = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(CommonWrapper, _React$Component);function CommonWrapper() {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.
-
-
-
-
     rootNodeSubscription = null;_this.
 
 
@@ -58,11 +40,12 @@ CommonWrapper = (0, _rootNode.rootNode)(_class = /*#__PURE__*/function (_React$C
 
 
 
+
     ref = function (instance) {var _this$rootNodeSubscri, _this$child;
       _this.setRootNode(instance);
       _this.props.rootNodeRef == null ? void 0 : _this.props.rootNodeRef((0, _rootNode.getRootNode)(instance));
 
-      // refs are called when instances change
+      // refs are called when instances change,
       // so we have to renew or remove old subscription
       (_this$rootNodeSubscri = _this.rootNodeSubscription) == null ? void 0 : _this$rootNodeSubscri.remove();
       _this.rootNodeSubscription = null;
@@ -77,36 +60,4 @@ CommonWrapper = (0, _rootNode.rootNode)(_class = /*#__PURE__*/function (_React$C
       var originalRef = (_this$child = _this.child) == null ? void 0 : _this$child.ref;
       originalRef && (0, _callChildRef.callChildRef)(originalRef, instance);
     };return _this;}var _proto = CommonWrapper.prototype;_proto.render = function render() {// eslint-disable-next-line @typescript-eslint/no-unused-vars
-    var _extractCommonProps = extractCommonProps(this.props),_extractCommonProps$ = _extractCommonProps[0],className = _extractCommonProps$.className,style = _extractCommonProps$.style,children = _extractCommonProps$.children,rootNodeRef = _extractCommonProps$.rootNodeRef,dataProps = (0, _objectWithoutPropertiesLoose2.default)(_extractCommonProps$, _excluded),rest = (0, _extends2.default)({}, _extractCommonProps[1]);this.child = (0, _utils.isFunction)(children) ? children(rest) : children;return /*#__PURE__*/_react.default.isValidElement(this.child) ? /*#__PURE__*/_react.default.cloneElement(this.child, (0, _extends2.default)({ ref: (0, _utils.isRefableElement)(this.child) ? this.ref : null, className: (0, _Emotion.cx)(this.child.props.className, className), style: (0, _extends2.default)({}, this.child.props.style, style) }, dataProps)) : this.child;};return CommonWrapper;}(_react.default.Component)) || _class;exports.CommonWrapper = CommonWrapper;
-
-var extractCommonProps = function extractCommonProps(
-props)
-{
-  var common = {};
-  var rest = {};
-
-  for (var key in props) {
-    if (isCommonProp(key)) {
-      // @ts-expect-error: See: https://github.com/skbkontur/retail-ui/pull/2257#discussion_r565275843 and https://github.com/skbkontur/retail-ui/pull/2257#discussion_r569542736.
-      common[key] = props[key];
-    } else {
-      // @ts-expect-error: Read the comment above.
-      rest[key] = props[key];
-    }
-  }
-
-  return [common, rest];
-};
-
-var isCommonProp = function isCommonProp(name) {
-  switch (true) {
-    case name === 'className':
-    case name === 'style':
-    case name === 'rootNodeRef':
-    case name === 'children':
-    case name.indexOf('data-') === 0: // все data-атрибуты
-      return true;
-    default:
-      return false;}
-
-};
+    var _extractCommonProps = (0, _extractCommonProps2.extractCommonProps)(this.props),_extractCommonProps$ = _extractCommonProps[0],className = _extractCommonProps$.className,style = _extractCommonProps$.style,children = _extractCommonProps$.children,rootNodeRef = _extractCommonProps$.rootNodeRef,dataProps = (0, _objectWithoutPropertiesLoose2.default)(_extractCommonProps$, _excluded),rest = (0, _extends2.default)({}, _extractCommonProps[1]);this.child = (0, _utils.isFunction)(children) ? children(rest) : children;return /*#__PURE__*/_react.default.isValidElement(this.child) ? /*#__PURE__*/_react.default.cloneElement(this.child, (0, _extends2.default)({ ref: (0, _utils.isRefableElement)(this.child) ? this.ref : null, className: (0, _Emotion.cx)(this.child.props.className, className), style: (0, _extends2.default)({}, this.child.props.style, style) }, (0, _getCommonVisualStateDataAttributes.getCommonVisualStateDataAttributes)(rest), dataProps)) : this.child;};return CommonWrapper;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'CommonWrapper', _class2.displayName = 'CommonWrapper', _temp)) || _class;exports.CommonWrapper = CommonWrapper;

package/cjs/internal/CommonWrapper/CommonWrapper.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CommonWrapper.tsx"],"names":["CommonWrapper","rootNode","rootNodeSubscription","ref","instance","setRootNode","props","rootNodeRef","remove","addRootNodeChangeListener","node","originalRef","child","render","extractCommonProps","className","style","children","dataProps","rest","isValidElement","React","cloneElement","Component","common","key","isCommonProp","name","indexOf"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isFunction, isRefableElement } from '../../lib/utils';\nimport { cx } from '../../lib/theming/Emotion';\nimport { Nullable } from '../../typings/utility-types';\nimport { getRootNode, rootNode, TSetRootNode, TRootNodeSubscription, isInstanceWithRootNode } from '../../lib/rootNode';\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\n\nexport interface CommonProps {\n  /**\n   * HTML-атрибут `class`.\n   */\n  className?: React.HTMLAttributes<HTMLElement>['className'];\n  /**\n   * HTML-атрибут `style`.\n   */\n  style?: React.HTMLAttributes<HTMLElement>['style'];\n  /**\n   * На равне с data-tid транслируются любые data-атрибуты. Они попадают на корневой элемент.\n   */\n  'data-tid'?: string;\n  children?: React.ReactNode;\n}\n\ninterface CommonPropsRootNodeRef {\n  rootNodeRef?: (instance: Nullable<Element>) => void;\n}\n\nexport type NotCommonProps<P> = Omit<P, keyof CommonProps>;\n\nexport type CommonWrapperProps<P> = P & {\n  children: React.ReactNode | ((rest: CommonWrapperRestProps<P>) => React.ReactNode);\n};\nexport type CommonWrapperRestProps<P> = Omit<NotCommonProps<P>, 'children'>;\n\n@rootNode\nexport class CommonWrapper<P extends CommonProps & CommonPropsRootNodeRef> extends React.Component<\n  CommonWrapperProps<P> & CommonPropsRootNodeRef\n> {\n  private child: React.ReactNode;\n  private setRootNode!: TSetRootNode;\n  private rootNodeSubscription: Nullable<TRootNodeSubscription> = null;\n\n  render() {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const [{ className, style, children, rootNodeRef, ...dataProps }, { ...rest }] = extractCommonProps(this.props);\n    this.child = isFunction(children) ? children(rest) : children;\n    return React.isValidElement<CommonProps & React.RefAttributes<any>>(this.child)\n      ? React.cloneElement(this.child, {\n          ref: isRefableElement(this.child) ? this.ref : null,\n          className: cx(this.child.props.className, className),\n          style: {\n            ...this.child.props.style,\n            ...style,\n          },\n          ...dataProps,\n        })\n      : this.child;\n  }\n\n  private ref = (instance: Nullable<React.ReactInstance>) => {\n    this.setRootNode(instance);\n    this.props.rootNodeRef?.(getRootNode(instance));\n\n    // refs are called when instances change\n    // so we have to renew or remove old subscription\n    this.rootNodeSubscription?.remove();\n    this.rootNodeSubscription = null;\n\n    if (instance && isInstanceWithRootNode(instance)) {\n      this.rootNodeSubscription = instance.addRootNodeChangeListener?.((node) => {\n        this.setRootNode(node);\n        this.props.rootNodeRef?.(node);\n      });\n    }\n\n    const originalRef = (this.child as React.RefAttributes<any>)?.ref;\n    originalRef && callChildRef(originalRef, instance);\n  };\n}\n\nconst extractCommonProps = <P extends CommonProps & CommonPropsRootNodeRef>(\n  props: P,\n): [CommonProps & CommonPropsRootNodeRef, NotCommonProps<P>] => {\n  const common = {} as CommonProps & CommonPropsRootNodeRef;\n  const rest = {} as NotCommonProps<P>;\n\n  for (const key in props) {\n    if (isCommonProp(key)) {\n      // @ts-expect-error: See: https://github.com/skbkontur/retail-ui/pull/2257#discussion_r565275843 and https://github.com/skbkontur/retail-ui/pull/2257#discussion_r569542736.\n      common[key] = props[key];\n    } else {\n      // @ts-expect-error: Read the comment above.\n      rest[key] = props[key];\n    }\n  }\n\n  return [common, rest];\n};\n\nconst isCommonProp = (name: string) => {\n  switch (true) {\n    case name === 'className':\n    case name === 'style':\n    case name === 'rootNodeRef':\n    case name === 'children':\n    case name.indexOf('data-') === 0: // все data-атрибуты\n      return true;\n    default:\n      return false;\n  }\n};\n"]}
+{"version":3,"sources":["CommonWrapper.tsx"],"names":["CommonWrapper","rootNode","rootNodeSubscription","ref","instance","setRootNode","props","rootNodeRef","remove","addRootNodeChangeListener","node","originalRef","child","render","className","style","children","dataProps","rest","isValidElement","React","cloneElement","Component","__KONTUR_REACT_UI__","displayName"],"mappings":"+cAAA;;AAEA;AACA;;AAEA;AACA;;;AAGA;AACA,0F;;;;;AAKaA,a,OADZC,kB;;;;;;;;AASSC,IAAAA,oB,GAAwD,I;;;;;;;;;;;;;;;;;;;;AAoBxDC,IAAAA,G,GAAM,UAACC,QAAD,EAA6C;AACzD,YAAKC,WAAL,CAAiBD,QAAjB;AACA,YAAKE,KAAL,CAAWC,WAAX,0BAAKD,KAAL,CAAWC,WAAX,CAAyB,2BAAYH,QAAZ,CAAzB;;AAEA;AACA;AACA,qCAAKF,oBAAL,2CAA2BM,MAA3B;AACA,YAAKN,oBAAL,GAA4B,IAA5B;;AAEA,UAAIE,QAAQ,IAAI,sCAAuBA,QAAvB,CAAhB,EAAkD;AAChD,cAAKF,oBAAL,GAA4BE,QAAQ,CAACK,yBAArC,oBAA4BL,QAAQ,CAACK,yBAAT,CAAqC,UAACC,IAAD,EAAU;AACzE,gBAAKL,WAAL,CAAiBK,IAAjB;AACA,gBAAKJ,KAAL,CAAWC,WAAX,0BAAKD,KAAL,CAAWC,WAAX,CAAyBG,IAAzB;AACD,SAH2B,CAA5B;AAID;;AAED,UAAMC,WAAW,kBAAI,MAAKC,KAAT,qBAAG,YAA0CT,GAA9D;AACAQ,MAAAA,WAAW,IAAI,gCAAaA,WAAb,EAA0BP,QAA1B,CAAf;AACD,K,2DApCDS,M,GAAA,kBAAS,CACP;AACA,8BAAiF,6CAAmB,KAAKP,KAAxB,CAAjF,+CAASQ,SAAT,wBAASA,SAAT,CAAoBC,KAApB,wBAAoBA,KAApB,CAA2BC,QAA3B,wBAA2BA,QAA3B,CAAqCT,WAArC,wBAAqCA,WAArC,CAAqDU,SAArD,gFAAuEC,IAAvE,sDACA,KAAKN,KAAL,GAAa,uBAAWI,QAAX,IAAuBA,QAAQ,CAACE,IAAD,CAA/B,GAAwCF,QAArD,CACA,OAAO,4BAAMG,cAAN,CAA6D,KAAKP,KAAlE,iBACHQ,eAAMC,YAAN,CAAmB,KAAKT,KAAxB,2BACET,GAAG,EAAE,6BAAiB,KAAKS,KAAtB,IAA+B,KAAKT,GAApC,GAA0C,IADjD,EAEEW,SAAS,EAAE,iBAAG,KAAKF,KAAL,CAAWN,KAAX,CAAiBQ,SAApB,EAA+BA,SAA/B,CAFb,EAGEC,KAAK,6BACA,KAAKH,KAAL,CAAWN,KAAX,CAAiBS,KADjB,EAEAA,KAFA,CAHP,IAOK,4EAAmCG,IAAnC,CAPL,EAQKD,SARL,EADG,GAWH,KAAKL,KAXT,CAYD,C,wBA1BsEQ,eAAME,S,WAG/DC,mB,GAAsB,e,UACtBC,W,GAAc,e","sourcesContent":["import React from 'react';\n\nimport { isFunction, isRefableElement } from '../../lib/utils';\nimport { cx } from '../../lib/theming/Emotion';\nimport { Nullable } from '../../typings/utility-types';\nimport { getRootNode, isInstanceWithRootNode, rootNode, TRootNodeSubscription, TSetRootNode } from '../../lib/rootNode';\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\n\nimport type { CommonProps, CommonPropsRootNodeRef, CommonWrapperProps } from './types';\nimport { extractCommonProps } from './extractCommonProps';\nimport { getCommonVisualStateDataAttributes } from './getCommonVisualStateDataAttributes';\n\nexport type CommonPropsWithRootNodeRef = CommonProps & CommonPropsRootNodeRef;\n\n@rootNode\nexport class CommonWrapper<P extends CommonPropsWithRootNodeRef> extends React.Component<\n  CommonWrapperProps<P> & CommonPropsRootNodeRef\n> {\n  public static __KONTUR_REACT_UI__ = 'CommonWrapper';\n  public static displayName = 'CommonWrapper';\n\n  private child: React.ReactNode;\n  private setRootNode!: TSetRootNode;\n  private rootNodeSubscription: Nullable<TRootNodeSubscription> = null;\n\n  render() {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const [{ className, style, children, rootNodeRef, ...dataProps }, { ...rest }] = extractCommonProps(this.props);\n    this.child = isFunction(children) ? children(rest) : children;\n    return React.isValidElement<CommonProps & React.RefAttributes<any>>(this.child)\n      ? React.cloneElement(this.child, {\n          ref: isRefableElement(this.child) ? this.ref : null,\n          className: cx(this.child.props.className, className),\n          style: {\n            ...this.child.props.style,\n            ...style,\n          },\n          ...getCommonVisualStateDataAttributes(rest),\n          ...dataProps,\n        })\n      : this.child;\n  }\n\n  private ref = (instance: Nullable<React.ReactInstance>) => {\n    this.setRootNode(instance);\n    this.props.rootNodeRef?.(getRootNode(instance));\n\n    // refs are called when instances change,\n    // so we have to renew or remove old subscription\n    this.rootNodeSubscription?.remove();\n    this.rootNodeSubscription = null;\n\n    if (instance && isInstanceWithRootNode(instance)) {\n      this.rootNodeSubscription = instance.addRootNodeChangeListener?.((node) => {\n        this.setRootNode(node);\n        this.props.rootNodeRef?.(node);\n      });\n    }\n\n    const originalRef = (this.child as React.RefAttributes<any>)?.ref;\n    originalRef && callChildRef(originalRef, instance);\n  };\n}\n"]}

package/cjs/internal/CommonWrapper/extractCommonProps.d.ts

@@ -0,0 +1,3 @@
+import type { NotCommonProps } from './types';
+import type { CommonPropsWithRootNodeRef } from './CommonWrapper';
+export declare const extractCommonProps: <P extends CommonPropsWithRootNodeRef>(props: P) => [CommonPropsWithRootNodeRef, NotCommonProps<P>];

package/cjs/internal/CommonWrapper/extractCommonProps.js

@@ -0,0 +1,34 @@
+"use strict";exports.__esModule = true;exports.extractCommonProps = void 0;
+
+
+var extractCommonProps = function extractCommonProps(
+props)
+{
+  var common = {};
+  var rest = {};
+
+  for (var prop in props) {
+    if (isCommonProp(prop)) {
+      // @ts-expect-error: See: https://github.com/skbkontur/retail-ui/pull/2257#discussion_r565275843 and https://github.com/skbkontur/retail-ui/pull/2257#discussion_r569542736.
+      common[prop] = props[prop];
+    } else {
+      // @ts-expect-error: Read the comment above.
+      rest[prop] = props[prop];
+    }
+  }
+
+  return [common, rest];
+};exports.extractCommonProps = extractCommonProps;
+
+var isCommonProp = function isCommonProp(prop) {
+  switch (true) {
+    case prop === 'className':
+    case prop === 'style':
+    case prop === 'rootNodeRef':
+    case prop === 'children':
+    case prop.indexOf('data-') === 0: // все data-атрибуты
+      return true;
+    default:
+      return false;}
+
+};

package/cjs/internal/CommonWrapper/extractCommonProps.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["extractCommonProps.ts"],"names":["extractCommonProps","props","common","rest","prop","isCommonProp","indexOf"],"mappings":";;;AAGO,IAAMA,kBAAkB,GAAG,SAArBA,kBAAqB;AAChCC,KADgC;AAEoB;AACpD,MAAMC,MAAM,GAAG,EAAf;AACA,MAAMC,IAAI,GAAG,EAAb;;AAEA,OAAK,IAAMC,IAAX,IAAmBH,KAAnB,EAA0B;AACxB,QAAII,YAAY,CAACD,IAAD,CAAhB,EAA4D;AAC1D;AACAF,MAAAA,MAAM,CAACE,IAAD,CAAN,GAAeH,KAAK,CAACG,IAAD,CAApB;AACD,KAHD,MAGO;AACL;AACAD,MAAAA,IAAI,CAACC,IAAD,CAAJ,GAAaH,KAAK,CAACG,IAAD,CAAlB;AACD;AACF;;AAED,SAAO,CAACF,MAAD,EAASC,IAAT,CAAP;AACD,CAjBM,C;;AAmBP,IAAME,YAAY,GAAG,SAAfA,YAAe,CAACD,IAAD,EAA4C;AAC/D,UAAQ,IAAR;AACE,SAAKA,IAAI,KAAK,WAAd;AACA,SAAKA,IAAI,KAAK,OAAd;AACA,SAAKA,IAAI,KAAK,aAAd;AACA,SAAKA,IAAI,KAAK,UAAd;AACA,SAAKA,IAAI,CAACE,OAAL,CAAa,OAAb,MAA0B,CAA/B,EAAkC;AAChC,aAAO,IAAP;AACF;AACE,aAAO,KAAP,CARJ;;AAUD,CAXD","sourcesContent":["import type { NotCommonProps } from './types';\nimport type { CommonPropsWithRootNodeRef } from './CommonWrapper';\n\nexport const extractCommonProps = <P extends CommonPropsWithRootNodeRef>(\n  props: P,\n): [CommonPropsWithRootNodeRef, NotCommonProps<P>] => {\n  const common = {} as CommonPropsWithRootNodeRef;\n  const rest = {} as NotCommonProps<P>;\n\n  for (const prop in props) {\n    if (isCommonProp(prop as keyof CommonPropsWithRootNodeRef)) {\n      // @ts-expect-error: See: https://github.com/skbkontur/retail-ui/pull/2257#discussion_r565275843 and https://github.com/skbkontur/retail-ui/pull/2257#discussion_r569542736.\n      common[prop] = props[prop];\n    } else {\n      // @ts-expect-error: Read the comment above.\n      rest[prop] = props[prop];\n    }\n  }\n\n  return [common, rest];\n};\n\nconst isCommonProp = (prop: keyof CommonPropsWithRootNodeRef) => {\n  switch (true) {\n    case prop === 'className':\n    case prop === 'style':\n    case prop === 'rootNodeRef':\n    case prop === 'children':\n    case prop.indexOf('data-') === 0: // все data-атрибуты\n      return true;\n    default:\n      return false;\n  }\n};\n"]}

package/cjs/internal/CommonWrapper/getCommonVisualStateDataAttributes.d.ts

@@ -0,0 +1,2 @@
+import { VisualStateDataAttributesResultType } from './getVisualStateDataAttributes';
+export declare function getCommonVisualStateDataAttributes(componentProps: Record<string, unknown>): VisualStateDataAttributesResultType;

package/cjs/internal/CommonWrapper/getCommonVisualStateDataAttributes.js

@@ -0,0 +1,12 @@
+"use strict";exports.__esModule = true;exports.getCommonVisualStateDataAttributes = getCommonVisualStateDataAttributes;var _getVisualStateDataAttributes = require("./getVisualStateDataAttributes");
+
+var tryGetBoolean = function tryGetBoolean(value) {return typeof value === 'boolean' ? value : undefined;};
+
+function getCommonVisualStateDataAttributes(
+componentProps)
+{
+  return (0, _getVisualStateDataAttributes.getVisualStateDataAttributes)({
+    error: tryGetBoolean(componentProps['error']),
+    warning: tryGetBoolean(componentProps['warning']) });
+
+}

package/cjs/internal/CommonWrapper/getCommonVisualStateDataAttributes.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["getCommonVisualStateDataAttributes.ts"],"names":["tryGetBoolean","value","undefined","getCommonVisualStateDataAttributes","componentProps","error","warning"],"mappings":"uHAAA;;AAEA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,UAA0C,OAAOA,KAAP,KAAiB,SAAjB,GAA6BA,KAA7B,GAAqCC,SAA/E,EAAtB;;AAEO,SAASC,kCAAT;AACLC,cADK;AAEgC;AACrC,SAAO,gEAA6B;AAClCC,IAAAA,KAAK,EAAEL,aAAa,CAACI,cAAc,CAAC,OAAD,CAAf,CADc;AAElCE,IAAAA,OAAO,EAAEN,aAAa,CAACI,cAAc,CAAC,SAAD,CAAf,CAFY,EAA7B,CAAP;;AAID","sourcesContent":["import { getVisualStateDataAttributes, VisualStateDataAttributesResultType } from './getVisualStateDataAttributes';\n\nconst tryGetBoolean = (value: unknown): boolean | undefined => (typeof value === 'boolean' ? value : undefined);\n\nexport function getCommonVisualStateDataAttributes(\n  componentProps: Record<string, unknown>,\n): VisualStateDataAttributesResultType {\n  return getVisualStateDataAttributes({\n    error: tryGetBoolean(componentProps['error']),\n    warning: tryGetBoolean(componentProps['warning']),\n  });\n}\n"]}

package/cjs/internal/CommonWrapper/getVisualStateDataAttributes.d.ts

@@ -0,0 +1,3 @@
+import type { Nullable } from '../../typings/utility-types';
+export declare type VisualStateDataAttributesResultType = Record<string, string>;
+export declare function getVisualStateDataAttributes<T extends Record<string, Nullable<boolean>>>(attributes: T): VisualStateDataAttributesResultType;

package/cjs/internal/CommonWrapper/getVisualStateDataAttributes.js

@@ -0,0 +1,23 @@
+"use strict";exports.__esModule = true;exports.getVisualStateDataAttributes = getVisualStateDataAttributes;var _toKebabCase = require("../../lib/toKebabCase");
+
+
+
+
+var prefix = "data-visual-state-";
+
+function fillResult(result, key, value) {
+  if (value !== null && value !== undefined) {
+    result["" + prefix + (0, _toKebabCase.toKebabCase)(key)] = String(value);
+  }
+
+  return result;
+}
+
+function getVisualStateDataAttributes(
+attributes)
+{
+  return Object.entries(attributes).reduce(
+  function (previousValue, currentValue) {return fillResult(previousValue, currentValue[0], currentValue[1]);},
+  {});
+
+}

package/cjs/internal/CommonWrapper/getVisualStateDataAttributes.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["getVisualStateDataAttributes.ts"],"names":["prefix","fillResult","result","key","value","undefined","String","getVisualStateDataAttributes","attributes","Object","entries","reduce","previousValue","currentValue"],"mappings":"2GAAA;;;;;AAKA,IAAMA,MAAM,uBAAZ;;AAEA,SAASC,UAAT,CAAoBC,MAApB,EAAiEC,GAAjE,EAA8EC,KAA9E,EAA8F;AAC5F,MAAIA,KAAK,KAAK,IAAV,IAAkBA,KAAK,KAAKC,SAAhC,EAA2C;AACzCH,IAAAA,MAAM,MAAIF,MAAJ,GAAa,8BAAYG,GAAZ,CAAb,CAAN,GAAyCG,MAAM,CAACF,KAAD,CAA/C;AACD;;AAED,SAAOF,MAAP;AACD;;AAEM,SAASK,4BAAT;AACLC,UADK;AAEgC;AACrC,SAAOC,MAAM,CAACC,OAAP,CAAeF,UAAf,EAA2BG,MAA3B;AACL,YAACC,aAAD,EAAgBC,YAAhB,UAAiCZ,UAAU,CAACW,aAAD,EAAgBC,YAAY,CAAC,CAAD,CAA5B,EAAiCA,YAAY,CAAC,CAAD,CAA7C,CAA3C,EADK;AAEL,IAFK,CAAP;;AAID","sourcesContent":["import { toKebabCase } from '../../lib/toKebabCase';\nimport type { Nullable } from '../../typings/utility-types';\n\nexport type VisualStateDataAttributesResultType = Record<string, string>;\n\nconst prefix = `data-visual-state-`;\n\nfunction fillResult(result: VisualStateDataAttributesResultType, key: string, value: unknown) {\n  if (value !== null && value !== undefined) {\n    result[`${prefix}${toKebabCase(key)}`] = String(value);\n  }\n\n  return result;\n}\n\nexport function getVisualStateDataAttributes<T extends Record<string, Nullable<boolean>>>(\n  attributes: T,\n): VisualStateDataAttributesResultType {\n  return Object.entries(attributes).reduce(\n    (previousValue, currentValue) => fillResult(previousValue, currentValue[0], currentValue[1]),\n    {},\n  );\n}\n"]}

package/cjs/internal/CommonWrapper/index.d.ts

@@ -1 +1,3 @@
 export * from './CommonWrapper';
+export type { CommonWrapperRestProps } from './types';
+export type { CommonProps } from './types';

package/cjs/internal/CommonWrapper/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.tsx"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './CommonWrapper';\n"]}
+{"version":3,"sources":["index.tsx"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './CommonWrapper';\nexport type { CommonWrapperRestProps } from './types';\nexport type { CommonProps } from './types';\n"]}

package/cjs/internal/CommonWrapper/types.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import type { Nullable } from '../../typings/utility-types';
+export interface CommonProps {
+    /**
+     * HTML-атрибут `class`.
+     */
+    className?: React.HTMLAttributes<HTMLElement>['className'];
+    /**
+     * HTML-атрибут `style`.
+     */
+    style?: React.HTMLAttributes<HTMLElement>['style'];
+    /**
+     * На равне с data-tid транслируются любые data-атрибуты. Они попадают на корневой элемент.
+     */
+    'data-tid'?: string;
+    children?: React.ReactNode;
+}
+export interface CommonPropsRootNodeRef {
+    rootNodeRef?: (instance: Nullable<Element>) => void;
+}
+export declare type NotCommonProps<P> = Omit<P, keyof CommonProps>;
+export declare type CommonWrapperProps<P> = P & {
+    children: React.ReactNode | ((rest: CommonWrapperRestProps<P>) => React.ReactNode);
+};
+export declare type CommonWrapperRestProps<P> = Omit<NotCommonProps<P>, 'children'>;

package/cjs/internal/CommonWrapper/types.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;

package/cjs/internal/CommonWrapper/types.js.map

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

package/cjs/internal/ComponentCombinator.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ComponentCombinator = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ComponentCombinator = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
 
 var _createPropsGetter = require("../lib/createPropsGetter");

package/cjs/internal/ComponentCombinator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ComponentCombinator.tsx"],"names":["ComponentCombinator","getProps","defaultProps","state","page","prevPage","setState","nextPage","render","props","combinations","Component","presetProps","presetState","pages","row","sizes","map","c","length","flatCombinations","concat","j","push","offsetX","offsetY","pageOffsets","marginBottom","slice","React"],"mappings":"+PAAA;;;AAGA;;AAEA,kD;;;;;;;;;;;AAWaA,mB;;;;;;;;;;;;;AAaHC,IAAAA,Q,GAAW,0CAAkBD,mBAAmB,CAACE,YAAtC,C;;AAEZC,IAAAA,K,GAAQ;AACbC,MAAAA,IAAI,EAAE,CADO,E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDPC,IAAAA,Q,GAAW,YAAM;AACvB,YAAKC,QAAL,CAAc,qBAAGF,IAAH,QAAGA,IAAH,QAAe;AAC3BA,UAAAA,IAAI,EAAEA,IAAI,GAAG,CADc,EAAf,EAAd;;AAGD,K;;AAEOG,IAAAA,Q,GAAW,YAAM;AACvB,YAAKD,QAAL,CAAc,sBAAGF,IAAH,SAAGA,IAAH,QAAe;AAC3BA,UAAAA,IAAI,EAAEA,IAAI,GAAG,CADc,EAAf,EAAd;;AAGD,K,iEAtDMI,M,GAAP,kBAAgB,WACd,IAAQJ,IAAR,GAAiB,KAAKD,KAAtB,CAAQC,IAAR,CACA,kBAAoC,KAAKK,KAAzC,CAAQC,YAAR,eAAQA,YAAR,CAAsBC,SAAtB,eAAsBA,SAAtB,CACA,qBAAqC,KAAKV,QAAL,EAArC,CAAQW,WAAR,kBAAQA,WAAR,CAAqBC,WAArB,kBAAqBA,WAArB,CACA,IAAMC,KAAK,GAAG,EAAd,CACA,IAAIC,GAAG,GAAG,CAAV,CACA,IAAMC,KAAK,GAAGN,YAAY,CAACO,GAAb,CAAiB,UAACC,CAAD,UAAOA,CAAC,CAACC,MAAT,EAAjB,CAAd,CACA,IAAMC,gBAAgB,GAAG,SAAC,EAAD,EAA+BC,MAA/B,cAAyCX,YAAzC,CAAzB,CAEA,KAAK,IAAIY,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGN,KAAK,CAACG,MAAN,GAAe,CAAnC,EAAsCG,CAAC,EAAvC,EAA2C,CACzCR,KAAK,CAACS,IAAN,CAAW,EACTC,OAAO,EAAET,GADA,EAETU,OAAO,EAAGV,GAAG,IAAIC,KAAK,CAACM,CAAD,CAFb,EAAX,EAID,CAED,IAAMI,WAAW,GAAGZ,KAAK,CAACV,IAAD,CAAzB,CACA,oBACE,uDACE,sCAAK,EAAE,EAAC,WAAR,EAAoB,KAAK,EAAE,EAAEuB,YAAY,EAAE,CAAhB,EAA3B,iBACE,yCAAQ,QAAQ,EAAEvB,IAAI,KAAK,CAA3B,EAA8B,EAAE,EAAC,WAAjC,EAA6C,OAAO,EAAE,KAAKC,QAA3D,WADF,EAGY,GAHZ,eAIE,4CAAWD,IAAI,GAAG,CAAlB,WAAyBU,KAAK,CAACK,MAA/B,CAJF,EAImD,GAJnD,eAKE,yCAAQ,QAAQ,EAAEf,IAAI,GAAG,CAAP,IAAYU,KAAK,CAACK,MAApC,EAA4C,EAAE,EAAC,WAA/C,EAA2D,OAAO,EAAE,KAAKZ,QAAzE,WALF,CADF,eAUE,0CACGmB,WAAW,iBACV,6BAAC,8BAAD,IACE,GAAG,EAAEtB,IADP,EAEE,SAAS,EAAEO,SAFb,EAGE,WAAW,EAAEC,WAHf,EAIE,WAAW,EAAEC,WAJf,EAKE,IAAI,EAAEO,gBAAgB,CAACQ,KAAjB,CAAuBF,WAAW,CAACD,OAAnC,EAA4CL,gBAAgB,CAACD,MAA7D,CALR,EAME,IAAI,EAAEC,gBAAgB,CAACQ,KAAjB,CAAuBF,WAAW,CAACF,OAAnC,EAA4CE,WAAW,CAACD,OAAxD,CANR,GAFJ,CAVF,CADF,CAyBD,C,8BAzDOI,eAAMlB,S,oDAJHX,mB,CAQGE,Y,GAAwD,EACpEU,WAAW,EAAE,EADuD,EAEpEC,WAAW,EAAE,EAFuD,E","sourcesContent":["import React from 'react';\n\nimport { DefaultizeProps } from '../lib/utils';\nimport { createPropsGetter } from '../lib/createPropsGetter';\n\nimport { ComponentTable, StatePropsCombinations, StateType } from './ComponentTable';\n\nexport interface ComponentCombinatorProps<C, P, S> {\n  combinations: Array<StatePropsCombinations<P, S>>;\n  Component: C;\n  presetProps?: DefaultizeProps<C, P>;\n  presetState?: Partial<S>;\n}\n\ntype DefaultProps<T, C, P> = Required<Pick<ComponentCombinatorProps<T, C, P>, 'presetProps' | 'presetState'>>;\n\nexport class ComponentCombinator<\n  T extends React.Component<any, any, any>,\n  C extends React.ComponentType<any>,\n  P extends React.ComponentProps<C>,\n> extends React.Component<\n  ComponentCombinatorProps<C extends React.ComponentClass<P, any> ? React.ClassType<P, T, C> : C, P, StateType<C>>,\n  { page: number }\n> {\n  public static defaultProps: DefaultProps<unknown, unknown, unknown> = {\n    presetProps: {},\n    presetState: {},\n  };\n\n  private getProps = createPropsGetter(ComponentCombinator.defaultProps);\n\n  public state = {\n    page: 0,\n  };\n\n  public render() {\n    const { page } = this.state;\n    const { combinations, Component } = this.props;\n    const { presetProps, presetState } = this.getProps();\n    const pages = [];\n    let row = 0;\n    const sizes = combinations.map((c) => c.length);\n    const flatCombinations = ([] as typeof combinations[0]).concat(...combinations);\n\n    for (let j = 0; j < sizes.length - 1; j++) {\n      pages.push({\n        offsetX: row,\n        offsetY: (row += sizes[j]),\n      });\n    }\n\n    const pageOffsets = pages[page];\n    return (\n      <div>\n        <div id=\"paginator\" style={{ marginBottom: 5 }}>\n          <button disabled={page === 0} id=\"prev-page\" onClick={this.prevPage}>\n            Prev\n          </button>{' '}\n          <small>{`${page + 1} / ${pages.length}`}</small>{' '}\n          <button disabled={page + 1 >= pages.length} id=\"next-page\" onClick={this.nextPage}>\n            Next\n          </button>\n        </div>\n        <div>\n          {pageOffsets && (\n            <ComponentTable\n              key={page}\n              Component={Component}\n              presetProps={presetProps as DefaultizeProps<C, P>}\n              presetState={presetState}\n              rows={flatCombinations.slice(pageOffsets.offsetY, flatCombinations.length)}\n              cols={flatCombinations.slice(pageOffsets.offsetX, pageOffsets.offsetY)}\n            />\n          )}\n        </div>\n      </div>\n    );\n  }\n\n  private prevPage = () => {\n    this.setState(({ page }) => ({\n      page: page - 1,\n    }));\n  };\n\n  private nextPage = () => {\n    this.setState(({ page }) => ({\n      page: page + 1,\n    }));\n  };\n}\n"]}
+{"version":3,"sources":["ComponentCombinator.tsx"],"names":["ComponentCombinator","getProps","defaultProps","state","page","prevPage","setState","nextPage","render","props","combinations","Component","presetProps","presetState","pages","row","sizes","map","c","length","flatCombinations","concat","j","push","offsetX","offsetY","pageOffsets","marginBottom","slice","React"],"mappings":"uQAAA;;;AAGA;;AAEA,kD;;;;;;;;;;;AAWaA,mB;;;;;;;;;;;;;AAaHC,IAAAA,Q,GAAW,0CAAkBD,mBAAmB,CAACE,YAAtC,C;;AAEZC,IAAAA,K,GAAQ;AACbC,MAAAA,IAAI,EAAE,CADO,E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDPC,IAAAA,Q,GAAW,YAAM;AACvB,YAAKC,QAAL,CAAc,qBAAGF,IAAH,QAAGA,IAAH,QAAe;AAC3BA,UAAAA,IAAI,EAAEA,IAAI,GAAG,CADc,EAAf,EAAd;;AAGD,K;;AAEOG,IAAAA,Q,GAAW,YAAM;AACvB,YAAKD,QAAL,CAAc,sBAAGF,IAAH,SAAGA,IAAH,QAAe;AAC3BA,UAAAA,IAAI,EAAEA,IAAI,GAAG,CADc,EAAf,EAAd;;AAGD,K,iEAtDMI,M,GAAP,kBAAgB,WACd,IAAQJ,IAAR,GAAiB,KAAKD,KAAtB,CAAQC,IAAR,CACA,kBAAoC,KAAKK,KAAzC,CAAQC,YAAR,eAAQA,YAAR,CAAsBC,SAAtB,eAAsBA,SAAtB,CACA,qBAAqC,KAAKV,QAAL,EAArC,CAAQW,WAAR,kBAAQA,WAAR,CAAqBC,WAArB,kBAAqBA,WAArB,CACA,IAAMC,KAAK,GAAG,EAAd,CACA,IAAIC,GAAG,GAAG,CAAV,CACA,IAAMC,KAAK,GAAGN,YAAY,CAACO,GAAb,CAAiB,UAACC,CAAD,UAAOA,CAAC,CAACC,MAAT,EAAjB,CAAd,CACA,IAAMC,gBAAgB,GAAG,SAAC,EAAD,EAA+BC,MAA/B,cAAyCX,YAAzC,CAAzB,CAEA,KAAK,IAAIY,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGN,KAAK,CAACG,MAAN,GAAe,CAAnC,EAAsCG,CAAC,EAAvC,EAA2C,CACzCR,KAAK,CAACS,IAAN,CAAW,EACTC,OAAO,EAAET,GADA,EAETU,OAAO,EAAGV,GAAG,IAAIC,KAAK,CAACM,CAAD,CAFb,EAAX,EAID,CAED,IAAMI,WAAW,GAAGZ,KAAK,CAACV,IAAD,CAAzB,CACA,oBACE,uDACE,sCAAK,EAAE,EAAC,WAAR,EAAoB,KAAK,EAAE,EAAEuB,YAAY,EAAE,CAAhB,EAA3B,iBACE,yCAAQ,QAAQ,EAAEvB,IAAI,KAAK,CAA3B,EAA8B,EAAE,EAAC,WAAjC,EAA6C,OAAO,EAAE,KAAKC,QAA3D,WADF,EAGY,GAHZ,eAIE,4CAAWD,IAAI,GAAG,CAAlB,WAAyBU,KAAK,CAACK,MAA/B,CAJF,EAImD,GAJnD,eAKE,yCAAQ,QAAQ,EAAEf,IAAI,GAAG,CAAP,IAAYU,KAAK,CAACK,MAApC,EAA4C,EAAE,EAAC,WAA/C,EAA2D,OAAO,EAAE,KAAKZ,QAAzE,WALF,CADF,eAUE,0CACGmB,WAAW,iBACV,6BAAC,8BAAD,IACE,GAAG,EAAEtB,IADP,EAEE,SAAS,EAAEO,SAFb,EAGE,WAAW,EAAEC,WAHf,EAIE,WAAW,EAAEC,WAJf,EAKE,IAAI,EAAEO,gBAAgB,CAACQ,KAAjB,CAAuBF,WAAW,CAACD,OAAnC,EAA4CL,gBAAgB,CAACD,MAA7D,CALR,EAME,IAAI,EAAEC,gBAAgB,CAACQ,KAAjB,CAAuBF,WAAW,CAACF,OAAnC,EAA4CE,WAAW,CAACD,OAAxD,CANR,GAFJ,CAVF,CADF,CAyBD,C,8BAzDOI,eAAMlB,S,oDAJHX,mB,CAQGE,Y,GAAwD,EACpEU,WAAW,EAAE,EADuD,EAEpEC,WAAW,EAAE,EAFuD,E","sourcesContent":["import React from 'react';\n\nimport { DefaultizeProps } from '../lib/utils';\nimport { createPropsGetter } from '../lib/createPropsGetter';\n\nimport { ComponentTable, StatePropsCombinations, StateType } from './ComponentTable';\n\nexport interface ComponentCombinatorProps<C, P, S> {\n  combinations: Array<StatePropsCombinations<P, S>>;\n  Component: C;\n  presetProps?: DefaultizeProps<C, P>;\n  presetState?: Partial<S>;\n}\n\ntype DefaultProps<T, C, P> = Required<Pick<ComponentCombinatorProps<T, C, P>, 'presetProps' | 'presetState'>>;\n\nexport class ComponentCombinator<\n  T extends React.Component<any, any, any>,\n  C extends React.ComponentType<any>,\n  P extends React.ComponentProps<C>,\n> extends React.Component<\n  ComponentCombinatorProps<C extends React.ComponentClass<P, any> ? React.ClassType<P, T, C> : C, P, StateType<C>>,\n  { page: number }\n> {\n  public static defaultProps: DefaultProps<unknown, unknown, unknown> = {\n    presetProps: {},\n    presetState: {},\n  };\n\n  private getProps = createPropsGetter(ComponentCombinator.defaultProps);\n\n  public state = {\n    page: 0,\n  };\n\n  public render() {\n    const { page } = this.state;\n    const { combinations, Component } = this.props;\n    const { presetProps, presetState } = this.getProps();\n    const pages = [];\n    let row = 0;\n    const sizes = combinations.map((c) => c.length);\n    const flatCombinations = ([] as typeof combinations[0]).concat(...combinations);\n\n    for (let j = 0; j < sizes.length - 1; j++) {\n      pages.push({\n        offsetX: row,\n        offsetY: (row += sizes[j]),\n      });\n    }\n\n    const pageOffsets = pages[page];\n    return (\n      <div>\n        <div id=\"paginator\" style={{ marginBottom: 5 }}>\n          <button disabled={page === 0} id=\"prev-page\" onClick={this.prevPage}>\n            Prev\n          </button>{' '}\n          <small>{`${page + 1} / ${pages.length}`}</small>{' '}\n          <button disabled={page + 1 >= pages.length} id=\"next-page\" onClick={this.nextPage}>\n            Next\n          </button>\n        </div>\n        <div>\n          {pageOffsets && (\n            <ComponentTable\n              key={page}\n              Component={Component}\n              presetProps={presetProps as DefaultizeProps<C, P>}\n              presetState={presetState}\n              rows={flatCombinations.slice(pageOffsets.offsetY, flatCombinations.length)}\n              cols={flatCombinations.slice(pageOffsets.offsetX, pageOffsets.offsetY)}\n            />\n          )}\n        </div>\n      </div>\n    );\n  }\n\n  private prevPage = () => {\n    this.setState(({ page }) => ({\n      page: page - 1,\n    }));\n  };\n\n  private nextPage = () => {\n    this.setState(({ page }) => ({\n      page: page + 1,\n    }));\n  };\n}\n"]}

package/cjs/internal/ComponentTable.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ComponentTable = 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").default;exports.__esModule = true;exports.ComponentTable = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
 var _utils = require("../lib/utils");
 var _createPropsGetter = require("../lib/createPropsGetter");

package/cjs/internal/ComponentTable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ComponentTable.tsx"],"names":["renderPropsDesc","props","Object","keys","map","key","value","React","isValidElement","createElement","JSON","stringify","node","index","nodes","length","ComponentTable","getProps","defaultProps","render","rows","cols","Component","presetProps","presetState","borderSpacing","marginBottom","captionSide","i","colProps","whiteSpace","rowIndex","rowProps","state","rowState","colIndex","colState","undefined","el","setState"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isFunctionalComponent, DefaultizeProps } from '../lib/utils';\nimport { createPropsGetter } from '../lib/createPropsGetter';\n\n// TODO We should output state too\nconst renderPropsDesc = <P extends Record<string, any>>(props: P): React.ReactNode => {\n  return Object.keys(props)\n    .map((key) => {\n      const value = props[key];\n      switch (typeof value) {\n        case 'boolean':\n          return value ? key : `${key}: false`;\n        case 'string':\n          return `${key}: \"${value}\"`;\n        case 'object':\n          if (React.isValidElement(value)) {\n            return React.createElement('span', {}, [`${key}: `, value]);\n          }\n          return `${key}: ${JSON.stringify(value)}`;\n        default:\n          return `${key}: ${value}`;\n      }\n    })\n    .map((node, index, nodes) => (\n      <span key={index}>\n        {node} {index + 1 < nodes.length ? ', ' : null}\n      </span>\n    ));\n};\n\ninterface StatePropsObject<P, S> {\n  props?: Partial<P>;\n  state?: Partial<S>;\n}\nexport type StatePropsCombinations<P, S> = Array<StatePropsObject<P, S>>;\n\nexport type StateType<C> = C extends React.Component<any, infer S> | React.ComponentClass<any, infer S> ? S : never;\n\nexport interface ComponentTableProps<C, P, S> {\n  rows?: StatePropsCombinations<P, S>;\n  cols?: StatePropsCombinations<P, S>;\n  presetProps?: DefaultizeProps<C, P>;\n  presetState?: Partial<S>;\n  Component: C;\n}\n\ntype DefaultProps<C, P, S> = Required<Pick<ComponentTableProps<C, P, S>, 'presetProps' | 'presetState'>>;\n\n// Known limitation: Don't work when component have `propTypes` static field\nexport class ComponentTable<\n  T extends React.Component<any, any, any>,\n  C extends React.ComponentType<any>,\n  P extends React.ComponentProps<C>,\n> extends React.Component<\n  ComponentTableProps<C extends React.ComponentClass<P, any> ? React.ClassType<P, T, C> : C, P, StateType<C>>\n> {\n  public static defaultProps: DefaultProps<unknown, Record<string | number | symbol, unknown>, unknown> = {\n    presetProps: {},\n    presetState: {},\n  };\n\n  private getProps = createPropsGetter(ComponentTable.defaultProps);\n\n  public render() {\n    const { rows = [], cols = [], Component } = this.props;\n    const { presetProps, presetState } = this.getProps();\n    return (\n      <table style={{ borderSpacing: 10, marginBottom: 20 }}>\n        <caption style={{ captionSide: 'bottom' }}>{renderPropsDesc(presetProps)}</caption>\n        <thead>\n          <tr>\n            <th />\n            {cols.map(({ props: colProps = {} }, i) => (\n              <th style={{ whiteSpace: 'nowrap' }} key={i}>\n                {renderPropsDesc(colProps)}\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {rows.map(({ props: rowProps = {}, state: rowState = {} }, rowIndex) => (\n            <tr key={rowIndex}>\n              <td style={{ whiteSpace: 'nowrap' }}>{renderPropsDesc(rowProps)}</td>\n              {cols.map(({ props: colProps = {}, state: colState = {} }, colIndex) => (\n                <td key={colIndex}>\n                  {/* @ts-expect-error: Defaultized props incompatible with JSX.LibraryManagedAttributes so just ignore it */}\n                  <Component\n                    {...presetProps}\n                    {...rowProps}\n                    {...colProps}\n                    ref={\n                      // NOTE Call setState from outside is bad practice, but here it needed for test state combinations\n                      isFunctionalComponent(Component)\n                        ? undefined\n                        : (el: React.Component<P, StateType<C>>) =>\n                            el &&\n                            el.setState((state: StateType<C>) => ({\n                              ...state,\n                              ...presetState,\n                              ...rowState,\n                              ...colState,\n                            }))\n                    }\n                  />\n                </td>\n              ))}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    );\n  }\n}\n"]}
+{"version":3,"sources":["ComponentTable.tsx"],"names":["renderPropsDesc","props","Object","keys","map","key","value","React","isValidElement","createElement","JSON","stringify","node","index","nodes","length","ComponentTable","getProps","defaultProps","render","rows","cols","Component","presetProps","presetState","borderSpacing","marginBottom","captionSide","i","colProps","whiteSpace","rowIndex","rowProps","state","rowState","colIndex","colState","undefined","el","setState"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isFunctionalComponent, DefaultizeProps } from '../lib/utils';\nimport { createPropsGetter } from '../lib/createPropsGetter';\n\n// TODO We should output state too\nconst renderPropsDesc = <P extends Record<string, any>>(props: P): React.ReactNode => {\n  return Object.keys(props)\n    .map((key) => {\n      const value = props[key];\n      switch (typeof value) {\n        case 'boolean':\n          return value ? key : `${key}: false`;\n        case 'string':\n          return `${key}: \"${value}\"`;\n        case 'object':\n          if (React.isValidElement(value)) {\n            return React.createElement('span', {}, [`${key}: `, value]);\n          }\n          return `${key}: ${JSON.stringify(value)}`;\n        default:\n          return `${key}: ${value}`;\n      }\n    })\n    .map((node, index, nodes) => (\n      <span key={index}>\n        {node} {index + 1 < nodes.length ? ', ' : null}\n      </span>\n    ));\n};\n\ninterface StatePropsObject<P, S> {\n  props?: Partial<P>;\n  state?: Partial<S>;\n}\nexport type StatePropsCombinations<P, S> = Array<StatePropsObject<P, S>>;\n\nexport type StateType<C> = C extends React.Component<any, infer S> | React.ComponentClass<any, infer S> ? S : never;\n\nexport interface ComponentTableProps<C, P, S> {\n  rows?: StatePropsCombinations<P, S>;\n  cols?: StatePropsCombinations<P, S>;\n  presetProps?: DefaultizeProps<C, P>;\n  presetState?: Partial<S>;\n  Component: C;\n}\n\ntype DefaultProps<C, P, S> = Required<Pick<ComponentTableProps<C, P, S>, 'presetProps' | 'presetState'>>;\n\n// Known limitation: Don't work when component have `propTypes` static field\nexport class ComponentTable<\n  T extends React.Component<any, any, any>,\n  C extends React.ComponentType<any>,\n  P extends React.ComponentProps<C>,\n> extends React.Component<\n  ComponentTableProps<C extends React.ComponentClass<P, any> ? React.ClassType<P, T, C> : C, P, StateType<C>>\n> {\n  public static defaultProps: DefaultProps<unknown, Record<string | number | symbol, unknown>, unknown> = {\n    presetProps: {},\n    presetState: {},\n  };\n\n  private getProps = createPropsGetter(ComponentTable.defaultProps);\n\n  public render() {\n    const { rows = [], cols = [], Component } = this.props;\n    const { presetProps, presetState } = this.getProps();\n    return (\n      <table style={{ borderSpacing: 10, marginBottom: 20 }}>\n        <caption style={{ captionSide: 'bottom' }}>{renderPropsDesc(presetProps)}</caption>\n        <thead>\n          <tr>\n            <th />\n            {cols.map(({ props: colProps = {} }, i) => (\n              <th style={{ whiteSpace: 'nowrap' }} key={i}>\n                {renderPropsDesc(colProps)}\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {rows.map(({ props: rowProps = {}, state: rowState = {} }, rowIndex) => (\n            <tr key={rowIndex}>\n              <td style={{ whiteSpace: 'nowrap' }}>{renderPropsDesc(rowProps)}</td>\n              {cols.map(({ props: colProps = {}, state: colState = {} }, colIndex) => (\n                <td key={colIndex}>\n                  {/* @ts-expect-error: Defaultized props incompatible with JSX.LibraryManagedAttributes so just ignore it */}\n                  <Component\n                    {...presetProps}\n                    {...rowProps}\n                    {...colProps}\n                    ref={\n                      // NOTE Call setState from outside is bad practice, but here it needed for test state combinations\n                      isFunctionalComponent(Component)\n                        ? undefined\n                        : (el: React.Component<P, StateType<C>>) =>\n                            el &&\n                            el.setState((state: StateType<C>) => ({\n                              ...state,\n                              ...presetState,\n                              ...rowState,\n                              ...colState,\n                            }))\n                    }\n                  />\n                </td>\n              ))}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    );\n  }\n}\n"]}

package/cjs/internal/CustomComboBox/ArrowDownIcon.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ArrowDownIcon = void 0;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ArrowDownIcon = void 0;
 var _react = _interopRequireDefault(require("react"));
 
 var _ArrowCDownIcon16Regular = require("../icons2022/ArrowCDownIcon/ArrowCDownIcon16Regular");

package/cjs/internal/CustomComboBox/ComboBoxMenu.d.ts

@@ -2,10 +2,12 @@ import React from 'react';
 import { Menu } from '../Menu';
 import { MenuItemState } from '../../components/MenuItem';
 import { Nullable } from '../../typings/utility-types';
+import { ComboBoxExtendedItem } from '../../components/ComboBox';
+import { SizeProp } from '../../lib/types/props';
 import { ComboBoxRequestStatus } from './CustomComboBoxTypes';
 export interface ComboBoxMenuProps<T> {
     opened?: boolean;
-    items?: Nullable<T[]>;
+    items?: Nullable<Array<ComboBoxExtendedItem<T>>>;
     totalCount?: number;
     loading?: boolean;
     maxMenuHeight?: number | string;
@@ -13,13 +15,15 @@ export interface ComboBoxMenuProps<T> {
     renderNotFound?: () => React.ReactNode;
     renderTotalCount?: (found: number, total: number) => React.ReactNode;
     renderItem: (item: T, state: MenuItemState) => React.ReactNode;
-    itemWrapper?: (item?: T) => React.ComponentType<unknown>;
+    itemWrapper?: (item: T) => React.ComponentType<unknown>;
     onValueChange: (value: T) => any;
     renderAddButton?: () => React.ReactNode;
     caption?: React.ReactNode;
     repeatRequest?: () => void;
     requestStatus?: ComboBoxRequestStatus;
     isMobile?: boolean;
+    menuId?: string;
+    size?: SizeProp;
 }
 export declare const ComboBoxMenuDataTids: {
     readonly loading: "ComboBoxMenu__loading";
@@ -31,10 +35,13 @@ export declare const ComboBoxMenuDataTids: {
 declare type DefaultProps<T> = Required<Pick<ComboBoxMenuProps<T>, 'repeatRequest' | 'requestStatus'>>;
 export declare class ComboBoxMenu<T> extends React.Component<ComboBoxMenuProps<T>> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     static defaultProps: DefaultProps<unknown>;
     private getProps;
     private readonly locale;
-    render(): JSX.Element | null;
+    private theme;
+    render(): JSX.Element;
+    renderMain(): JSX.Element | null;
     private renderItem;
 }
 export {};