@skbkontur/react-ui 0.0.0-0b8a8f7a39 → 0.0.0-0fe669bb2d

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

@@ -1 +1 @@
-{"version":3,"sources":["CommonWrapper.tsx"],"names":["CommonWrapper","render","extractCommonProps","props","className","style","dataProps","children","rest","child","isValidElement","React","cloneElement","Component","common","key","isCommonProp","name","indexOf"],"mappings":"ucAAA;AACA;;AAEA,wC;;;;;;;;;;;;;;;;AAgBaA,a;AACXC,EAAAA,M,GAAA,kBAAS;AAC6DC,IAAAA,kBAAkB,CAAC,KAAKC,KAAN,CAD/E,+CACEC,SADF,wBACEA,SADF,CACaC,KADb,wBACaA,KADb,CACuBC,SADvB,4IACsCC,QADtC,yBACsCA,QADtC,CACmDC,IADnD;AAEP,QAAMC,KAAK,GAAG,uBAAWF,QAAX,IAAuBA,QAAQ,CAACC,IAAD,CAA/B,GAAwCD,QAAtD;;AAEA,WAAO,4BAAMG,cAAN,CAAkCD,KAAlC;AACHE,mBAAMC,YAAN,CAAmBH,KAAnB;AACEL,MAAAA,SAAS,EAAE,yBAAGK,KAAK,CAACN,KAAN,CAAYC,SAAf,EAA0BA,SAA1B,CADb;AAEEC,MAAAA,KAAK;AACAI,MAAAA,KAAK,CAACN,KAAN,CAAYE,KADZ;AAEAA,MAAAA,KAFA,CAFP;;AAMKC,IAAAA,SANL,EADG;;AASHG,IAAAA,KATJ;AAUD,G,wBAfuDE,eAAME,S;;;AAkBhE,IAAMX,kBAAkB,GAAG,SAArBA,kBAAqB,CAAwBC,KAAxB,EAAuE;AAChG,MAAMW,MAAM,GAAG,EAAf;AACA,MAAMN,IAAI,GAAG,EAAb;;AAEA,OAAK,IAAMO,GAAX,IAAkBZ,KAAlB,EAAyB;AACvB,QAAIa,YAAY,CAACD,GAAD,CAAhB,EAAuB;AACrB;AACAD,MAAAA,MAAM,CAACC,GAAD,CAAN,GAAcZ,KAAK,CAACY,GAAD,CAAnB;AACD,KAHD,MAGO;AACL;AACAP,MAAAA,IAAI,CAACO,GAAD,CAAJ,GAAYZ,KAAK,CAACY,GAAD,CAAjB;AACD;AACF;;AAED,SAAO,CAACD,MAAD,EAASN,IAAT,CAAP;AACD,CAfD;;AAiBA,IAAMQ,YAAY,GAAG,SAAfA,YAAe,CAACC,IAAD,EAAkB;AACrC,UAAQ,IAAR;AACE,SAAKA,IAAI,IAAI,WAAb;AACA,SAAKA,IAAI,IAAI,OAAb;AACA,SAAKA,IAAI,CAACC,OAAL,CAAa,OAAb,MAA0B,CAA/B,EAAkC;AAChC,aAAO,IAAP;AACF;AACE,aAAO,KAAP,CANJ;;AAQD,CATD","sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport { isFunction } from '../../lib/utils';\r\n\r\nexport interface CommonProps {\r\n  className?: React.HTMLAttributes<HTMLElement>['className'];\r\n  style?: React.HTMLAttributes<HTMLElement>['style'];\r\n  /** На равне с data-tid транслируются любые data-атрибуты. Они попадают на корневой элемент. */\r\n  'data-tid'?: string;\r\n}\r\n\r\nexport type NotCommonProps<P> = Omit<P, keyof CommonProps>;\r\n\r\nexport type CommonWrapperProps<P> = P & {\r\n  children: React.ReactNode | ((rest: CommonWrapperRestProps<P>) => React.ReactNode);\r\n};\r\nexport type CommonWrapperRestProps<P> = Omit<NotCommonProps<P>, 'children'>;\r\n\r\nexport class CommonWrapper<P extends CommonProps> extends React.Component<CommonWrapperProps<P>> {\r\n  render() {\r\n    const [{ className, style, ...dataProps }, { children, ...rest }] = extractCommonProps(this.props);\r\n    const child = isFunction(children) ? children(rest) : children;\r\n\r\n    return React.isValidElement<CommonProps>(child)\r\n      ? React.cloneElement(child, {\r\n          className: cn(child.props.className, className),\r\n          style: {\r\n            ...child.props.style,\r\n            ...style,\r\n          },\r\n          ...dataProps,\r\n        })\r\n      : child;\r\n  }\r\n}\r\n\r\nconst extractCommonProps = <P extends CommonProps>(props: P): [CommonProps, NotCommonProps<P>] => {\r\n  const common = {} as CommonProps;\r\n  const rest = {} as NotCommonProps<P>;\r\n\r\n  for (const key in props) {\r\n    if (isCommonProp(key)) {\r\n      // @ts-ignore\r\n      common[key] = props[key];\r\n    } else {\r\n      // @ts-ignore\r\n      rest[key] = props[key];\r\n    }\r\n  }\r\n\r\n  return [common, rest];\r\n};\r\n\r\nconst isCommonProp = (name: string) => {\r\n  switch (true) {\r\n    case name == 'className':\r\n    case name == 'style':\r\n    case name.indexOf('data-') === 0: // все data-атрибуты\r\n      return true;\r\n    default:\r\n      return false;\r\n  }\r\n};\r\n"]}
+{"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"]}

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

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

package/cjs/internal/ComponentCombinator.d.ts

@@ -4,18 +4,15 @@ import { StatePropsCombinations, StateType } from './ComponentTable';
 export interface ComponentCombinatorProps<C, P, S> {
     combinations: Array<StatePropsCombinations<P, S>>;
     Component: C;
-    presetProps: DefaultizeProps<C, P>;
-    presetState: Partial<S>;
+    presetProps?: DefaultizeProps<C, P>;
+    presetState?: Partial<S>;
 }
+declare type DefaultProps<T, C, P> = Required<Pick<ComponentCombinatorProps<T, C, P>, 'presetProps' | 'presetState'>>;
 export declare class ComponentCombinator<T extends React.Component<any, any, any>, C extends React.ComponentType<any>, P extends React.ComponentProps<C>> extends React.Component<ComponentCombinatorProps<C extends React.ComponentClass<P, any> ? React.ClassType<P, T, C> : C, P, StateType<C>>, {
     page: number;
 }> {
-    static defaultProps: {
-        props: never[];
-        states: never[];
-        presetProps: {};
-        presetState: {};
-    };
+    static defaultProps: DefaultProps<unknown, unknown, unknown>;
+    private getProps;
     state: {
         page: number;
     };
@@ -23,3 +20,4 @@ export declare class ComponentCombinator<T extends React.Component<any, any, any
     private prevPage;
     private nextPage;
 }
+export {};

package/cjs/internal/ComponentCombinator.js

@@ -1,6 +1,7 @@
 "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"));
 
 
+var _createPropsGetter = require("../lib/createPropsGetter");
 
 var _ComponentTable = require("./ComponentTable");var
 
@@ -11,9 +12,10 @@ var _ComponentTable = require("./ComponentTable");var
 
 
 
-ComponentCombinator = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ComponentCombinator, _React$Component);function ComponentCombinator() {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.
 
 
+ComponentCombinator = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ComponentCombinator, _React$Component);function ComponentCombinator() {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.
+
 
 
 
@@ -25,6 +27,7 @@ ComponentCombinator = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoo
 
 
 
+    getProps = (0, _createPropsGetter.createPropsGetter)(ComponentCombinator.defaultProps);_this.
 
     state = {
       page: 0 };_this.
@@ -71,6 +74,7 @@ ComponentCombinator = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoo
 
 
 
+
 
 
     prevPage = function () {
@@ -83,4 +87,4 @@ ComponentCombinator = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoo
       _this.setState(function (_ref2) {var page = _ref2.page;return {
           page: page + 1 };});
 
-    };return _this;}var _proto = ComponentCombinator.prototype;_proto.render = function render() {var _ref3;var page = this.state.page;var _this$props = this.props,combinations = _this$props.combinations,Component = _this$props.Component,presetProps = _this$props.presetProps,presetState = _this$props.presetState;var pages = [];var row = 0;var sizes = combinations.map(function (c) {return c.length;});var flatCombinations = (_ref3 = []).concat.apply(_ref3, combinations);for (var j = 0; j < sizes.length - 1; j++) {pages.push({ offsetX: row, offsetY: row += sizes[j] });}var pageOffsets = pages[page];return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", { id: "paginator", style: { marginBottom: 5 } }, /*#__PURE__*/_react.default.createElement("button", { disabled: page === 0, id: "prev-page", onClick: this.prevPage }, "Prev"), ' ', /*#__PURE__*/_react.default.createElement("small", null, page + 1 + " / " + pages.length), ' ', /*#__PURE__*/_react.default.createElement("button", { disabled: page + 1 >= pages.length, id: "next-page", onClick: this.nextPage }, "Next")), /*#__PURE__*/_react.default.createElement("div", null, pageOffsets && /*#__PURE__*/_react.default.createElement(_ComponentTable.ComponentTable, { key: page, Component: Component, presetProps: presetProps, presetState: presetState, rows: flatCombinations.slice(pageOffsets.offsetY, flatCombinations.length), cols: flatCombinations.slice(pageOffsets.offsetX, pageOffsets.offsetY) })));};return ComponentCombinator;}(_react.default.Component);exports.ComponentCombinator = ComponentCombinator;ComponentCombinator.defaultProps = { props: [], states: [], presetProps: {}, presetState: {} };
+    };return _this;}var _proto = ComponentCombinator.prototype;_proto.render = function render() {var _ref3;var page = this.state.page;var _this$props = this.props,combinations = _this$props.combinations,Component = _this$props.Component;var _this$getProps = this.getProps(),presetProps = _this$getProps.presetProps,presetState = _this$getProps.presetState;var pages = [];var row = 0;var sizes = combinations.map(function (c) {return c.length;});var flatCombinations = (_ref3 = []).concat.apply(_ref3, combinations);for (var j = 0; j < sizes.length - 1; j++) {pages.push({ offsetX: row, offsetY: row += sizes[j] });}var pageOffsets = pages[page];return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", { id: "paginator", style: { marginBottom: 5 } }, /*#__PURE__*/_react.default.createElement("button", { disabled: page === 0, id: "prev-page", onClick: this.prevPage }, "Prev"), ' ', /*#__PURE__*/_react.default.createElement("small", null, page + 1 + " / " + pages.length), ' ', /*#__PURE__*/_react.default.createElement("button", { disabled: page + 1 >= pages.length, id: "next-page", onClick: this.nextPage }, "Next")), /*#__PURE__*/_react.default.createElement("div", null, pageOffsets && /*#__PURE__*/_react.default.createElement(_ComponentTable.ComponentTable, { key: page, Component: Component, presetProps: presetProps, presetState: presetState, rows: flatCombinations.slice(pageOffsets.offsetY, flatCombinations.length), cols: flatCombinations.slice(pageOffsets.offsetX, pageOffsets.offsetY) })));};return ComponentCombinator;}(_react.default.Component);exports.ComponentCombinator = ComponentCombinator;ComponentCombinator.defaultProps = { presetProps: {}, presetState: {} };

package/cjs/internal/ComponentCombinator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ComponentCombinator.tsx"],"names":["ComponentCombinator","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","defaultProps","states"],"mappings":"+PAAA;;;;AAIA,kD;;;;;;;;;AASaA,mB;;;;;;;;;;;;;;;AAeJC,IAAAA,K,GAAQ;AACbC,MAAAA,IAAI,EAAE,CADO,E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+CPC,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,iEArDMI,M,GAAP,kBAAgB,eACNJ,IADM,GACG,KAAKD,KADR,CACNC,IADM,mBAEgD,KAAKK,KAFrD,CAENC,YAFM,eAENA,YAFM,CAEQC,SAFR,eAEQA,SAFR,CAEmBC,WAFnB,eAEmBA,WAFnB,CAEgCC,WAFhC,eAEgCA,WAFhC,CAGd,IAAMC,KAAK,GAAG,EAAd,CACA,IAAIC,GAAG,GAAG,CAAV,CACA,IAAMC,KAAK,GAAGN,YAAY,CAACO,GAAb,CAAiB,UAAAC,CAAC,UAAIA,CAAC,CAACC,MAAN,EAAlB,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,EAAEV,GAAG,IAAIC,KAAK,CAACM,CAAD,CAFZ,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,8BAxDOI,eAAMlB,S,oDAJHT,mB,CAQG4B,Y,GAAe,EAC3BrB,KAAK,EAAE,EADoB,EAE3BsB,MAAM,EAAE,EAFmB,EAG3BnB,WAAW,EAAE,EAHc,EAI3BC,WAAW,EAAE,EAJc,E","sourcesContent":["import React from 'react';\r\n\r\nimport { DefaultizeProps } from '../lib/utils';\r\n\r\nimport { ComponentTable, StatePropsCombinations, StateType } from './ComponentTable';\r\n\r\nexport interface ComponentCombinatorProps<C, P, S> {\r\n  combinations: Array<StatePropsCombinations<P, S>>;\r\n  Component: C;\r\n  presetProps: DefaultizeProps<C, P>;\r\n  presetState: Partial<S>;\r\n}\r\n\r\nexport class ComponentCombinator<\r\n  T extends React.Component<any, any, any>,\r\n  C extends React.ComponentType<any>,\r\n  P extends React.ComponentProps<C>\r\n> extends React.Component<\r\n  ComponentCombinatorProps<C extends React.ComponentClass<P, any> ? React.ClassType<P, T, C> : C, P, StateType<C>>,\r\n  { page: number }\r\n> {\r\n  public static defaultProps = {\r\n    props: [],\r\n    states: [],\r\n    presetProps: {},\r\n    presetState: {},\r\n  };\r\n\r\n  public state = {\r\n    page: 0,\r\n  };\r\n\r\n  public render() {\r\n    const { page } = this.state;\r\n    const { combinations, Component, presetProps, presetState } = this.props;\r\n    const pages = [];\r\n    let row = 0;\r\n    const sizes = combinations.map(c => c.length);\r\n    const flatCombinations = ([] as typeof combinations[0]).concat(...combinations);\r\n\r\n    for (let j = 0; j < sizes.length - 1; j++) {\r\n      pages.push({\r\n        offsetX: row,\r\n        offsetY: row += sizes[j],\r\n      });\r\n    }\r\n\r\n    const pageOffsets = pages[page];\r\n    return (\r\n      <div>\r\n        <div id=\"paginator\" style={{ marginBottom: 5 }}>\r\n          <button disabled={page === 0} id=\"prev-page\" onClick={this.prevPage}>\r\n            Prev\r\n          </button>{' '}\r\n          <small>{`${page + 1} / ${pages.length}`}</small>{' '}\r\n          <button disabled={page + 1 >= pages.length} id=\"next-page\" onClick={this.nextPage}>\r\n            Next\r\n          </button>\r\n        </div>\r\n        <div>\r\n          {pageOffsets && (\r\n            <ComponentTable\r\n              key={page}\r\n              Component={Component}\r\n              presetProps={presetProps}\r\n              presetState={presetState}\r\n              rows={flatCombinations.slice(pageOffsets.offsetY, flatCombinations.length)}\r\n              cols={flatCombinations.slice(pageOffsets.offsetX, pageOffsets.offsetY)}\r\n            />\r\n          )}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private prevPage = () => {\r\n    this.setState(({ page }) => ({\r\n      page: page - 1,\r\n    }));\r\n  };\r\n\r\n  private nextPage = () => {\r\n    this.setState(({ page }) => ({\r\n      page: page + 1,\r\n    }));\r\n  };\r\n}\r\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":"+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"]}

package/cjs/internal/ComponentTable.d.ts

@@ -1,21 +1,22 @@
 import React from 'react';
 import { DefaultizeProps } from '../lib/utils';
-export declare type StatePropsCombinations<P, S> = Array<{
+interface StatePropsObject<P, S> {
     props?: Partial<P>;
     state?: Partial<S>;
-}>;
+}
+export declare type StatePropsCombinations<P, S> = Array<StatePropsObject<P, S>>;
 export declare type StateType<C> = C extends React.Component<any, infer S> | React.ComponentClass<any, infer S> ? S : never;
 export interface ComponentTableProps<C, P, S> {
     rows?: StatePropsCombinations<P, S>;
     cols?: StatePropsCombinations<P, S>;
-    presetProps: DefaultizeProps<C, P>;
-    presetState: Partial<S>;
+    presetProps?: DefaultizeProps<C, P>;
+    presetState?: Partial<S>;
     Component: C;
 }
+declare type DefaultProps<C, P, S> = Required<Pick<ComponentTableProps<C, P, S>, 'presetProps' | 'presetState'>>;
 export declare class ComponentTable<T extends React.Component<any, any, any>, C extends React.ComponentType<any>, P extends React.ComponentProps<C>> extends React.Component<ComponentTableProps<C extends React.ComponentClass<P, any> ? React.ClassType<P, T, C> : C, P, StateType<C>>> {
-    static defaultProps: {
-        presetProps: {};
-        presetState: {};
-    };
+    static defaultProps: DefaultProps<unknown, Record<string | number | symbol, unknown>, unknown>;
+    private getProps;
     render(): JSX.Element;
 }
+export {};

package/cjs/internal/ComponentTable.js

@@ -1,6 +1,7 @@
 "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"));
 
 var _utils = require("../lib/utils");
+var _createPropsGetter = require("../lib/createPropsGetter");
 
 // TODO We should output state too
 var renderPropsDesc = function renderPropsDesc(props) {
@@ -40,8 +41,14 @@ var renderPropsDesc = function renderPropsDesc(props) {
 
 
 
+
+
+
+
+
+
 // Known limitation: Don't work when component have `propTypes` static field
-var ComponentTable = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ComponentTable, _React$Component);function ComponentTable() {return _React$Component.apply(this, arguments) || this;}var _proto = ComponentTable.prototype;_proto.
+var ComponentTable = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ComponentTable, _React$Component);function ComponentTable() {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.
 
 
 
@@ -50,8 +57,14 @@ var ComponentTable = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoos
 
 
 
-  render = function render() {var _this$props =
-    this.props,_this$props$rows = _this$props.rows,rows = _this$props$rows === void 0 ? [] : _this$props$rows,_this$props$cols = _this$props.cols,cols = _this$props$cols === void 0 ? [] : _this$props$cols,presetProps = _this$props.presetProps,presetState = _this$props.presetState,Component = _this$props.Component;
+
+
+
+    getProps = (0, _createPropsGetter.createPropsGetter)(ComponentTable.defaultProps);return _this;}var _proto = ComponentTable.prototype;_proto.
+
+  render = function render() {
+    var _this$props = this.props,_this$props$rows = _this$props.rows,rows = _this$props$rows === void 0 ? [] : _this$props$rows,_this$props$cols = _this$props.cols,cols = _this$props$cols === void 0 ? [] : _this$props$cols,Component = _this$props.Component;
+    var _this$getProps = this.getProps(),presetProps = _this$getProps.presetProps,presetState = _this$getProps.presetState;
     return /*#__PURE__*/(
       _react.default.createElement("table", { style: { borderSpacing: 10, marginBottom: 20 } }, /*#__PURE__*/
       _react.default.createElement("caption", { style: { captionSide: 'bottom' } }, renderPropsDesc(presetProps)), /*#__PURE__*/
@@ -72,7 +85,6 @@ var ComponentTable = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoos
           cols.map(function (_ref3, colIndex) {var _ref3$props = _ref3.props,colProps = _ref3$props === void 0 ? {} : _ref3$props,_ref3$state = _ref3.state,colState = _ref3$state === void 0 ? {} : _ref3$state;return /*#__PURE__*/(
               _react.default.createElement("td", { key: colIndex }, /*#__PURE__*/
 
-
               _react.default.createElement(Component, (0, _extends2.default)({},
               presetProps,
               rowProps,

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

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { Menu } from '../Menu';
 import { MenuItemState } from '../../components/MenuItem';
 import { Nullable } from '../../typings/utility-types';
@@ -18,14 +18,22 @@ export interface ComboBoxMenuProps<T> {
     caption?: React.ReactNode;
     repeatRequest?: () => void;
     requestStatus?: ComboBoxRequestStatus;
+    isMobile?: boolean;
 }
-export declare class ComboBoxMenu<T> extends Component<ComboBoxMenuProps<T>> {
+export declare const ComboBoxMenuDataTids: {
+    readonly loading: "ComboBoxMenu__loading";
+    readonly failed: "ComboBoxMenu__failed";
+    readonly notFound: "ComboBoxMenu__notFound";
+    readonly items: "ComboBoxMenu__items";
+    readonly item: "ComboBoxMenu__item";
+};
+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 defaultProps: {
-        repeatRequest: () => undefined;
-        requestStatus: ComboBoxRequestStatus;
-    };
+    static defaultProps: DefaultProps<unknown>;
+    private getProps;
     private readonly locale;
     render(): JSX.Element | null;
     private renderItem;
 }
+export {};

package/cjs/internal/CustomComboBox/ComboBoxMenu.js

@@ -1,14 +1,60 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");exports.__esModule = true;exports.ComboBoxMenu = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireWildcard(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ComboBoxMenuDataTids = exports.ComboBoxMenu = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
+var _utils = require("../../lib/utils");
 var _decorators = require("../../lib/locale/decorators");
 var _Menu = require("../Menu");
 var _MenuItem = require("../../components/MenuItem");
 var _Spinner = require("../../components/Spinner");
 
 var _MenuSeparator = require("../../components/MenuSeparator");
+var _createPropsGetter = require("../../lib/createPropsGetter");
 
 var _CustomComboBoxTypes = require("./CustomComboBoxTypes");
-var _locale = require("./locale");var _dec, _class, _class2, _temp;var
+var _locale = require("./locale");var _dec, _class, _class2, _temp;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var ComboBoxMenuDataTids = {
+  loading: 'ComboBoxMenu__loading',
+  failed: 'ComboBoxMenu__failed',
+  notFound: 'ComboBoxMenu__notFound',
+  items: 'ComboBoxMenu__items',
+  item: 'ComboBoxMenu__item' };exports.ComboBoxMenuDataTids = ComboBoxMenuDataTids;var
+
+
+
+
+
+ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBoxLocaleHelper), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ComboBoxMenu, _React$Component);function ComboBoxMenu() {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.
+
+
+
+
+
+
+
+    getProps = (0, _createPropsGetter.createPropsGetter)(ComboBoxMenu.defaultProps);_this.
+
+
+
+
+
 
 
 
@@ -28,7 +74,6 @@ var _locale = require("./locale");var _dec, _class, _class2, _temp;var
 
 
 
-ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBoxLocaleHelper), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {(0, _inheritsLoose2.default)(ComboBoxMenu, _Component);function ComboBoxMenu() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _Component.call.apply(_Component, [this].concat(args)) || this;_this.
 
 
 
@@ -36,7 +81,6 @@ ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBo
 
 
 
-    locale = void 0;_this.
 
 
 
@@ -121,9 +165,8 @@ ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBo
       // NOTE this is undesireable feature, better
       // to remove it from further versions
       var _this$props = _this.props,renderItem = _this$props.renderItem,onValueChange = _this$props.onValueChange;
-      if (typeof item === 'function' || /*#__PURE__*/_react.default.isValidElement(item)) {
-        // @ts-ignore
-        var element = typeof item === 'function' ? item() : item;
+      if ((0, _utils.isFunction)(item) || /*#__PURE__*/_react.default.isValidElement(item)) {
+        var element = (0, _utils.isFunction)(item) ? item() : item;
         var props = Object.assign(
         {
           key: index,
@@ -135,8 +178,13 @@ ComboBoxMenu = (_dec = (0, _decorators.locale)('ComboBox', _locale.CustomComboBo
       }
 
       return /*#__PURE__*/(
-        _react.default.createElement(_MenuItem.MenuItem, { "data-tid": "ComboBoxMenu__item", onClick: function onClick() {return onValueChange(item);}, key: index },
+        _react.default.createElement(_MenuItem.MenuItem, {
+          "data-tid": ComboBoxMenuDataTids.item,
+          onClick: function onClick() {return onValueChange(item);},
+          key: index,
+          isMobile: _this.props.isMobile },
+
         function (state) {return renderItem(item, state);}));
 
 
-    };return _this;}var _proto = ComboBoxMenu.prototype;_proto.render = function render() {var _this$props2 = this.props,opened = _this$props2.opened,items = _this$props2.items,totalCount = _this$props2.totalCount,loading = _this$props2.loading,refMenu = _this$props2.refMenu,_this$props2$renderNo = _this$props2.renderNotFound,renderNotFound = _this$props2$renderNo === void 0 ? function () {return notFound;} : _this$props2$renderNo,renderTotalCount = _this$props2.renderTotalCount,maxMenuHeight = _this$props2.maxMenuHeight,requestStatus = _this$props2.requestStatus;var _this$locale = this.locale,notFound = _this$locale.notFound,errorNetworkButton = _this$locale.errorNetworkButton,errorNetworkMessage = _this$locale.errorNetworkMessage;if (!opened) {return null;}var renderAddButton = null;if (this.props.renderAddButton) {renderAddButton = this.props.renderAddButton();}if (loading && (!items || !items.length)) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { ref: refMenu }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true }, /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, { type: "mini", dimmed: true })));}if (items === null && requestStatus === _CustomComboBoxTypes.ComboBoxRequestStatus.Failed) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { ref: refMenu, maxHeight: maxMenuHeight }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true, key: "message" }, /*#__PURE__*/_react.default.createElement("div", { style: { maxWidth: 300, whiteSpace: 'normal' } }, errorNetworkMessage)), /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { link: true, onClick: this.props.repeatRequest, key: "retry" }, errorNetworkButton));}if ((items == null || items.length === 0) && renderNotFound) {var notFoundValue = renderNotFound();if (renderAddButton) return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { ref: refMenu }, renderAddButton);if (notFoundValue) return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { ref: refMenu }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { "data-tid": "ComboBoxMenu__notFound", disabled: true }, notFoundValue));return null;}var total = null;if (items && renderTotalCount && totalCount && items.length < totalCount) {total = /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true, key: "total" }, /*#__PURE__*/_react.default.createElement("div", { style: { fontSize: 12 } }, renderTotalCount(items.length, totalCount)));}return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { "data-tid": "ComboBoxMenu__items", ref: refMenu, maxHeight: maxMenuHeight }, items && items.map(this.renderItem), total, renderAddButton && [/*#__PURE__*/_react.default.createElement(_MenuSeparator.MenuSeparator, { key: "separator" }), renderAddButton]);};return ComboBoxMenu;}(_react.Component), _class2.__KONTUR_REACT_UI__ = 'ComboBoxMenu', _class2.defaultProps = { repeatRequest: function repeatRequest() {return undefined;}, requestStatus: _CustomComboBoxTypes.ComboBoxRequestStatus.Unknown }, _temp)) || _class);exports.ComboBoxMenu = ComboBoxMenu;
+    };return _this;}var _proto = ComboBoxMenu.prototype;_proto.render = function render() {var _this$props2 = this.props,opened = _this$props2.opened,items = _this$props2.items,totalCount = _this$props2.totalCount,loading = _this$props2.loading,refMenu = _this$props2.refMenu,_this$props2$renderNo = _this$props2.renderNotFound,renderNotFound = _this$props2$renderNo === void 0 ? function () {return notFound;} : _this$props2$renderNo,renderTotalCount = _this$props2.renderTotalCount,maxMenuHeight = _this$props2.maxMenuHeight,isMobile = _this$props2.isMobile;var requestStatus = this.getProps().requestStatus;var _this$locale = this.locale,notFound = _this$locale.notFound,errorNetworkButton = _this$locale.errorNetworkButton,errorNetworkMessage = _this$locale.errorNetworkMessage;if (!opened) {return null;}var renderAddButton = null;if (this.props.renderAddButton) {renderAddButton = this.props.renderAddButton();}var maxHeight = isMobile ? 'auto' : maxMenuHeight;if (loading && (!items || !items.length)) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile, "data-tid": ComboBoxMenuDataTids.loading }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true, isMobile: isMobile }, /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, { type: "mini", dimmed: true })));}if (items === null && requestStatus === _CustomComboBoxTypes.ComboBoxRequestStatus.Failed) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { ref: refMenu, maxHeight: maxHeight, disableScrollContainer: isMobile, "data-tid": ComboBoxMenuDataTids.failed }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true, key: "message", isMobile: isMobile }, /*#__PURE__*/_react.default.createElement("div", { style: { maxWidth: 300, whiteSpace: 'normal' } }, errorNetworkMessage)), /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { link: true, onClick: this.getProps().repeatRequest, key: "retry", isMobile: isMobile }, errorNetworkButton));}if (((0, _utils.isNullable)(items) || items.length === 0) && renderNotFound) {var notFoundValue = renderNotFound();if (renderAddButton) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile }, renderAddButton);}if (notFoundValue) {return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { maxHeight: maxHeight, ref: refMenu, disableScrollContainer: isMobile }, /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { "data-tid": ComboBoxMenuDataTids.notFound, disabled: true, isMobile: isMobile }, notFoundValue));}return null;}var total = null;var renderedItems = items && items.map(this.renderItem);var menuItems = renderedItems == null ? void 0 : renderedItems.filter(function (item) {return (0, _MenuItem.isMenuItem)(item);});var countItems = menuItems == null ? void 0 : menuItems.length;if (countItems && renderTotalCount && totalCount && countItems < totalCount) {total = /*#__PURE__*/_react.default.createElement(_MenuItem.MenuItem, { disabled: true, key: "total", isMobile: isMobile }, /*#__PURE__*/_react.default.createElement("div", { style: { fontSize: 12 } }, renderTotalCount(countItems, totalCount)));}return /*#__PURE__*/_react.default.createElement(_Menu.Menu, { "data-tid": ComboBoxMenuDataTids.items, ref: refMenu, maxHeight: maxHeight, disableScrollContainer: isMobile }, renderedItems, total, renderAddButton && [/*#__PURE__*/_react.default.createElement(_MenuSeparator.MenuSeparator, { key: "separator" }), renderAddButton]);};return ComboBoxMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'ComboBoxMenu', _class2.defaultProps = { repeatRequest: function repeatRequest() {return undefined;}, requestStatus: _CustomComboBoxTypes.ComboBoxRequestStatus.Unknown }, _temp)) || _class);exports.ComboBoxMenu = ComboBoxMenu;

package/cjs/internal/CustomComboBox/ComboBoxMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ComboBoxMenu.tsx"],"names":["ComboBoxMenu","CustomComboBoxLocaleHelper","locale","renderItem","item","index","props","onValueChange","React","isValidElement","element","Object","assign","key","onClick","cloneElement","state","render","opened","items","totalCount","loading","refMenu","renderNotFound","notFound","renderTotalCount","maxMenuHeight","requestStatus","errorNetworkButton","errorNetworkMessage","renderAddButton","length","ComboBoxRequestStatus","Failed","maxWidth","whiteSpace","repeatRequest","notFoundValue","total","fontSize","map","Component","__KONTUR_REACT_UI__","defaultProps","undefined","Unknown"],"mappings":"+UAAA;;AAEA;AACA;AACA;AACA;;AAEA;;AAEA;AACA,kC;;;;;;;;;;;;;;;;;;;;AAoBaA,Y,WADZ,wBAAO,UAAP,EAAmBC,kCAAnB,C;;;;;;;;AASkBC,IAAAA,M;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiFTC,IAAAA,U,GAAa,UAACC,IAAD,EAAUC,KAAV,EAA6C;AAChE;AACA;AAFgE,wBAG1B,MAAKC,KAHqB,CAGxDH,UAHwD,eAGxDA,UAHwD,CAG5CI,aAH4C,eAG5CA,aAH4C;AAIhE,UAAI,OAAOH,IAAP,KAAgB,UAAhB,iBAA8BI,eAAMC,cAAN,CAAqBL,IAArB,CAAlC,EAA8D;AAC5D;AACA,YAAMM,OAAO,GAAG,OAAON,IAAP,KAAgB,UAAhB,GAA6BA,IAAI,EAAjC,GAAsCA,IAAtD;AACA,YAAME,KAAK,GAAGK,MAAM,CAACC,MAAP;AACZ;AACEC,UAAAA,GAAG,EAAER,KADP;AAEES,UAAAA,OAAO,EAAE,2BAAMP,aAAa,CAACG,OAAO,CAACJ,KAAT,CAAnB,EAFX,EADY;;AAKZI,QAAAA,OAAO,CAACJ,KALI,CAAd;;AAOA,4BAAOE,eAAMO,YAAN,CAAmBL,OAAnB,EAA4BJ,KAA5B,CAAP;AACD;;AAED;AACE,qCAAC,kBAAD,IAAU,YAAS,oBAAnB,EAAwC,OAAO,EAAE,2BAAMC,aAAa,CAACH,IAAD,CAAnB,EAAjD,EAA4E,GAAG,EAAEC,KAAjF;AACG,kBAAAW,KAAK,UAAIb,UAAU,CAACC,IAAD,EAAOY,KAAP,CAAd,EADR,CADF;;;AAKD,K,0DArGMC,M,GAAP,kBAAgB,oBAWV,KAAKX,KAXK,CAEZY,MAFY,gBAEZA,MAFY,CAGZC,KAHY,gBAGZA,KAHY,CAIZC,UAJY,gBAIZA,UAJY,CAKZC,OALY,gBAKZA,OALY,CAMZC,OANY,gBAMZA,OANY,sCAOZC,cAPY,CAOZA,cAPY,sCAOK,oBAAMC,QAAN,EAPL,yBAQZC,gBARY,gBAQZA,gBARY,CASZC,aATY,gBASZA,aATY,CAUZC,aAVY,gBAUZA,aAVY,oBAagD,KAAKzB,MAbrD,CAaNsB,QAbM,gBAaNA,QAbM,CAaII,kBAbJ,gBAaIA,kBAbJ,CAawBC,mBAbxB,gBAawBA,mBAbxB,CAed,IAAI,CAACX,MAAL,EAAa,CACX,OAAO,IAAP,CACD,CAED,IAAIY,eAAe,GAAG,IAAtB,CACA,IAAI,KAAKxB,KAAL,CAAWwB,eAAf,EAAgC,CAC9BA,eAAe,GAAG,KAAKxB,KAAL,CAAWwB,eAAX,EAAlB,CACD,CAED,IAAIT,OAAO,KAAK,CAACF,KAAD,IAAU,CAACA,KAAK,CAACY,MAAtB,CAAX,EAA0C,CACxC,oBACE,6BAAC,UAAD,IAAM,GAAG,EAAET,OAAX,iBACE,6BAAC,kBAAD,IAAU,QAAQ,MAAlB,iBACE,6BAAC,gBAAD,IAAS,IAAI,EAAC,MAAd,EAAqB,MAAM,MAA3B,GADF,CADF,CADF,CAOD,CAED,IAAIH,KAAK,KAAK,IAAV,IAAkBQ,aAAa,KAAKK,2CAAsBC,MAA9D,EAAsE,CACpE,oBACE,6BAAC,UAAD,IAAM,GAAG,EAAEX,OAAX,EAAoB,SAAS,EAAEI,aAA/B,iBACE,6BAAC,kBAAD,IAAU,QAAQ,MAAlB,EAAmB,GAAG,EAAC,SAAvB,iBACE,sCAAK,KAAK,EAAE,EAAEQ,QAAQ,EAAE,GAAZ,EAAiBC,UAAU,EAAE,QAA7B,EAAZ,IAAsDN,mBAAtD,CADF,CADF,eAIE,6BAAC,kBAAD,IAAU,IAAI,MAAd,EAAe,OAAO,EAAE,KAAKvB,KAAL,CAAW8B,aAAnC,EAAkD,GAAG,EAAC,OAAtD,IACGR,kBADH,CAJF,CADF,CAUD,CAED,IAAI,CAACT,KAAK,IAAI,IAAT,IAAiBA,KAAK,CAACY,MAAN,KAAiB,CAAnC,KAAyCR,cAA7C,EAA6D,CAC3D,IAAMc,aAAa,GAAGd,cAAc,EAApC,CACA,IAAIO,eAAJ,EAAqB,oBAAO,6BAAC,UAAD,IAAM,GAAG,EAAER,OAAX,IAAqBQ,eAArB,CAAP,CACrB,IAAIO,aAAJ,EACE,oBACE,6BAAC,UAAD,IAAM,GAAG,EAAEf,OAAX,iBACE,6BAAC,kBAAD,IAAU,YAAS,wBAAnB,EAA4C,QAAQ,MAApD,IACGe,aADH,CADF,CADF,CAOF,OAAO,IAAP,CACD,CAED,IAAIC,KAAK,GAAG,IAAZ,CACA,IAAInB,KAAK,IAAIM,gBAAT,IAA6BL,UAA7B,IAA2CD,KAAK,CAACY,MAAN,GAAeX,UAA9D,EAA0E,CACxEkB,KAAK,gBACH,6BAAC,kBAAD,IAAU,QAAQ,MAAlB,EAAmB,GAAG,EAAC,OAAvB,iBACE,sCAAK,KAAK,EAAE,EAAEC,QAAQ,EAAE,EAAZ,EAAZ,IAA+Bd,gBAAgB,CAACN,KAAK,CAACY,MAAP,EAAeX,UAAf,CAA/C,CADF,CADF,CAKD,CAED,oBACE,6BAAC,UAAD,IAAM,YAAS,qBAAf,EAAqC,GAAG,EAAEE,OAA1C,EAAmD,SAAS,EAAEI,aAA9D,IACGP,KAAK,IAAIA,KAAK,CAACqB,GAAN,CAAU,KAAKrC,UAAf,CADZ,EAEGmC,KAFH,EAGGR,eAAe,IAAI,cAAC,6BAAC,4BAAD,IAAe,GAAG,EAAC,WAAnB,GAAD,EAAoCA,eAApC,CAHtB,CADF,CAOD,C,uBAvFkCW,gB,WACrBC,mB,GAAsB,c,UAEtBC,Y,GAAe,EAC3BP,aAAa,EAAE,iCAAMQ,SAAN,EADY,EAE3BjB,aAAa,EAAEK,2CAAsBa,OAFV,E","sourcesContent":["import React, { Component } from 'react';\r\n\r\nimport { locale } from '../../lib/locale/decorators';\r\nimport { Menu } from '../Menu';\r\nimport { MenuItem, MenuItemState } from '../../components/MenuItem';\r\nimport { Spinner } from '../../components/Spinner';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { MenuSeparator } from '../../components/MenuSeparator';\r\n\r\nimport { ComboBoxRequestStatus } from './CustomComboBoxTypes';\r\nimport { ComboBoxLocale, CustomComboBoxLocaleHelper } from './locale';\r\n\r\nexport interface ComboBoxMenuProps<T> {\r\n  opened?: boolean;\r\n  items?: Nullable<T[]>;\r\n  totalCount?: number;\r\n  loading?: boolean;\r\n  maxMenuHeight?: number | string;\r\n  refMenu?: (menu: Nullable<Menu>) => void;\r\n  renderNotFound?: () => React.ReactNode;\r\n  renderTotalCount?: (found: number, total: number) => React.ReactNode;\r\n  renderItem: (item: T, state: MenuItemState) => React.ReactNode;\r\n  onValueChange: (value: T) => any;\r\n  renderAddButton?: () => React.ReactNode;\r\n  caption?: React.ReactNode;\r\n  repeatRequest?: () => void;\r\n  requestStatus?: ComboBoxRequestStatus;\r\n}\r\n\r\n@locale('ComboBox', CustomComboBoxLocaleHelper)\r\nexport class ComboBoxMenu<T> extends Component<ComboBoxMenuProps<T>> {\r\n  public static __KONTUR_REACT_UI__ = 'ComboBoxMenu';\r\n\r\n  public static defaultProps = {\r\n    repeatRequest: () => undefined,\r\n    requestStatus: ComboBoxRequestStatus.Unknown,\r\n  };\r\n\r\n  private readonly locale!: ComboBoxLocale;\r\n\r\n  public render() {\r\n    const {\r\n      opened,\r\n      items,\r\n      totalCount,\r\n      loading,\r\n      refMenu,\r\n      renderNotFound = () => notFound,\r\n      renderTotalCount,\r\n      maxMenuHeight,\r\n      requestStatus,\r\n    } = this.props;\r\n\r\n    const { notFound, errorNetworkButton, errorNetworkMessage } = this.locale;\r\n\r\n    if (!opened) {\r\n      return null;\r\n    }\r\n\r\n    let renderAddButton = null;\r\n    if (this.props.renderAddButton) {\r\n      renderAddButton = this.props.renderAddButton();\r\n    }\r\n\r\n    if (loading && (!items || !items.length)) {\r\n      return (\r\n        <Menu ref={refMenu}>\r\n          <MenuItem disabled>\r\n            <Spinner type=\"mini\" dimmed />\r\n          </MenuItem>\r\n        </Menu>\r\n      );\r\n    }\r\n\r\n    if (items === null && requestStatus === ComboBoxRequestStatus.Failed) {\r\n      return (\r\n        <Menu ref={refMenu} maxHeight={maxMenuHeight}>\r\n          <MenuItem disabled key=\"message\">\r\n            <div style={{ maxWidth: 300, whiteSpace: 'normal' }}>{errorNetworkMessage}</div>\r\n          </MenuItem>\r\n          <MenuItem link onClick={this.props.repeatRequest} key=\"retry\">\r\n            {errorNetworkButton}\r\n          </MenuItem>\r\n        </Menu>\r\n      );\r\n    }\r\n\r\n    if ((items == null || items.length === 0) && renderNotFound) {\r\n      const notFoundValue = renderNotFound();\r\n      if (renderAddButton) return <Menu ref={refMenu}>{renderAddButton}</Menu>;\r\n      if (notFoundValue)\r\n        return (\r\n          <Menu ref={refMenu}>\r\n            <MenuItem data-tid=\"ComboBoxMenu__notFound\" disabled>\r\n              {notFoundValue}\r\n            </MenuItem>\r\n          </Menu>\r\n        );\r\n      return null;\r\n    }\r\n\r\n    let total = null;\r\n    if (items && renderTotalCount && totalCount && items.length < totalCount) {\r\n      total = (\r\n        <MenuItem disabled key=\"total\">\r\n          <div style={{ fontSize: 12 }}>{renderTotalCount(items.length, totalCount)}</div>\r\n        </MenuItem>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <Menu data-tid=\"ComboBoxMenu__items\" ref={refMenu} maxHeight={maxMenuHeight}>\r\n        {items && items.map(this.renderItem)}\r\n        {total}\r\n        {renderAddButton && [<MenuSeparator key=\"separator\" />, renderAddButton]}\r\n      </Menu>\r\n    );\r\n  }\r\n\r\n  private renderItem = (item: T, index: number): React.ReactNode => {\r\n    // NOTE this is undesireable feature, better\r\n    // to remove it from further versions\r\n    const { renderItem, onValueChange } = this.props;\r\n    if (typeof item === 'function' || React.isValidElement(item)) {\r\n      // @ts-ignore\r\n      const element = typeof item === 'function' ? item() : item;\r\n      const props = Object.assign(\r\n        {\r\n          key: index,\r\n          onClick: () => onValueChange(element.props),\r\n        },\r\n        element.props,\r\n      );\r\n      return React.cloneElement(element, props);\r\n    }\r\n\r\n    return (\r\n      <MenuItem data-tid=\"ComboBoxMenu__item\" onClick={() => onValueChange(item)} key={index}>\r\n        {state => renderItem(item, state)}\r\n      </MenuItem>\r\n    );\r\n  };\r\n}\r\n"]}
+{"version":3,"sources":["ComboBoxMenu.tsx"],"names":["ComboBoxMenuDataTids","loading","failed","notFound","items","item","ComboBoxMenu","CustomComboBoxLocaleHelper","getProps","defaultProps","renderItem","index","props","onValueChange","React","isValidElement","element","Object","assign","key","onClick","cloneElement","isMobile","state","render","opened","totalCount","refMenu","renderNotFound","renderTotalCount","maxMenuHeight","requestStatus","locale","errorNetworkButton","errorNetworkMessage","renderAddButton","maxHeight","length","ComboBoxRequestStatus","Failed","maxWidth","whiteSpace","repeatRequest","notFoundValue","total","renderedItems","map","menuItems","filter","countItems","fontSize","Component","__KONTUR_REACT_UI__","undefined","Unknown"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isFunction, isNullable } from '../../lib/utils';\nimport { locale } from '../../lib/locale/decorators';\nimport { Menu } from '../Menu';\nimport { isMenuItem, MenuItem, MenuItemState } from '../../components/MenuItem';\nimport { Spinner } from '../../components/Spinner';\nimport { Nullable } from '../../typings/utility-types';\nimport { MenuSeparator } from '../../components/MenuSeparator';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { ComboBoxRequestStatus } from './CustomComboBoxTypes';\nimport { ComboBoxLocale, CustomComboBoxLocaleHelper } from './locale';\n\nexport interface ComboBoxMenuProps<T> {\n  opened?: boolean;\n  items?: Nullable<T[]>;\n  totalCount?: number;\n  loading?: boolean;\n  maxMenuHeight?: number | string;\n  refMenu?: (menu: Nullable<Menu>) => void;\n  renderNotFound?: () => React.ReactNode;\n  renderTotalCount?: (found: number, total: number) => React.ReactNode;\n  renderItem: (item: T, state: MenuItemState) => React.ReactNode;\n  onValueChange: (value: T) => any;\n  renderAddButton?: () => React.ReactNode;\n  caption?: React.ReactNode;\n  repeatRequest?: () => void;\n  requestStatus?: ComboBoxRequestStatus;\n  isMobile?: boolean;\n}\n\nexport const ComboBoxMenuDataTids = {\n  loading: 'ComboBoxMenu__loading',\n  failed: 'ComboBoxMenu__failed',\n  notFound: 'ComboBoxMenu__notFound',\n  items: 'ComboBoxMenu__items',\n  item: 'ComboBoxMenu__item',\n} as const;\n\ntype DefaultProps<T> = Required<Pick<ComboBoxMenuProps<T>, 'repeatRequest' | 'requestStatus'>>;\n\n@locale('ComboBox', CustomComboBoxLocaleHelper)\nexport class ComboBoxMenu<T> extends React.Component<ComboBoxMenuProps<T>> {\n  public static __KONTUR_REACT_UI__ = 'ComboBoxMenu';\n\n  public static defaultProps: DefaultProps<unknown> = {\n    repeatRequest: () => undefined,\n    requestStatus: ComboBoxRequestStatus.Unknown,\n  };\n\n  private getProps = createPropsGetter(ComboBoxMenu.defaultProps);\n\n  private readonly locale!: ComboBoxLocale;\n\n  public render() {\n    const {\n      opened,\n      items,\n      totalCount,\n      loading,\n      refMenu,\n      renderNotFound = () => notFound,\n      renderTotalCount,\n      maxMenuHeight,\n      isMobile,\n    } = this.props;\n\n    const requestStatus = this.getProps().requestStatus;\n\n    const { notFound, errorNetworkButton, errorNetworkMessage } = this.locale;\n\n    if (!opened) {\n      return null;\n    }\n\n    let renderAddButton = null;\n    if (this.props.renderAddButton) {\n      renderAddButton = this.props.renderAddButton();\n    }\n\n    const maxHeight = isMobile ? 'auto' : maxMenuHeight;\n\n    if (loading && (!items || !items.length)) {\n      return (\n        <Menu\n          maxHeight={maxHeight}\n          ref={refMenu}\n          disableScrollContainer={isMobile}\n          data-tid={ComboBoxMenuDataTids.loading}\n        >\n          <MenuItem disabled isMobile={isMobile}>\n            <Spinner type=\"mini\" dimmed />\n          </MenuItem>\n        </Menu>\n      );\n    }\n\n    if (items === null && requestStatus === ComboBoxRequestStatus.Failed) {\n      return (\n        <Menu\n          ref={refMenu}\n          maxHeight={maxHeight}\n          disableScrollContainer={isMobile}\n          data-tid={ComboBoxMenuDataTids.failed}\n        >\n          <MenuItem disabled key=\"message\" isMobile={isMobile}>\n            <div style={{ maxWidth: 300, whiteSpace: 'normal' }}>{errorNetworkMessage}</div>\n          </MenuItem>\n          <MenuItem link onClick={this.getProps().repeatRequest} key=\"retry\" isMobile={isMobile}>\n            {errorNetworkButton}\n          </MenuItem>\n        </Menu>\n      );\n    }\n\n    if ((isNullable(items) || items.length === 0) && renderNotFound) {\n      const notFoundValue = renderNotFound();\n      if (renderAddButton) {\n        return (\n          <Menu maxHeight={maxHeight} ref={refMenu} disableScrollContainer={isMobile}>\n            {renderAddButton}\n          </Menu>\n        );\n      }\n\n      if (notFoundValue) {\n        return (\n          <Menu maxHeight={maxHeight} ref={refMenu} disableScrollContainer={isMobile}>\n            <MenuItem data-tid={ComboBoxMenuDataTids.notFound} disabled isMobile={isMobile}>\n              {notFoundValue}\n            </MenuItem>\n          </Menu>\n        );\n      }\n\n      return null;\n    }\n\n    let total = null;\n    const renderedItems = items && items.map(this.renderItem);\n    const menuItems = renderedItems?.filter((item) => {\n      return isMenuItem(item);\n    });\n    const countItems = menuItems?.length;\n\n    if (countItems && renderTotalCount && totalCount && countItems < totalCount) {\n      total = (\n        <MenuItem disabled key=\"total\" isMobile={isMobile}>\n          <div style={{ fontSize: 12 }}>{renderTotalCount(countItems, totalCount)}</div>\n        </MenuItem>\n      );\n    }\n\n    return (\n      <Menu data-tid={ComboBoxMenuDataTids.items} ref={refMenu} maxHeight={maxHeight} disableScrollContainer={isMobile}>\n        {renderedItems}\n        {total}\n        {renderAddButton && [<MenuSeparator key=\"separator\" />, renderAddButton]}\n      </Menu>\n    );\n  }\n\n  private renderItem = (item: T, index: number): React.ReactNode => {\n    // NOTE this is undesireable feature, better\n    // to remove it from further versions\n    const { renderItem, onValueChange } = this.props;\n    if (isFunction(item) || React.isValidElement(item)) {\n      const element = isFunction(item) ? item() : item;\n      const props = Object.assign(\n        {\n          key: index,\n          onClick: () => onValueChange(element.props),\n        },\n        element.props,\n      );\n      return React.cloneElement(element, props);\n    }\n\n    return (\n      <MenuItem\n        data-tid={ComboBoxMenuDataTids.item}\n        onClick={() => onValueChange(item)}\n        key={index}\n        isMobile={this.props.isMobile}\n      >\n        {(state) => renderItem(item, state)}\n      </MenuItem>\n    );\n  };\n}\n"]}

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

@@ -13,6 +13,9 @@ interface ComboBoxViewProps<T> extends CommonProps {
     disablePortal?: boolean;
     disabled?: boolean;
     editing?: boolean;
+    /**
+     * Cостояние валидации при ошибке.
+     */
     error?: boolean;
     items?: Nullable<T[]>;
     loading?: boolean;
@@ -24,11 +27,15 @@ interface ComboBoxViewProps<T> extends CommonProps {
     textValue?: string;
     totalCount?: number;
     value?: Nullable<T>;
+    /**
+     * Cостояние валидации при предупреждении.
+     */
     warning?: boolean;
     width?: string | number;
     maxLength?: number;
     maxMenuHeight?: number | string;
     leftIcon?: InputIconType;
+    rightIcon?: InputIconType;
     inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode'];
     onValueChange?: (value: T) => void;
     onClickOutside?: (e: Event) => void;
@@ -46,35 +53,42 @@ interface ComboBoxViewProps<T> extends CommonProps {
     renderNotFound?: () => React.ReactNode;
     renderTotalCount?: (found: number, total: number) => React.ReactNode;
     renderValue?: (item: T) => React.ReactNode;
-    renderAddButton: (query?: string) => React.ReactNode;
+    renderAddButton?: (query?: string) => React.ReactNode;
     repeatRequest?: () => void;
     requestStatus?: ComboBoxRequestStatus;
     refInput?: (input: Nullable<Input>) => void;
     refMenu?: (menu: Nullable<Menu>) => void;
     refInputLikeText?: (inputLikeText: Nullable<InputLikeText>) => void;
 }
-export declare class ComboBoxView<T> extends React.Component<ComboBoxViewProps<T>> {
+interface ComboBoxViewState {
+    isMobileOpened: boolean;
+}
+declare type DefaultProps<T> = Required<Pick<ComboBoxViewProps<T>, 'renderItem' | 'renderValue' | 'renderAddButton' | 'repeatRequest' | 'requestStatus' | 'onClickOutside' | 'onFocusOutside' | 'size' | 'width'>>;
+export declare class ComboBoxView<T> extends React.Component<ComboBoxViewProps<T>, ComboBoxViewState> {
     static __KONTUR_REACT_UI__: string;
-    static defaultProps: {
-        renderItem: (item: any) => any;
-        renderValue: (item: any) => any;
-        renderAddButton: () => null;
-        repeatRequest: () => undefined;
-        requestStatus: ComboBoxRequestStatus;
-        onClickOutside: () => void;
-        onFocusOutside: () => void;
-        size: string;
-        width: number;
-    };
+    static defaultProps: DefaultProps<unknown>;
+    private getProps;
     private input;
+    private setRootNode;
+    private mobileInput;
+    private isMobileLayout;
+    private dropdownContainerRef;
     componentDidMount(): void;
+    state: ComboBoxViewState;
     componentDidUpdate(prevProps: ComboBoxViewProps<T>): void;
     render(): JSX.Element;
+    private getComboBoxMenu;
+    private renderMenu;
+    private renderMobileMenu;
+    private handleCloseMobile;
+    private getParent;
     private renderAddButton;
     private renderInput;
+    private handleFocusMobile;
     private handleItemSelect;
     private refInput;
     private renderSpinner;
     private getRightIcon;
+    private refMobileInput;
 }
 export {};