npm - @skbkontur/react-ui - Versions diffs - 0.0.0-80ce75eca6 → 0.0.0-85ea551f96 - Mend

@skbkontur/react-ui 0.0.0-80ce75eca6 → 0.0.0-85ea551f96

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1782) hide show

package/cjs/internal/InternalMenu/InternalMenu.js CHANGED Viewed

@@ -1,6 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.InternalMenu = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var _classnames = _interopRequireDefault(require("classnames"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.InternalMenu = void 0;var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _identifiers = require("../../lib/events/keyboard/identifiers");
 var _ScrollContainer = require("../../components/ScrollContainer");
@@ -10,9 +8,11 @@ var _createPropsGetter = require("../../lib/createPropsGetter");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _Emotion = require("../../lib/theming/Emotion");
+var _rootNode = require("../../lib/rootNode");
 var _InternalMenu = require("./InternalMenu.styles");
-var _isActiveElement = require("./isActiveElement");var
+var _isActiveElement = require("./isActiveElement");var _class, _class2, _temp;var
@@ -37,7 +37,8 @@ var _isActiveElement = require("./isActiveElement");var
-InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(InternalMenu, _React$Component);function InternalMenu() {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.
+InternalMenu = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsLoose2.default)(InternalMenu, _React$PureComponent);function InternalMenu() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;_this.
@@ -58,7 +59,7 @@ InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.def
     theme = void 0;_this.
     scrollContainer = void 0;_this.
     highlighted = void 0;_this.
-    rootElement = void 0;_this.
+    setRootNode = void 0;_this.
     header = void 0;_this.
     footer = void 0;_this.
     getProps = (0, _createPropsGetter.createPropsGetter)(InternalMenu.defaultProps);_this.
@@ -175,17 +176,13 @@ InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.def
-    renderHeader = function () {var _cn;
+    renderHeader = function () {var _cx;
       return /*#__PURE__*/(
         _react.default.createElement("div", {
           ref: function ref(el) {return _this.header = el;},
-          className: (0, _classnames.default)((_cn = {}, _cn[
-          _InternalMenu.jsStyles.header()] = true, _cn[
-          _InternalMenu.jsStyles.fixedHeader()] = _this.state.scrollState !== 'top', _cn)) },
+          className: (0, _Emotion.cx)((_cx = {}, _cx[
+          _InternalMenu.styles.header()] = true, _cx[
+          _InternalMenu.styles.fixedHeader()] = _this.state.scrollState !== 'top', _cx)) },
         _this.props.header));
@@ -193,13 +190,13 @@ InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.def
     };_this.
-    renderFooter = function () {var _cn2;
+    renderFooter = function () {var _cx2;
       return /*#__PURE__*/(
         _react.default.createElement("div", {
           ref: function ref(el) {return _this.footer = el;},
-          className: (0, _classnames.default)((_cn2 = {}, _cn2[
-          _InternalMenu.jsStyles.footer()] = true, _cn2[
-          _InternalMenu.jsStyles.fixedFooter()] = _this.state.scrollState !== 'bottom', _cn2)) },
+          className: (0, _Emotion.cx)((_cx2 = {}, _cx2[
+          _InternalMenu.styles.footer()] = true, _cx2[
+          _InternalMenu.styles.fixedFooter()] = _this.state.scrollState !== 'bottom', _cx2)) },
         _this.props.footer));
@@ -207,10 +204,8 @@ InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.def
     };_this.
-    focusOnRootElement = function () {
-      if (_this.rootElement) {
-        _this.rootElement.focus();
-      }
+    focusOnRootElement = function () {var _getRootNode;
+      (_getRootNode = (0, _rootNode.getRootNode)((0, _assertThisInitialized2.default)(_this))) == null ? void 0 : _getRootNode.focus();
     };_this.
     shouldRecalculateMaxHeight = function (prevProps) {var _this$props =
@@ -231,9 +226,10 @@ InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.def
     calculateMaxHeight = function () {var
       maxHeight = _this.props.maxHeight;
       var parsedMaxHeight = maxHeight;
+      var rootNode = (0, _rootNode.getRootNode)((0, _assertThisInitialized2.default)(_this));
-      if (typeof maxHeight === 'string' && typeof window !== 'undefined' && _this.rootElement) {
-        var rootElementMaxHeight = window.getComputedStyle(_this.rootElement).maxHeight;
+      if (typeof maxHeight === 'string' && typeof window !== 'undefined' && rootNode) {
+        var rootElementMaxHeight = window.getComputedStyle(rootNode).maxHeight;
         if (rootElementMaxHeight) {
           parsedMaxHeight = parseFloat(rootElementMaxHeight);
@@ -282,7 +278,7 @@ InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.def
     scrollToSelected = function () {
       if (_this.scrollContainer && _this.highlighted) {
-        _this.scrollContainer.scrollTo(_reactDom.default.findDOMNode(_this.highlighted));
+        _this.scrollContainer.scrollTo((0, _rootNode.getRootNode)(_this.highlighted));
       }
     };_this.
@@ -308,11 +304,9 @@ InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.def
-    highlightItem = function (index) {
+    highlightItem = function (index) {var _getRootNode2;
       _this.setState({ highlightedIndex: index });
-      if (_this.rootElement) {
-        _this.rootElement.focus();
-      }
+      (_getRootNode2 = (0, _rootNode.getRootNode)((0, _assertThisInitialized2.default)(_this))) == null ? void 0 : _getRootNode2.focus();
     };_this.
     unhighlight = function () {
@@ -386,8 +380,8 @@ InternalMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.def
       if (_this.state.scrollState !== scrollState) {
         _this.setState({ scrollState: scrollState });
       }
-    };return _this;}var _proto = InternalMenu.prototype;_proto.componentDidMount = function componentDidMount() {this.setInitialSelection();this.calculateMaxHeight();};_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {if (this.shouldRecalculateMaxHeight(prevProps)) {this.calculateMaxHeight();}};_proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {if (nextProps.maxHeight !== this.props.maxHeight) {this.setState({ maxHeight: nextProps.maxHeight || 'none' });}};_proto.focus = function focus() {this.focusOnRootElement();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cn3,_this3 = this;var enableIconPadding = _react.default.Children.toArray(this.props.children).some(function (x) {return /*#__PURE__*/_react.default.isValidElement(x) && x.props.icon;});if (this.isEmpty()) {return null;}return /*#__PURE__*/_react.default.createElement("div", { className: (0, _classnames.default)((_cn3 = {}, _cn3[_InternalMenu.jsStyles.root(this.theme)] = true, _cn3[_InternalMenu.jsStyles.shadow()] = this.props.hasShadow, _cn3)), style: { width: this.props.width, maxHeight: this.state.maxHeight }, onKeyDown: this.handleKeyDown, ref: function ref(element) {_this3.rootElement = element;}, tabIndex: 0 }, this.props.header ? this.renderHeader() : null, /*#__PURE__*/_react.default.createElement(_ScrollContainer.ScrollContainer, { ref: this.refScrollContainer, maxHeight: this.props.maxHeight, preventWindowScroll: this.props.preventWindowScroll, onScrollStateChange: this.handleScrollStateChange }, _react.default.Children.map(this.props.children, function (child, index) {if (typeof child === 'string' || typeof child === 'number' || child == null) {return child;}if ( /*#__PURE__*/_react.default.isValidElement(child) && typeof child.type === 'string') {return child;}if (enableIconPadding && ((0, _MenuItem.isMenuItem)(child) || (0, _MenuHeader.isMenuHeader)(child))) {child = /*#__PURE__*/_react.default.cloneElement(child, { _enableIconPadding: true });}if ((0, _isActiveElement.isActiveElement)(child)) {var highlight = _this3.state.highlightedIndex === index;var ref = child.ref;var originalRef = ref;if (highlight) {ref = function ref(menuItem) {return _this3.refHighlighted(originalRef, menuItem);};}return /*#__PURE__*/_react.default.cloneElement(child, { ref: ref, state: highlight ? 'hover' : child.props.state, onClick: _this3.select.bind(_this3, index, false), onMouseEnter: function onMouseEnter(event) {_this3.highlightItem(index);if ((0, _MenuItem.isMenuItem)(child) && child.props.onMouseEnter) {child.props.onMouseEnter(event);}}, onMouseLeave: function onMouseLeave(event) {_this3.unhighlight();if ((0, _MenuItem.isMenuItem)(child) && child.props.onMouseLeave) {child.props.onMouseLeave(event);}} });}return child;})), this.props.footer ? this.renderFooter() : null);};_proto.refHighlighted = function refHighlighted(originalRef, menuItem) {this.highlighted = menuItem;if (!originalRef || typeof originalRef === 'string') {return;}if (typeof originalRef === 'function') {originalRef(menuItem);} else if (typeof originalRef === 'object') {// @ts-ignore see issue https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065
-      originalRef.current = menuItem;}};_proto.select = function select(index, shouldHandleHref, event) {var item = childrenToArray(this.props.children)[index];if ((0, _isActiveElement.isActiveElement)(item)) {if (shouldHandleHref && item.props.href) {if (item.props.target) {window.open(item.props.href, item.props.target);} else {location.href = item.props.href;}}if (item.props.onClick) {item.props.onClick(event);}if (this.props.onItemClick) {this.props.onItemClick(event);}return true;}return false;};_proto.move = function move(step) {this.setState(function (state, props) {var children = childrenToArray(props.children);if (!children.some(_isActiveElement.isActiveElement)) {return null;}var index = state.highlightedIndex;do {index += step;if (!props.cyclicSelection && (index < 0 || index > children.length)) {return null;}if (index < 0) {index = children.length - 1;} else if (index > children.length) {index = 0;}var child = children[index];if ((0, _isActiveElement.isActiveElement)(child)) {return { highlightedIndex: index };}} while (index !== state.highlightedIndex);return null;}, this.scrollToSelected);};_proto.isEmpty = function isEmpty() {var children = this.props.children;return !children || !childrenToArray(children).filter(isExist).length;};return InternalMenu;}(_react.default.Component);exports.InternalMenu = InternalMenu;InternalMenu.__KONTUR_REACT_UI__ = 'InternalMenu';InternalMenu.defaultProps = { width: 'auto', maxHeight: 300, hasShadow: true, preventWindowScroll: true, cyclicSelection: true, initialSelectedItemIndex: -1 };
+    };return _this;}var _proto = InternalMenu.prototype;_proto.componentDidMount = function componentDidMount() {this.setInitialSelection();this.calculateMaxHeight();};_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {if (this.shouldRecalculateMaxHeight(prevProps)) {this.calculateMaxHeight();}if (prevProps.maxHeight !== this.props.maxHeight) {this.setState({ maxHeight: this.props.maxHeight || 'none' });}};_proto.focus = function focus() {this.focusOnRootElement();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cx3,_this3 = this;var enableIconPadding = _react.default.Children.toArray(this.props.children).some(function (x) {return /*#__PURE__*/_react.default.isValidElement(x) && x.props.icon;});if (this.isEmpty()) {return null;}return /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx3 = {}, _cx3[_InternalMenu.styles.root(this.theme)] = true, _cx3[_InternalMenu.styles.shadow(this.theme)] = this.props.hasShadow, _cx3)), style: { width: this.props.width, maxHeight: this.state.maxHeight }, onKeyDown: this.handleKeyDown, ref: this.setRootNode, tabIndex: 0 }, this.props.header ? this.renderHeader() : null, /*#__PURE__*/_react.default.createElement(_ScrollContainer.ScrollContainer, { ref: this.refScrollContainer, maxHeight: this.props.maxHeight, preventWindowScroll: this.props.preventWindowScroll, onScrollStateChange: this.handleScrollStateChange }, _react.default.Children.map(this.props.children, function (child, index) {if (typeof child === 'string' || typeof child === 'number' || child == null) {return child;}if ( /*#__PURE__*/_react.default.isValidElement(child) && typeof child.type === 'string') {return child;}if (enableIconPadding && ((0, _MenuItem.isMenuItem)(child) || (0, _MenuHeader.isMenuHeader)(child))) {child = /*#__PURE__*/_react.default.cloneElement(child, { _enableIconPadding: true });}if ((0, _isActiveElement.isActiveElement)(child)) {var highlight = _this3.state.highlightedIndex === index;var ref = child.ref;var originalRef = ref;if (highlight) {ref = function ref(menuItem) {return _this3.refHighlighted(originalRef, menuItem);};}return /*#__PURE__*/_react.default.cloneElement(child, { ref: ref, state: highlight ? 'hover' : child.props.state, onClick: _this3.select.bind(_this3, index, false), onMouseEnter: function onMouseEnter(event) {_this3.highlightItem(index);if ((0, _MenuItem.isMenuItem)(child) && child.props.onMouseEnter) {child.props.onMouseEnter(event);}}, onMouseLeave: function onMouseLeave(event) {_this3.unhighlight();if ((0, _MenuItem.isMenuItem)(child) && child.props.onMouseLeave) {child.props.onMouseLeave(event);}} });}return child;})), this.props.footer ? this.renderFooter() : null);};_proto.refHighlighted = function refHighlighted(originalRef, menuItem) {this.highlighted = menuItem;if (!originalRef || typeof originalRef === 'string') {return;}if (typeof originalRef === 'function') {originalRef(menuItem);} else if (typeof originalRef === 'object') {// @ts-ignore see issue https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065
+      originalRef.current = menuItem;}};_proto.select = function select(index, shouldHandleHref, event) {var item = childrenToArray(this.props.children)[index];if ((0, _isActiveElement.isActiveElement)(item)) {if (shouldHandleHref && item.props.href) {if (item.props.target) {window.open(item.props.href, item.props.target);} else {location.href = item.props.href;}}if (item.props.onClick) {item.props.onClick(event);}if (this.props.onItemClick) {this.props.onItemClick(event);}return true;}return false;};_proto.move = function move(step) {this.setState(function (state, props) {var children = childrenToArray(props.children);if (!children.some(_isActiveElement.isActiveElement)) {return null;}var index = state.highlightedIndex;do {index += step;if (!props.cyclicSelection && (index < 0 || index > children.length)) {return null;}if (index < 0) {index = children.length - 1;} else if (index > children.length) {index = 0;}var child = children[index];if ((0, _isActiveElement.isActiveElement)(child)) {return { highlightedIndex: index };}} while (index !== state.highlightedIndex);return null;}, this.scrollToSelected);};_proto.isEmpty = function isEmpty() {var children = this.props.children;return !children || !childrenToArray(children).filter(isExist).length;};return InternalMenu;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'InternalMenu', _class2.defaultProps = { width: 'auto', maxHeight: 300, hasShadow: true, preventWindowScroll: true, cyclicSelection: true, initialSelectedItemIndex: -1 }, _temp)) || _class;exports.InternalMenu = InternalMenu;
 function isExist(value) {
   return value !== null && value !== undefined;

package/cjs/internal/InternalMenu/InternalMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InternalMenu.tsx"],"names":["InternalMenu","state","highlightedIndex","maxHeight","props","scrollState","theme","scrollContainer","highlighted","rootElement","header","footer","getProps","defaultProps","renderHeader","el","jsStyles","fixedHeader","renderFooter","fixedFooter","focusOnRootElement","focus","shouldRecalculateMaxHeight","prevProps","children","prevMaxHeight","prevHeader","prevFooter","prevChildrenCount","React","Children","count","calculateMaxHeight","parsedMaxHeight","window","rootElementMaxHeight","getComputedStyle","parseFloat","calculatedMaxHeight","getBoundingClientRect","height","setState","setInitialSelection","i","initialSelectedItemIndex","moveDown","refScrollContainer","scrollToSelected","scrollTo","ReactDOM","findDOMNode","highlightItem","index","unhighlight","moveUp","move","handleKeyDown","e","onKeyDown","defaultPrevented","preventDefault","onClick","handleScrollStateChange","componentDidMount","componentDidUpdate","prevState","UNSAFE_componentWillReceiveProps","nextProps","render","renderMain","enableIconPadding","toArray","some","x","isValidElement","icon","isEmpty","root","shadow","hasShadow","width","element","preventWindowScroll","map","child","type","cloneElement","_enableIconPadding","highlight","ref","originalRef","menuItem","refHighlighted","select","bind","onMouseEnter","event","onMouseLeave","current","shouldHandleHref","item","childrenToArray","href","target","open","location","onItemClick","step","isActiveElement","cyclicSelection","length","filter","isExist","Component","__KONTUR_REACT_UI__","value","undefined","ret","forEach","push"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport cn from 'classnames';\r\n\r\nimport { isKeyArrowDown, isKeyArrowUp, isKeyEnter } from '../../lib/events/keyboard/identifiers';\r\nimport { ScrollContainer, ScrollContainerScrollState } from '../../components/ScrollContainer';\r\nimport { isMenuItem, MenuItem, MenuItemProps } from '../../components/MenuItem';\r\nimport { isMenuHeader } from '../../components/MenuHeader';\r\nimport { createPropsGetter } from '../../lib/createPropsGetter';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nimport { jsStyles } from './InternalMenu.styles';\r\nimport { isActiveElement } from './isActiveElement';\r\n\r\ninterface MenuProps {\r\n children?: React.ReactNode;\r\n hasShadow?: boolean;\r\n maxHeight?: number \| string;\r\n onItemClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\r\n width?: number \| string;\r\n preventWindowScroll?: boolean;\r\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\r\n\r\n header?: React.ReactNode;\r\n footer?: React.ReactNode;\r\n\r\n // Циклический перебор айтемов меню (по-дефолтну включен)\r\n cyclicSelection?: boolean;\r\n initialSelectedItemIndex?: number;\r\n}\r\n\r\ninterface MenuState {\r\n highlightedIndex: number;\r\n maxHeight: number \| string;\r\n scrollState: ScrollContainerScrollState;\r\n}\r\n\r\nexport class InternalMenu extends React.Component<MenuProps, MenuState> {\r\n public static __KONTUR_REACT_UI__ = 'InternalMenu';\r\n\r\n public static defaultProps = {\r\n width: 'auto',\r\n maxHeight: 300,\r\n hasShadow: true,\r\n preventWindowScroll: true,\r\n cyclicSelection: true,\r\n initialSelectedItemIndex: -1,\r\n };\r\n\r\n public state: MenuState = {\r\n highlightedIndex: -1,\r\n maxHeight: this.props.maxHeight \|\| 'none',\r\n scrollState: 'top',\r\n };\r\n\r\n private theme!: Theme;\r\n private scrollContainer: Nullable<ScrollContainer>;\r\n private highlighted: Nullable<MenuItem>;\r\n private rootElement: Nullable<HTMLDivElement>;\r\n private header: Nullable<HTMLDivElement>;\r\n private footer: Nullable<HTMLDivElement>;\r\n private getProps = createPropsGetter(InternalMenu.defaultProps);\r\n\r\n public componentDidMount() {\r\n this.setInitialSelection();\r\n this.calculateMaxHeight();\r\n }\r\n\r\n public componentDidUpdate(prevProps: MenuProps, prevState: MenuState) {\r\n if (this.shouldRecalculateMaxHeight(prevProps)) {\r\n this.calculateMaxHeight();\r\n }\r\n }\r\n\r\n public UNSAFE_componentWillReceiveProps(nextProps: MenuProps) {\r\n if (nextProps.maxHeight !== this.props.maxHeight) {\r\n this.setState({\r\n maxHeight: nextProps.maxHeight \|\| 'none',\r\n });\r\n }\r\n }\r\n\r\n public focus() {\r\n this.focusOnRootElement();\r\n }\r\n\r\n public render() {\r\n return (\r\n <ThemeContext.Consumer>\r\n {theme => {\r\n this.theme = theme;\r\n return this.renderMain();\r\n }}\r\n </ThemeContext.Consumer>\r\n );\r\n }\r\n\r\n private renderMain() {\r\n const enableIconPadding = React.Children.toArray(this.props.children).some(\r\n x => React.isValidElement(x) && x.props.icon,\r\n );\r\n\r\n if (this.isEmpty()) {\r\n return null;\r\n }\r\n\r\n return (\r\n <div\r\n className={cn({\r\n [jsStyles.root(this.theme)]: true,\r\n [jsStyles.shadow()]: this.props.hasShadow,\r\n })}\r\n style={{\r\n width: this.props.width,\r\n maxHeight: this.state.maxHeight,\r\n }}\r\n onKeyDown={this.handleKeyDown}\r\n ref={element => {\r\n this.rootElement = element;\r\n }}\r\n tabIndex={0}\r\n >\r\n {this.props.header ? this.renderHeader() : null}\r\n <ScrollContainer\r\n ref={this.refScrollContainer}\r\n maxHeight={this.props.maxHeight}\r\n preventWindowScroll={this.props.preventWindowScroll}\r\n onScrollStateChange={this.handleScrollStateChange}\r\n >\r\n {React.Children.map(this.props.children, (child, index) => {\r\n if (typeof child === 'string' \|\| typeof child === 'number' \|\| child == null) {\r\n return child;\r\n }\r\n if (React.isValidElement(child) && typeof child.type === 'string') {\r\n return child;\r\n }\r\n\r\n if (enableIconPadding && (isMenuItem(child) \|\| isMenuHeader(child))) {\r\n child = React.cloneElement(child, {\r\n _enableIconPadding: true,\r\n });\r\n }\r\n\r\n if (isActiveElement(child)) {\r\n const highlight = this.state.highlightedIndex === index;\r\n\r\n let ref = child.ref;\r\n const originalRef = ref;\r\n if (highlight) {\r\n ref = menuItem => this.refHighlighted(originalRef, menuItem);\r\n }\r\n\r\n return React.cloneElement<MenuItemProps, MenuItem>(child, {\r\n ref,\r\n state: highlight ? 'hover' : child.props.state,\r\n onClick: this.select.bind(this, index, false),\r\n onMouseEnter: event => {\r\n this.highlightItem(index);\r\n if (isMenuItem(child) && child.props.onMouseEnter) {\r\n child.props.onMouseEnter(event);\r\n }\r\n },\r\n onMouseLeave: event => {\r\n this.unhighlight();\r\n if (isMenuItem(child) && child.props.onMouseLeave) {\r\n child.props.onMouseLeave(event);\r\n }\r\n },\r\n });\r\n }\r\n\r\n return child;\r\n })}\r\n </ScrollContainer>\r\n {this.props.footer ? this.renderFooter() : null}\r\n </div>\r\n );\r\n }\r\n\r\n private renderHeader = () => {\r\n return (\r\n <div\r\n ref={el => (this.header = el)}\r\n className={cn({\r\n [jsStyles.header()]: true,\r\n [jsStyles.fixedHeader()]: this.state.scrollState !== 'top',\r\n })}\r\n >\r\n {this.props.header}\r\n </div>\r\n );\r\n };\r\n\r\n private renderFooter = () => {\r\n return (\r\n <div\r\n ref={el => (this.footer = el)}\r\n className={cn({\r\n [jsStyles.footer()]: true,\r\n [jsStyles.fixedFooter()]: this.state.scrollState !== 'bottom',\r\n })}\r\n >\r\n {this.props.footer}\r\n </div>\r\n );\r\n };\r\n\r\n private focusOnRootElement = (): void => {\r\n if (this.rootElement) {\r\n this.rootElement.focus();\r\n }\r\n };\r\n\r\n private shouldRecalculateMaxHeight = (prevProps: MenuProps): boolean => {\r\n const { maxHeight, header, footer, children } = this.props;\r\n const prevMaxHeight = prevProps.maxHeight;\r\n const prevHeader = prevProps.header;\r\n const prevFooter = prevProps.footer;\r\n const prevChildrenCount = React.Children.count(prevProps.children);\r\n\r\n return (\r\n maxHeight !== prevMaxHeight \|\|\r\n footer !== prevFooter \|\|\r\n header !== prevHeader \|\|\r\n React.Children.count(children) !== prevChildrenCount\r\n );\r\n };\r\n\r\n private calculateMaxHeight = () => {\r\n const { maxHeight } = this.props;\r\n let parsedMaxHeight = maxHeight;\r\n\r\n if (typeof maxHeight === 'string' && typeof window !== 'undefined' && this.rootElement) {\r\n const rootElementMaxHeight = window.getComputedStyle(this.rootElement).maxHeight;\r\n\r\n if (rootElementMaxHeight) {\r\n parsedMaxHeight = parseFloat(rootElementMaxHeight);\r\n }\r\n }\r\n\r\n const calculatedMaxHeight =\r\n typeof parsedMaxHeight === 'number'\r\n ? parsedMaxHeight +\r\n ((this.header && this.header.getBoundingClientRect().height) \|\| 0) +\r\n ((this.footer && this.footer.getBoundingClientRect().height) \|\| 0)\r\n : maxHeight;\r\n\r\n this.setState({\r\n maxHeight: calculatedMaxHeight \|\| 'none',\r\n });\r\n };\r\n\r\n private setInitialSelection = () => {\r\n for (let i = this.getProps().initialSelectedItemIndex; i > -1; i--) {\r\n this.moveDown();\r\n }\r\n };\r\n\r\n private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\r\n this.scrollContainer = scrollContainer;\r\n };\r\n\r\n private refHighlighted(\r\n originalRef: string \| ((instance: MenuItem \| null) => void) \| React.RefObject<MenuItem> \| null \| undefined,\r\n menuItem: MenuItem \| null,\r\n ) {\r\n this.highlighted = menuItem;\r\n\r\n if (!originalRef \|\| typeof originalRef === 'string') {\r\n return;\r\n }\r\n\r\n if (typeof originalRef === 'function') {\r\n originalRef(menuItem);\r\n } else if (typeof originalRef === 'object') {\r\n // @ts-ignore see issue https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065\r\n originalRef.current = menuItem;\r\n }\r\n }\r\n\r\n private scrollToSelected = () => {\r\n if (this.scrollContainer && this.highlighted) {\r\n this.scrollContainer.scrollTo(ReactDOM.findDOMNode(this.highlighted) as HTMLElement);\r\n }\r\n };\r\n\r\n private select(index: number, shouldHandleHref: boolean, event: React.SyntheticEvent<HTMLElement>): boolean {\r\n const item = childrenToArray(this.props.children)[index];\r\n\r\n if (isActiveElement(item)) {\r\n if (shouldHandleHref && item.props.href) {\r\n if (item.props.target) {\r\n window.open(item.props.href, item.props.target);\r\n } else {\r\n location.href = item.props.href;\r\n }\r\n }\r\n if (item.props.onClick) {\r\n item.props.onClick(event as React.MouseEvent<HTMLElement>);\r\n }\r\n if (this.props.onItemClick) {\r\n this.props.onItemClick(event);\r\n }\r\n return true;\r\n }\r\n return false;\r\n }\r\n\r\n private highlightItem = (index: number): void => {\r\n this.setState({ highlightedIndex: index });\r\n if (this.rootElement) {\r\n this.rootElement.focus();\r\n }\r\n };\r\n\r\n private unhighlight = () => {\r\n this.setState({ highlightedIndex: -1 });\r\n };\r\n\r\n private move(step: number) {\r\n this.setState((state, props) => {\r\n const children = childrenToArray(props.children);\r\n if (!children.some(isActiveElement)) {\r\n return null;\r\n }\r\n let index = state.highlightedIndex;\r\n do {\r\n index += step;\r\n if (!props.cyclicSelection && (index < 0 \|\| index > children.length)) {\r\n return null;\r\n }\r\n\r\n if (index < 0) {\r\n index = children.length - 1;\r\n } else if (index > children.length) {\r\n index = 0;\r\n }\r\n\r\n const child = children[index];\r\n if (isActiveElement(child)) {\r\n return { highlightedIndex: index };\r\n }\r\n } while (index !== state.highlightedIndex);\r\n return null;\r\n }, this.scrollToSelected);\r\n }\r\n\r\n private moveUp = () => {\r\n this.move(-1);\r\n };\r\n\r\n private moveDown = () => {\r\n this.move(1);\r\n };\r\n\r\n private isEmpty() {\r\n const { children } = this.props;\r\n return !children \|\| !childrenToArray(children).filter(isExist).length;\r\n }\r\n\r\n private handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>): void => {\r\n if (typeof this.props.onKeyDown === 'function') {\r\n this.props.onKeyDown(e);\r\n }\r\n\r\n if (e.defaultPrevented) {\r\n return;\r\n }\r\n\r\n if (isKeyArrowUp(e)) {\r\n e.preventDefault();\r\n this.moveUp();\r\n } else if (isKeyArrowDown(e)) {\r\n e.preventDefault();\r\n this.moveDown();\r\n } else if (isKeyEnter(e)) {\r\n if (this.highlighted && this.highlighted.props.onClick) {\r\n this.highlighted.props.onClick(e);\r\n }\r\n }\r\n };\r\n\r\n private handleScrollStateChange = (scrollState: ScrollContainerScrollState) => {\r\n if (this.state.scrollState !== scrollState) {\r\n this.setState({ scrollState });\r\n }\r\n };\r\n}\r\n\r\nfunction isExist(value: any): value is any {\r\n return value !== null && value !== undefined;\r\n}\r\n\r\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\r\n const ret: React.ReactNode[] = [];\r\n // Use forEach instead of map to avoid cloning for key unifying.\r\n React.Children.forEach(children, child => {\r\n ret.push(child);\r\n });\r\n return ret;\r\n}\r\n"]}
1	+ {"version":3,"sources":["InternalMenu.tsx"],"names":["InternalMenu","rootNode","state","highlightedIndex","maxHeight","props","scrollState","theme","scrollContainer","highlighted","setRootNode","header","footer","getProps","defaultProps","renderHeader","el","styles","fixedHeader","renderFooter","fixedFooter","focusOnRootElement","focus","shouldRecalculateMaxHeight","prevProps","children","prevMaxHeight","prevHeader","prevFooter","prevChildrenCount","React","Children","count","calculateMaxHeight","parsedMaxHeight","window","rootElementMaxHeight","getComputedStyle","parseFloat","calculatedMaxHeight","getBoundingClientRect","height","setState","setInitialSelection","i","initialSelectedItemIndex","moveDown","refScrollContainer","scrollToSelected","scrollTo","highlightItem","index","unhighlight","moveUp","move","handleKeyDown","e","onKeyDown","defaultPrevented","preventDefault","onClick","handleScrollStateChange","componentDidMount","componentDidUpdate","prevState","render","renderMain","enableIconPadding","toArray","some","x","isValidElement","icon","isEmpty","root","shadow","hasShadow","width","preventWindowScroll","map","child","type","cloneElement","_enableIconPadding","highlight","ref","originalRef","menuItem","refHighlighted","select","bind","onMouseEnter","event","onMouseLeave","current","shouldHandleHref","item","childrenToArray","href","target","open","location","onItemClick","step","isActiveElement","cyclicSelection","length","filter","isExist","PureComponent","__KONTUR_REACT_UI__","value","undefined","ret","forEach","push"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isKeyArrowDown, isKeyArrowUp, isKeyEnter } from '../../lib/events/keyboard/identifiers';\nimport { ScrollContainer, ScrollContainerScrollState } from '../../components/ScrollContainer';\nimport { isMenuItem, MenuItem, MenuItemProps } from '../../components/MenuItem';\nimport { isMenuHeader } from '../../components/MenuHeader';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './InternalMenu.styles';\nimport { isActiveElement } from './isActiveElement';\n\ninterface MenuProps {\n children?: React.ReactNode;\n hasShadow?: boolean;\n maxHeight?: number \| string;\n onItemClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\n width?: number \| string;\n preventWindowScroll?: boolean;\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n\n header?: React.ReactNode;\n footer?: React.ReactNode;\n\n // Циклический перебор айтемов меню (по-дефолтну включен)\n cyclicSelection?: boolean;\n initialSelectedItemIndex?: number;\n}\n\ninterface MenuState {\n highlightedIndex: number;\n maxHeight: number \| string;\n scrollState: ScrollContainerScrollState;\n}\n\n@rootNode\nexport class InternalMenu extends React.PureComponent<MenuProps, MenuState> {\n public static __KONTUR_REACT_UI__ = 'InternalMenu';\n\n public static defaultProps = {\n width: 'auto',\n maxHeight: 300,\n hasShadow: true,\n preventWindowScroll: true,\n cyclicSelection: true,\n initialSelectedItemIndex: -1,\n };\n\n public state: MenuState = {\n highlightedIndex: -1,\n maxHeight: this.props.maxHeight \|\| 'none',\n scrollState: 'top',\n };\n\n private theme!: Theme;\n private scrollContainer: Nullable<ScrollContainer>;\n private highlighted: Nullable<MenuItem>;\n private setRootNode!: TSetRootNode;\n private header: Nullable<HTMLDivElement>;\n private footer: Nullable<HTMLDivElement>;\n private getProps = createPropsGetter(InternalMenu.defaultProps);\n\n public componentDidMount() {\n this.setInitialSelection();\n this.calculateMaxHeight();\n }\n\n public componentDidUpdate(prevProps: MenuProps, prevState: MenuState) {\n if (this.shouldRecalculateMaxHeight(prevProps)) {\n this.calculateMaxHeight();\n }\n\n if (prevProps.maxHeight !== this.props.maxHeight) {\n this.setState({\n maxHeight: this.props.maxHeight \|\| 'none',\n });\n }\n }\n\n public focus() {\n this.focusOnRootElement();\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const enableIconPadding = React.Children.toArray(this.props.children).some(\n (x) => React.isValidElement(x) && x.props.icon,\n );\n\n if (this.isEmpty()) {\n return null;\n }\n\n return (\n <div\n className={cx({\n [styles.root(this.theme)]: true,\n [styles.shadow(this.theme)]: this.props.hasShadow,\n })}\n style={{\n width: this.props.width,\n maxHeight: this.state.maxHeight,\n }}\n onKeyDown={this.handleKeyDown}\n ref={this.setRootNode}\n tabIndex={0}\n >\n {this.props.header ? this.renderHeader() : null}\n <ScrollContainer\n ref={this.refScrollContainer}\n maxHeight={this.props.maxHeight}\n preventWindowScroll={this.props.preventWindowScroll}\n onScrollStateChange={this.handleScrollStateChange}\n >\n {React.Children.map(this.props.children, (child, index) => {\n if (typeof child === 'string' \|\| typeof child === 'number' \|\| child == null) {\n return child;\n }\n if (React.isValidElement(child) && typeof child.type === 'string') {\n return child;\n }\n\n if (enableIconPadding && (isMenuItem(child) \|\| isMenuHeader(child))) {\n child = React.cloneElement(child, {\n _enableIconPadding: true,\n });\n }\n\n if (isActiveElement(child)) {\n const highlight = this.state.highlightedIndex === index;\n\n let ref = child.ref;\n const originalRef = ref;\n if (highlight) {\n ref = (menuItem) => this.refHighlighted(originalRef, menuItem);\n }\n\n return React.cloneElement<MenuItemProps, MenuItem>(child, {\n ref,\n state: highlight ? 'hover' : child.props.state,\n onClick: this.select.bind(this, index, false),\n onMouseEnter: (event) => {\n this.highlightItem(index);\n if (isMenuItem(child) && child.props.onMouseEnter) {\n child.props.onMouseEnter(event);\n }\n },\n onMouseLeave: (event) => {\n this.unhighlight();\n if (isMenuItem(child) && child.props.onMouseLeave) {\n child.props.onMouseLeave(event);\n }\n },\n });\n }\n\n return child;\n })}\n </ScrollContainer>\n {this.props.footer ? this.renderFooter() : null}\n </div>\n );\n }\n\n private renderHeader = () => {\n return (\n <div\n ref={(el) => (this.header = el)}\n className={cx({\n [styles.header()]: true,\n [styles.fixedHeader()]: this.state.scrollState !== 'top',\n })}\n >\n {this.props.header}\n </div>\n );\n };\n\n private renderFooter = () => {\n return (\n <div\n ref={(el) => (this.footer = el)}\n className={cx({\n [styles.footer()]: true,\n [styles.fixedFooter()]: this.state.scrollState !== 'bottom',\n })}\n >\n {this.props.footer}\n </div>\n );\n };\n\n private focusOnRootElement = (): void => {\n getRootNode(this)?.focus();\n };\n\n private shouldRecalculateMaxHeight = (prevProps: MenuProps): boolean => {\n const { maxHeight, header, footer, children } = this.props;\n const prevMaxHeight = prevProps.maxHeight;\n const prevHeader = prevProps.header;\n const prevFooter = prevProps.footer;\n const prevChildrenCount = React.Children.count(prevProps.children);\n\n return (\n maxHeight !== prevMaxHeight \|\|\n footer !== prevFooter \|\|\n header !== prevHeader \|\|\n React.Children.count(children) !== prevChildrenCount\n );\n };\n\n private calculateMaxHeight = () => {\n const { maxHeight } = this.props;\n let parsedMaxHeight = maxHeight;\n const rootNode = getRootNode(this);\n\n if (typeof maxHeight === 'string' && typeof window !== 'undefined' && rootNode) {\n const rootElementMaxHeight = window.getComputedStyle(rootNode).maxHeight;\n\n if (rootElementMaxHeight) {\n parsedMaxHeight = parseFloat(rootElementMaxHeight);\n }\n }\n\n const calculatedMaxHeight =\n typeof parsedMaxHeight === 'number'\n ? parsedMaxHeight +\n ((this.header && this.header.getBoundingClientRect().height) \|\| 0) +\n ((this.footer && this.footer.getBoundingClientRect().height) \|\| 0)\n : maxHeight;\n\n this.setState({\n maxHeight: calculatedMaxHeight \|\| 'none',\n });\n };\n\n private setInitialSelection = () => {\n for (let i = this.getProps().initialSelectedItemIndex; i > -1; i--) {\n this.moveDown();\n }\n };\n\n private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\n this.scrollContainer = scrollContainer;\n };\n\n private refHighlighted(\n originalRef: string \| ((instance: MenuItem \| null) => void) \| React.RefObject<MenuItem> \| null \| undefined,\n menuItem: MenuItem \| null,\n ) {\n this.highlighted = menuItem;\n\n if (!originalRef \|\| typeof originalRef === 'string') {\n return;\n }\n\n if (typeof originalRef === 'function') {\n originalRef(menuItem);\n } else if (typeof originalRef === 'object') {\n // @ts-ignore see issue https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065\n originalRef.current = menuItem;\n }\n }\n\n private scrollToSelected = () => {\n if (this.scrollContainer && this.highlighted) {\n this.scrollContainer.scrollTo(getRootNode(this.highlighted));\n }\n };\n\n private select(index: number, shouldHandleHref: boolean, event: React.SyntheticEvent<HTMLElement>): boolean {\n const item = childrenToArray(this.props.children)[index];\n\n if (isActiveElement(item)) {\n if (shouldHandleHref && item.props.href) {\n if (item.props.target) {\n window.open(item.props.href, item.props.target);\n } else {\n location.href = item.props.href;\n }\n }\n if (item.props.onClick) {\n item.props.onClick(event as React.MouseEvent<HTMLElement>);\n }\n if (this.props.onItemClick) {\n this.props.onItemClick(event);\n }\n return true;\n }\n return false;\n }\n\n private highlightItem = (index: number): void => {\n this.setState({ highlightedIndex: index });\n getRootNode(this)?.focus();\n };\n\n private unhighlight = () => {\n this.setState({ highlightedIndex: -1 });\n };\n\n private move(step: number) {\n this.setState((state, props) => {\n const children = childrenToArray(props.children);\n if (!children.some(isActiveElement)) {\n return null;\n }\n let index = state.highlightedIndex;\n do {\n index += step;\n if (!props.cyclicSelection && (index < 0 \|\| index > children.length)) {\n return null;\n }\n\n if (index < 0) {\n index = children.length - 1;\n } else if (index > children.length) {\n index = 0;\n }\n\n const child = children[index];\n if (isActiveElement(child)) {\n return { highlightedIndex: index };\n }\n } while (index !== state.highlightedIndex);\n return null;\n }, this.scrollToSelected);\n }\n\n private moveUp = () => {\n this.move(-1);\n };\n\n private moveDown = () => {\n this.move(1);\n };\n\n private isEmpty() {\n const { children } = this.props;\n return !children \|\| !childrenToArray(children).filter(isExist).length;\n }\n\n private handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>): void => {\n if (typeof this.props.onKeyDown === 'function') {\n this.props.onKeyDown(e);\n }\n\n if (e.defaultPrevented) {\n return;\n }\n\n if (isKeyArrowUp(e)) {\n e.preventDefault();\n this.moveUp();\n } else if (isKeyArrowDown(e)) {\n e.preventDefault();\n this.moveDown();\n } else if (isKeyEnter(e)) {\n if (this.highlighted && this.highlighted.props.onClick) {\n this.highlighted.props.onClick(e);\n }\n }\n };\n\n private handleScrollStateChange = (scrollState: ScrollContainerScrollState) => {\n if (this.state.scrollState !== scrollState) {\n this.setState({ scrollState });\n }\n };\n}\n\nfunction isExist(value: any): value is any {\n return value !== null && value !== undefined;\n}\n\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\n const ret: React.ReactNode[] = [];\n // Use forEach instead of map to avoid cloning for key unifying.\n React.Children.forEach(children, (child) => {\n ret.push(child);\n });\n return ret;\n}\n"]}

package/cjs/internal/InternalMenu/InternalMenu.styles.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
-export declare const jsStyles: {
-    root(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
-    shadow(): string;
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    root(t: Theme): string;
+    shadow(t: Theme): string;
     header(): string;
     footer(): string;
     fixedHeader(): string;

package/cjs/internal/InternalMenu/InternalMenu.styles.js CHANGED Viewed

@@ -1,9 +1,9 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");function _templateObject6() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);\n    "]);_templateObject6 = function _templateObject6() {return data;};return data;}function _templateObject5() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);\n    "]);_templateObject5 = function _templateObject5() {return data;};return data;}function _templateObject4() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      bottom: -5px;\n      position: relative;\n      z-index: 1;\n      width: 100%;\n      overflow: hidden;\n      line-height: 18px;\n      box-sizing: border-box;\n      padding: 6px 18px 7px 8px;\n    "]);_templateObject4 = function _templateObject4() {return data;};return data;}function _templateObject3() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      top: -5px;\n      position: relative;\n      z-index: 1;\n      width: 100%;\n      overflow: hidden;\n      line-height: 18px;\n      box-sizing: border-box;\n      padding: 6px 18px 7px 8px;\n    "]);_templateObject3 = function _templateObject3() {return data;};return data;}function _templateObject2() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: 1px solid #d5d5d5;\n      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);\n    "]);_templateObject2 = function _templateObject2() {return data;};return data;}function _templateObject() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      overflow: auto;\n      padding: 5px 0;\n      outline: none;\n      background: ", ";\n    "]);_templateObject = function _templateObject() {return data;};return data;}
+"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");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-var styles = {
+var styles = (0, _Emotion.memoizeStyle)({
   root: function root(t) {
-    return (0, _Emotion.css)(_templateObject(),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      overflow: auto;\n      padding: 5px 0;\n      outline: none;\n      background: ", ";\n    "])),
@@ -11,15 +11,15 @@ var styles = {
   },
-  shadow: function shadow() {
-    return (0, _Emotion.css)(_templateObject2());
+  shadow: function shadow(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", ";\n      box-shadow: ", ";\n    "])),
+    t.menuBorder,
+    t.menuShadow);
   },
   header: function header() {
-    return (0, _Emotion.css)(_templateObject3());
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      top: -5px;\n      position: relative;\n      z-index: 1;\n      width: 100%;\n      overflow: hidden;\n      line-height: 18px;\n      box-sizing: border-box;\n      padding: 6px 18px 7px 8px;\n    "])));
@@ -32,7 +32,7 @@ var styles = {
   },
   footer: function footer() {
-    return (0, _Emotion.css)(_templateObject4());
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      bottom: -5px;\n      position: relative;\n      z-index: 1;\n      width: 100%;\n      overflow: hidden;\n      line-height: 18px;\n      box-sizing: border-box;\n      padding: 6px 18px 7px 8px;\n    "])));
@@ -45,16 +45,13 @@ var styles = {
   },
   fixedHeader: function fixedHeader() {
-    return (0, _Emotion.css)(_templateObject5());
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);\n    "])));
   },
   fixedFooter: function fixedFooter() {
-    return (0, _Emotion.css)(_templateObject6());
-  } };
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);\n    "])));
-var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;
+  } });exports.styles = styles;

package/cjs/internal/InternalMenu/InternalMenu.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InternalMenu.styles.ts"],"names":["styles","root","t","css","bgDefault","shadow","header","footer","fixedHeader","fixedFooter"~~,"jsStyles"~~],"mappings":"~~8QAAA~~,oD;;;~~AAGA~~,IAAMA,MAAM,GAAG;~~AACbC~~,EAAAA,~~IADa~~,~~gBACRC~~,~~CADQ~~,~~EACE~~;AACb,eAAOC,YAAP;;;;AAIgBD,IAAAA,CAAC,CAACE,SAJlB;;AAMD,~~GARY~~;;~~AAUbC~~,EAAAA,~~MAVa~~,~~oBAUJ~~;~~AACP~~,~~eAAOF~~,YAAP~~;;;;~~AAID,~~GAfY~~;;~~AAiBbG~~,EAAAA,~~MAjBa~~,~~oBAiBJ~~;AACP,~~eAAOH~~,YAAP;;;;;;;;;;AAUD,~~GA5BY~~;;~~AA8BbI~~,EAAAA,~~MA9Ba~~,~~oBA8BJ~~;AACP,~~eAAOJ~~,YAAP;;;;;;;;;;AAUD,~~GAzCY~~;;~~AA2CbK~~,EAAAA,~~WA3Ca~~,~~yBA2CC~~;AACZ,~~eAAOL~~,YAAP;;;AAGD,GA/CY;;~~AAiDbM~~,EAAAA,~~WAjDa~~,~~yBAiDC~~;AACZ,~~eAAON~~,YAAP;;;AAGD,~~GArDY~~,~~EAAf;;;AAwDO~~,~~IAAMO~~,~~QAAQ,GAAG,2BAAaV,MAAb,CAAjB,~~C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\~~r\nconst~~ styles = {\r\n root(t: Theme) {\r\n return css`\r\n overflow: auto;\r\n padding: 5px 0;\r\n outline: none;\r\n background: ${t.bgDefault};\r\n `;\r\n },\r\n\r\n shadow() {\r\n return css`\r\n border: ~~1px solid #d5d5d5~~;\r\n box-shadow: ~~0 2px 6px rgba(0, 0, 0, 0~~.2);\r\n `;\r\n },\r\n\r\n header() {\r\n return css`\r\n top: -5px;\r\n position: relative;\r\n z-index: 1;\r\n width: 100%;\r\n overflow: hidden;\r\n line-height: 18px;\r\n box-sizing: border-box;\r\n padding: 6px 18px 7px 8px;\r\n `;\r\n },\r\n\r\n footer() {\r\n return css`\r\n bottom: -5px;\r\n position: relative;\r\n z-index: 1;\r\n width: 100%;\r\n overflow: hidden;\r\n line-height: 18px;\r\n box-sizing: border-box;\r\n padding: 6px 18px 7px 8px;\r\n `;\r\n },\r\n\r\n fixedHeader() {\r\n return css`\r\n box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);\r\n `;\r\n },\r\n\r\n fixedFooter() {\r\n return css`\r\n box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);\r\n `;\r\n },\r\n}~~;\r\n\r\nexport const jsStyles = memoizeStyle(styles~~);\r\n"]}
1	+ {"version":3,"sources":["InternalMenu.styles.ts"],"names":["styles","root","t","css","bgDefault","shadow","menuBorder","menuShadow","header","footer","fixedHeader","fixedFooter"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;;;;AAIgBD,IAAAA,CAAC,CAACE,SAJlB;;AAMD,GARgC;;AAUjCC,EAAAA,MAViC,kBAU1BH,CAV0B,EAUhB;AACf,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACI,UADd;AAEgBJ,IAAAA,CAAC,CAACK,UAFlB;;AAID,GAfgC;;AAiBjCC,EAAAA,MAjBiC,oBAiBxB;AACP,eAAOL,YAAP;;;;;;;;;;AAUD,GA5BgC;;AA8BjCM,EAAAA,MA9BiC,oBA8BxB;AACP,eAAON,YAAP;;;;;;;;;;AAUD,GAzCgC;;AA2CjCO,EAAAA,WA3CiC,yBA2CnB;AACZ,eAAOP,YAAP;;;AAGD,GA/CgC;;AAiDjCQ,EAAAA,WAjDiC,yBAiDnB;AACZ,eAAOR,YAAP;;;AAGD,GArDgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n root(t: Theme) {\n return css`\n overflow: auto;\n padding: 5px 0;\n outline: none;\n background: ${t.bgDefault};\n `;\n },\n\n shadow(t: Theme) {\n return css`\n border: ${t.menuBorder};\n box-shadow: ${t.menuShadow};\n `;\n },\n\n header() {\n return css`\n top: -5px;\n position: relative;\n z-index: 1;\n width: 100%;\n overflow: hidden;\n line-height: 18px;\n box-sizing: border-box;\n padding: 6px 18px 7px 8px;\n `;\n },\n\n footer() {\n return css`\n bottom: -5px;\n position: relative;\n z-index: 1;\n width: 100%;\n overflow: hidden;\n line-height: 18px;\n box-sizing: border-box;\n padding: 6px 18px 7px 8px;\n `;\n },\n\n fixedHeader() {\n return css`\n box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);\n `;\n },\n\n fixedFooter() {\n return css`\n box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);\n `;\n },\n});\n"]}

package/cjs/internal/InternalMenu/index.js.map CHANGED Viewed

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

package/cjs/internal/InternalMenu/isActiveElement.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["isActiveElement.tsx"],"names":["isActiveElement","element","props","disabled"],"mappings":";;AAEA;;AAEO,SAASA,eAAT,CAAyBC,OAAzB,EAAmG;AACxG,SAAO,0BAAWA,OAAX,KAAuB,CAACA,OAAO,CAACC,KAAR,CAAcC,QAA7C;AACD","sourcesContent":["import React from 'react';\r\n\r\nimport { MenuItem, MenuItemProps, isMenuItem } from '../../components/MenuItem';\r\n\r\nexport function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem> {\r\n return isMenuItem(element) && !element.props.disabled;\r\n}\r\n"]}
1	+ {"version":3,"sources":["isActiveElement.tsx"],"names":["isActiveElement","element","props","disabled"],"mappings":";;AAEA;;AAEO,SAASA,eAAT,CAAyBC,OAAzB,EAAmG;AACxG,SAAO,0BAAWA,OAAX,KAAuB,CAACA,OAAO,CAACC,KAAR,CAAcC,QAA7C;AACD","sourcesContent":["import React from 'react';\n\nimport { MenuItem, MenuItemProps, isMenuItem } from '../../components/MenuItem';\n\nexport function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem> {\n return isMenuItem(element) && !element.props.disabled;\n}\n"]}

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 /**
  * FIGURE SPACE
  *

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.js CHANGED Viewed

@@ -2,13 +2,13 @@
 var _MaskCharLowLine = require("./MaskCharLowLine.styles");
-/**
- * FIGURE SPACE
- *
- * space equal to tabular width of a font this is equivalent to the digit width of fonts with fixed-width digits
- *
- * @see http://www.fileformat.info/info/unicode/char/2007/index.htm
+/**
+ * FIGURE SPACE
+ *
+ * space equal to tabular width of a font this is equivalent to the digit width of fonts with fixed-width digits
+ *
+ * @see http://www.fileformat.info/info/unicode/char/2007/index.htm
  */
 var MASK_CHAR_EXEMPLAR = String.fromCharCode(0x2007);exports.MASK_CHAR_EXEMPLAR = MASK_CHAR_EXEMPLAR;
-var MaskCharLowLine = function MaskCharLowLine() {return /*#__PURE__*/_react.default.createElement("span", { className: _MaskCharLowLine.jsStyles.root() }, MASK_CHAR_EXEMPLAR);};exports.MaskCharLowLine = MaskCharLowLine;
+var MaskCharLowLine = function MaskCharLowLine() {return /*#__PURE__*/_react.default.createElement("span", { className: _MaskCharLowLine.styles.root() }, MASK_CHAR_EXEMPLAR);};exports.MaskCharLowLine = MaskCharLowLine;

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["MaskCharLowLine.tsx"],"names":["MASK_CHAR_EXEMPLAR","String","fromCharCode","MaskCharLowLine","~~jsStyles~~","root"],"mappings":"0LAAA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMA,kBAAkB,GAAGC,MAAM,CAACC,YAAP,CAAoB,MAApB,CAA3B,C;;AAEA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,wBAAM,uCAAM,SAAS,EAAEC,~~0BAASC~~,~~IAAT~~,EAAjB,~~IAAmCL~~,~~kBAAnC~~,CAAN,EAAxB,C","sourcesContent":["import React from 'react';\r\n\r\nimport { ~~jsStyles~~ } from './MaskCharLowLine.styles';\r\n\r\n/*\r\n FIGURE SPACE\r\n \r\n space equal to tabular width of a font this is equivalent to the digit width of fonts with fixed-width digits\r\n \r\n @see http://www.fileformat.info/info/unicode/char/2007/index.htm\r\n */\r\nexport const MASK_CHAR_EXEMPLAR = String.fromCharCode(0x2007);\r\n\r\nexport const MaskCharLowLine = () => <span className={~~jsStyles~~.root()}>{MASK_CHAR_EXEMPLAR}</span>;\r\n"]}
1	+ {"version":3,"sources":["MaskCharLowLine.tsx"],"names":["MASK_CHAR_EXEMPLAR","String","fromCharCode","MaskCharLowLine","styles","root"],"mappings":"0LAAA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMA,kBAAkB,GAAGC,MAAM,CAACC,YAAP,CAAoB,MAApB,CAA3B,C;;AAEA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,wBAAM,uCAAM,SAAS,EAAEC,wBAAOC,IAAP,EAAjB,IAAiCL,kBAAjC,CAAN,EAAxB,C","sourcesContent":["import React from 'react';\n\nimport { styles } from './MaskCharLowLine.styles';\n\n/*\n FIGURE SPACE\n \n space equal to tabular width of a font this is equivalent to the digit width of fonts with fixed-width digits\n \n @see http://www.fileformat.info/info/unicode/char/2007/index.htm\n */\nexport const MASK_CHAR_EXEMPLAR = String.fromCharCode(0x2007);\n\nexport const MaskCharLowLine = () => <span className={styles.root()}>{MASK_CHAR_EXEMPLAR}</span>;\n"]}

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.styles.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
-export declare const jsStyles: {
+export declare const styles: {
     root(): string;
 };

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.styles.js CHANGED Viewed

@@ -1,8 +1,8 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");function _templateObject() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n\n      &:after {\n        content: '';\n        position: absolute;\n        width: calc(100% - 0.1em);\n        height: 1px;\n        left: 0.05em;\n        bottom: 0.11em;\n        border-bottom: solid 0.05em;\n      }\n    "]);_templateObject = function _templateObject() {return data;};return data;}
+"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");var _templateObject;
-var styles = {
+var styles = (0, _Emotion.memoizeStyle)({
   root: function root() {
-    return (0, _Emotion.css)(_templateObject());
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n\n      &:after {\n        content: '';\n        position: absolute;\n        width: calc(100% - 0.1em);\n        height: 1px;\n        left: 0.05em;\n        bottom: 0.11em;\n        border-bottom: solid 0.05em;\n      }\n    "])));
@@ -15,7 +15,4 @@ var styles = {
-  } };
-var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;
+  } });exports.styles = styles;

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["MaskCharLowLine.styles.ts"],"names":["styles","root","css"~~,"jsStyles"~~],"mappings":"~~8QAAA~~,oD;;~~AAEA~~,IAAMA,MAAM,GAAG;~~AACbC~~,EAAAA,~~IADa~~,~~kBACN~~;AACL,eAAOC,YAAP;;;;;;;;;;;;;AAaD,~~GAfY~~,~~EAAf;;;AAkBO~~,~~IAAMC~~,~~QAAQ,GAAG,2BAAaH,MAAb,CAAjB,~~C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\n\~~r\nconst~~ styles = {\r\n root() {\r\n return css`\r\n position: relative;\r\n\r\n &:after {\r\n content: '';\r\n position: absolute;\r\n width: calc(100% - 0.1em);\r\n height: 1px;\r\n left: 0.05em;\r\n bottom: 0.11em;\r\n border-bottom: solid 0.05em;\r\n }\r\n `;\r\n },\r\n}~~;\r\n\r\nexport const jsStyles = memoizeStyle(styles~~);\r\n"]}
1	+ {"version":3,"sources":["MaskCharLowLine.styles.ts"],"names":["styles","root","css"],"mappings":"4QAAA,oD;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,kBAC1B;AACL,eAAOC,YAAP;;;;;;;;;;;;;AAaD,GAfgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n root() {\n return css`\n position: relative;\n\n &:after {\n content: '';\n position: absolute;\n width: calc(100% - 0.1em);\n height: 1px;\n left: 0.05em;\n bottom: 0.11em;\n border-bottom: solid 0.05em;\n }\n `;\n },\n});\n"]}

package/cjs/internal/MaskCharLowLine/index.js.map CHANGED Viewed

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

package/cjs/internal/MaskedInput/MaskedInput.d.ts CHANGED Viewed

@@ -16,7 +16,7 @@ interface MaskedInputState {
     emptyValue: string;
     focused: boolean;
 }
-export declare class MaskedInput extends React.Component<MaskedInputProps, MaskedInputState> {
+export declare class MaskedInput extends React.PureComponent<MaskedInputProps, MaskedInputState> {
     static __KONTUR_REACT_UI__: string;
     static defaultProps: Partial<MaskedInputProps>;
     input: HTMLInputElement | null;
@@ -24,7 +24,7 @@ export declare class MaskedInput extends React.Component<MaskedInputProps, Maske
     private reactInputMask;
     constructor(props: MaskedInputProps);
     componentDidMount(): void;
-    UNSAFE_componentWillReceiveProps(nextProps: MaskedInputProps): void;
+    componentDidUpdate(prevProps: MaskedInputProps): void;
     render(): JSX.Element;
     private renderMain;
     private getValue;

package/cjs/internal/MaskedInput/MaskedInput.js CHANGED Viewed

@@ -1,10 +1,10 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.MaskedInput = 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 _classnames = _interopRequireDefault(require("classnames"));
 var _reactInputMask = _interopRequireDefault(require("react-input-mask"));
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _MaskCharLowLine = require("../MaskCharLowLine");
+var _Emotion = require("../../lib/theming/Emotion");
 var _MaskedInput = require("./MaskedInput.styles");var
@@ -25,7 +25,7 @@ var _MaskedInput = require("./MaskedInput.styles");var
-MaskedInput = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(MaskedInput, _React$Component);
+MaskedInput = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsLoose2.default)(MaskedInput, _React$PureComponent);
@@ -37,7 +37,7 @@ MaskedInput = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.defa
   function MaskedInput(_props) {var _this;
-    _this = _React$Component.call(this, _props) || this;_this.input = null;_this.theme = void 0;_this.reactInputMask = null;_this.
+    _this = _React$PureComponent.call(this, _props) || this;_this.input = null;_this.theme = void 0;_this.reactInputMask = null;_this.
@@ -208,4 +208,4 @@ MaskedInput = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.defa
         _this.props.onUnexpectedInput(_this.state.value);
       }
     };_this.state = { value: _this.getValue(_props), emptyValue: '', focused: false };return _this;}var _proto = MaskedInput.prototype;_proto.componentDidMount = function componentDidMount() {if (this.reactInputMask) {// FIXME: принудительно вызываем beforeMaskedValueChange, чтобы получить emptyValue
-      this.reactInputMask.forceUpdate();}};_proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {if (this.props.value !== nextProps.value) {this.setState({ value: nextProps.value ? nextProps.value.toString() : '' });}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this$props = this.props,maskChar = _this$props.maskChar,alwaysShowMask = _this$props.alwaysShowMask,hasLeftIcon = _this$props.hasLeftIcon,hasRightIcon = _this$props.hasRightIcon,maxLength = _this$props.maxLength,onValueChange = _this$props.onValueChange,onUnexpectedInput = _this$props.onUnexpectedInput,defaultValue = _this$props.defaultValue,style = _this$props.style,inputProps = (0, _objectWithoutPropertiesLoose2.default)(_this$props, ["maskChar", "alwaysShowMask", "hasLeftIcon", "hasRightIcon", "maxLength", "onValueChange", "onUnexpectedInput", "defaultValue", "style"]);var _this$state = this.state,emptyValue = _this$state.emptyValue,value = _this$state.value;var leftHelper = (style == null ? void 0 : style.textAlign) !== 'right' && /*#__PURE__*/_react.default.createElement("span", { style: { color: 'transparent' } }, emptyValue.slice(0, value.length));var leftClass = (style == null ? void 0 : style.textAlign) !== 'right' && _MaskedInput.jsStyles.inputMaskLeft();var rightHelper = emptyValue.slice(value.length).split('').map(function (_char, i) {return _char === '_' ? /*#__PURE__*/_react.default.createElement(_MaskCharLowLine.MaskCharLowLine, { key: i }) : _char;});return /*#__PURE__*/_react.default.createElement("span", { className: _MaskedInput.jsStyles.container(), "x-ms-format-detection": "none" }, /*#__PURE__*/_react.default.createElement(_reactInputMask.default, (0, _extends2.default)({}, inputProps, { maskChar: null, beforeMaskedValueChange: this.preprocess, alwaysShowMask: false, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur, value: value, inputRef: this.refInput, ref: this.refMaskedInput, style: (0, _extends2.default)({}, style) })), this.isMaskVisible() && /*#__PURE__*/_react.default.createElement("span", { className: (0, _classnames.default)(_MaskedInput.jsStyles.inputMask(this.theme), leftClass) }, leftHelper, rightHelper));};return MaskedInput;}(_react.default.Component);exports.MaskedInput = MaskedInput;MaskedInput.__KONTUR_REACT_UI__ = 'MaskedInput';MaskedInput.defaultProps = { maskChar: '_' };
+      this.reactInputMask.forceUpdate();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.props.value !== prevProps.value) {this.setState({ value: this.props.value ? this.props.value.toString() : '' });}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this$props = this.props,maskChar = _this$props.maskChar,alwaysShowMask = _this$props.alwaysShowMask,hasLeftIcon = _this$props.hasLeftIcon,hasRightIcon = _this$props.hasRightIcon,maxLength = _this$props.maxLength,onValueChange = _this$props.onValueChange,onUnexpectedInput = _this$props.onUnexpectedInput,defaultValue = _this$props.defaultValue,style = _this$props.style,inputProps = (0, _objectWithoutPropertiesLoose2.default)(_this$props, ["maskChar", "alwaysShowMask", "hasLeftIcon", "hasRightIcon", "maxLength", "onValueChange", "onUnexpectedInput", "defaultValue", "style"]);var _this$state = this.state,emptyValue = _this$state.emptyValue,value = _this$state.value;var leftHelper = (style == null ? void 0 : style.textAlign) !== 'right' && /*#__PURE__*/_react.default.createElement("span", { style: { color: 'transparent' } }, emptyValue.slice(0, value.length));var leftClass = (style == null ? void 0 : style.textAlign) !== 'right' && _MaskedInput.styles.inputMaskLeft();var rightHelper = emptyValue.slice(value.length).split('').map(function (_char, i) {return _char === '_' ? /*#__PURE__*/_react.default.createElement(_MaskCharLowLine.MaskCharLowLine, { key: i }) : _char;});return /*#__PURE__*/_react.default.createElement("span", { className: _MaskedInput.styles.container(), "x-ms-format-detection": "none" }, /*#__PURE__*/_react.default.createElement(_reactInputMask.default, (0, _extends2.default)({}, inputProps, { maskChar: null, beforeMaskedValueChange: this.preprocess, alwaysShowMask: false, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur, value: value, inputRef: this.refInput, ref: this.refMaskedInput, style: (0, _extends2.default)({}, style) })), this.isMaskVisible() && /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_MaskedInput.styles.inputMask(this.theme), leftClass) }, leftHelper, rightHelper));};return MaskedInput;}(_react.default.PureComponent);exports.MaskedInput = MaskedInput;MaskedInput.__KONTUR_REACT_UI__ = 'MaskedInput';MaskedInput.defaultProps = { maskChar: '_' };

package/cjs/internal/MaskedInput/MaskedInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["MaskedInput.tsx"],"names":["MaskedInput","props","input","theme","reactInputMask","getValue","value","defaultValue","undefined","toString","refInput","refMaskedInput","handleChange","event","target","state","handleUnexpectedInput","setState","onValueChange","onChange","handleFocus","focused","onFocus","handleBlur","onBlur","preprocess","newState","oldState","userInput","options","visibleMaskChars","Array","mask","length","fill","maskChar","split","forEach","char","index","permanents","includes","emptyValue","join","isMaskVisible","alwaysShowMask","onUnexpectedInput","componentDidMount","forceUpdate","UNSAFE_componentWillReceiveProps","nextProps","render","renderMain","hasLeftIcon","hasRightIcon","maxLength","style","inputProps","leftHelper","textAlign","color","slice","leftClass","jsStyles","inputMaskLeft","rightHelper","map","_char","i","container","inputMask","React","Component","__KONTUR_REACT_UI__","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\nimport ReactInputMask, { InputState, MaskOptions } from 'react-input-mask';\r\n\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { MaskCharLowLine } from '../MaskCharLowLine';\r\n\r\nimport { jsStyles } from './MaskedInput.styles';\r\n\r\nexport interface MaskedInputProps extends React.InputHTMLAttributes<HTMLInputElement> {\r\n mask: string;\r\n maskChar: string \| null;\r\n formatChars?: { [key: string]: string };\r\n alwaysShowMask?: boolean;\r\n hasLeftIcon?: boolean;\r\n hasRightIcon?: boolean;\r\n onUnexpectedInput?: (value: string) => void;\r\n onValueChange?: (value: string) => void;\r\n}\r\n\r\ninterface MaskedInputState {\r\n value: string;\r\n emptyValue: string;\r\n focused: boolean;\r\n}\r\n\r\nexport class MaskedInput extends React.Component<MaskedInputProps, MaskedInputState> {\r\n public static __KONTUR_REACT_UI__ = 'MaskedInput';\r\n\r\n public static defaultProps: Partial<MaskedInputProps> = {\r\n maskChar: '_',\r\n };\r\n\r\n public input: HTMLInputElement \| null = null;\r\n private theme!: Theme;\r\n private reactInputMask: ReactInputMask \| null = null;\r\n\r\n public constructor(props: MaskedInputProps) {\r\n super(props);\r\n\r\n this.state = {\r\n value: this.getValue(props),\r\n emptyValue: '',\r\n focused: false,\r\n };\r\n }\r\n\r\n public componentDidMount() {\r\n if (this.reactInputMask) {\r\n // FIXME: принудительно вызываем beforeMaskedValueChange, чтобы получить emptyValue\r\n this.reactInputMask.forceUpdate();\r\n }\r\n }\r\n\r\n public UNSAFE_componentWillReceiveProps(nextProps: MaskedInputProps) {\r\n if (this.props.value !== nextProps.value) {\r\n this.setState({\r\n value: nextProps.value ? nextProps.value.toString() : '',\r\n });\r\n }\r\n }\r\n\r\n public render() {\r\n return (\r\n <ThemeContext.Consumer>\r\n {theme => {\r\n this.theme = theme;\r\n return this.renderMain();\r\n }}\r\n </ThemeContext.Consumer>\r\n );\r\n }\r\n\r\n private renderMain() {\r\n const {\r\n maskChar,\r\n alwaysShowMask,\r\n hasLeftIcon,\r\n hasRightIcon,\r\n maxLength,\r\n onValueChange,\r\n onUnexpectedInput,\r\n defaultValue,\r\n style,\r\n ...inputProps\r\n } = this.props;\r\n const { emptyValue, value } = this.state;\r\n\r\n const leftHelper = style?.textAlign !== 'right' && (\r\n <span style={{ color: 'transparent' }}>{emptyValue.slice(0, value.length)}</span>\r\n );\r\n const leftClass = style?.textAlign !== 'right' && jsStyles.inputMaskLeft();\r\n\r\n const rightHelper = emptyValue\r\n .slice(value.length)\r\n .split('')\r\n .map((_char, i) => (_char === '_' ? <MaskCharLowLine key={i} /> : _char));\r\n\r\n return (\r\n <span className={jsStyles.container()} x-ms-format-detection=\"none\">\r\n <ReactInputMask\r\n {...inputProps}\r\n maskChar={null}\r\n beforeMaskedValueChange={this.preprocess}\r\n alwaysShowMask={false}\r\n onChange={this.handleChange}\r\n onFocus={this.handleFocus}\r\n onBlur={this.handleBlur}\r\n value={value}\r\n inputRef={this.refInput}\r\n ref={this.refMaskedInput}\r\n style={{ ...style }}\r\n />\r\n {this.isMaskVisible() && (\r\n <span className={cn(jsStyles.inputMask(this.theme), leftClass)}>\r\n {leftHelper}\r\n {rightHelper}\r\n </span>\r\n )}\r\n </span>\r\n );\r\n }\r\n\r\n private getValue = (props: MaskedInputProps): string => {\r\n const { value, defaultValue } = props;\r\n\r\n return value !== undefined ? value.toString() : defaultValue !== undefined ? defaultValue.toString() : '';\r\n };\r\n\r\n private refInput = (input: HTMLInputElement \| null) => {\r\n this.input = input;\r\n };\r\n\r\n private refMaskedInput = (reactInputMask: ReactInputMask) => {\r\n this.reactInputMask = reactInputMask;\r\n };\r\n\r\n private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n if (event.target.value === this.state.value) {\r\n this.handleUnexpectedInput();\r\n } else {\r\n this.setState({ value: event.target.value });\r\n if (this.props.onValueChange) {\r\n this.props.onValueChange(event.target.value);\r\n }\r\n if (this.props.onChange) {\r\n this.props.onChange(event);\r\n }\r\n }\r\n };\r\n\r\n private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\r\n this.setState({ focused: true });\r\n\r\n if (this.props.onFocus) {\r\n this.props.onFocus(event);\r\n }\r\n };\r\n\r\n private handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\r\n this.setState({ focused: false });\r\n\r\n if (this.props.onBlur) {\r\n this.props.onBlur(event);\r\n }\r\n };\r\n\r\n private preprocess = (\r\n newState: InputState,\r\n oldState: InputState,\r\n userInput: string,\r\n options: MaskOptions & Pick<MaskedInputProps, 'mask'>,\r\n ) => {\r\n const visibleMaskChars = new Array(options.mask.length).fill(this.props.maskChar);\r\n\r\n if (newState.value !== oldState.value && userInput === null) {\r\n this.setState({\r\n value: newState.value,\r\n });\r\n }\r\n\r\n options.mask.split('').forEach((char, index) => {\r\n if (options.permanents.includes(index)) {\r\n visibleMaskChars[index] = char;\r\n }\r\n\r\n if (newState.value[index]) {\r\n visibleMaskChars[index] = newState.value[index];\r\n }\r\n });\r\n\r\n const emptyValue = visibleMaskChars.join('');\r\n\r\n if (this.state.emptyValue !== emptyValue) {\r\n this.setState({\r\n emptyValue,\r\n });\r\n }\r\n\r\n return newState;\r\n };\r\n\r\n private isMaskVisible = () => this.props.alwaysShowMask \|\| this.state.focused;\r\n\r\n private handleUnexpectedInput = () => {\r\n if (this.props.onUnexpectedInput) {\r\n this.props.onUnexpectedInput(this.state.value);\r\n }\r\n };\r\n}\r\n"]}
1	+ {"version":3,"sources":["MaskedInput.tsx"],"names":["MaskedInput","props","input","theme","reactInputMask","getValue","value","defaultValue","undefined","toString","refInput","refMaskedInput","handleChange","event","target","state","handleUnexpectedInput","setState","onValueChange","onChange","handleFocus","focused","onFocus","handleBlur","onBlur","preprocess","newState","oldState","userInput","options","visibleMaskChars","Array","mask","length","fill","maskChar","split","forEach","char","index","permanents","includes","emptyValue","join","isMaskVisible","alwaysShowMask","onUnexpectedInput","componentDidMount","forceUpdate","componentDidUpdate","prevProps","render","renderMain","hasLeftIcon","hasRightIcon","maxLength","style","inputProps","leftHelper","textAlign","color","slice","leftClass","styles","inputMaskLeft","rightHelper","map","_char","i","container","inputMask","React","PureComponent","__KONTUR_REACT_UI__","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactInputMask, { InputState, MaskOptions } from 'react-input-mask';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MaskCharLowLine } from '../MaskCharLowLine';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles } from './MaskedInput.styles';\n\nexport interface MaskedInputProps extends React.InputHTMLAttributes<HTMLInputElement> {\n mask: string;\n maskChar: string \| null;\n formatChars?: { [key: string]: string };\n alwaysShowMask?: boolean;\n hasLeftIcon?: boolean;\n hasRightIcon?: boolean;\n onUnexpectedInput?: (value: string) => void;\n onValueChange?: (value: string) => void;\n}\n\ninterface MaskedInputState {\n value: string;\n emptyValue: string;\n focused: boolean;\n}\n\nexport class MaskedInput extends React.PureComponent<MaskedInputProps, MaskedInputState> {\n public static __KONTUR_REACT_UI__ = 'MaskedInput';\n\n public static defaultProps: Partial<MaskedInputProps> = {\n maskChar: '_',\n };\n\n public input: HTMLInputElement \| null = null;\n private theme!: Theme;\n private reactInputMask: ReactInputMask \| null = null;\n\n public constructor(props: MaskedInputProps) {\n super(props);\n\n this.state = {\n value: this.getValue(props),\n emptyValue: '',\n focused: false,\n };\n }\n\n public componentDidMount() {\n if (this.reactInputMask) {\n // FIXME: принудительно вызываем beforeMaskedValueChange, чтобы получить emptyValue\n this.reactInputMask.forceUpdate();\n }\n }\n\n public componentDidUpdate(prevProps: MaskedInputProps) {\n if (this.props.value !== prevProps.value) {\n this.setState({\n value: this.props.value ? this.props.value.toString() : '',\n });\n }\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const {\n maskChar,\n alwaysShowMask,\n hasLeftIcon,\n hasRightIcon,\n maxLength,\n onValueChange,\n onUnexpectedInput,\n defaultValue,\n style,\n ...inputProps\n } = this.props;\n const { emptyValue, value } = this.state;\n\n const leftHelper = style?.textAlign !== 'right' && (\n <span style={{ color: 'transparent' }}>{emptyValue.slice(0, value.length)}</span>\n );\n const leftClass = style?.textAlign !== 'right' && styles.inputMaskLeft();\n\n const rightHelper = emptyValue\n .slice(value.length)\n .split('')\n .map((_char, i) => (_char === '_' ? <MaskCharLowLine key={i} /> : _char));\n\n return (\n <span className={styles.container()} x-ms-format-detection=\"none\">\n <ReactInputMask\n {...inputProps}\n maskChar={null}\n beforeMaskedValueChange={this.preprocess}\n alwaysShowMask={false}\n onChange={this.handleChange}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n value={value}\n inputRef={this.refInput}\n ref={this.refMaskedInput}\n style={{ ...style }}\n />\n {this.isMaskVisible() && (\n <span className={cx(styles.inputMask(this.theme), leftClass)}>\n {leftHelper}\n {rightHelper}\n </span>\n )}\n </span>\n );\n }\n\n private getValue = (props: MaskedInputProps): string => {\n const { value, defaultValue } = props;\n\n return value !== undefined ? value.toString() : defaultValue !== undefined ? defaultValue.toString() : '';\n };\n\n private refInput = (input: HTMLInputElement \| null) => {\n this.input = input;\n };\n\n private refMaskedInput = (reactInputMask: ReactInputMask) => {\n this.reactInputMask = reactInputMask;\n };\n\n private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (event.target.value === this.state.value) {\n this.handleUnexpectedInput();\n } else {\n this.setState({ value: event.target.value });\n if (this.props.onValueChange) {\n this.props.onValueChange(event.target.value);\n }\n if (this.props.onChange) {\n this.props.onChange(event);\n }\n }\n };\n\n private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n this.setState({ focused: true });\n\n if (this.props.onFocus) {\n this.props.onFocus(event);\n }\n };\n\n private handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n this.setState({ focused: false });\n\n if (this.props.onBlur) {\n this.props.onBlur(event);\n }\n };\n\n private preprocess = (\n newState: InputState,\n oldState: InputState,\n userInput: string,\n options: MaskOptions & Pick<MaskedInputProps, 'mask'>,\n ) => {\n const visibleMaskChars = new Array(options.mask.length).fill(this.props.maskChar);\n\n if (newState.value !== oldState.value && userInput === null) {\n this.setState({\n value: newState.value,\n });\n }\n\n options.mask.split('').forEach((char, index) => {\n if (options.permanents.includes(index)) {\n visibleMaskChars[index] = char;\n }\n\n if (newState.value[index]) {\n visibleMaskChars[index] = newState.value[index];\n }\n });\n\n const emptyValue = visibleMaskChars.join('');\n\n if (this.state.emptyValue !== emptyValue) {\n this.setState({\n emptyValue,\n });\n }\n\n return newState;\n };\n\n private isMaskVisible = () => this.props.alwaysShowMask \|\| this.state.focused;\n\n private handleUnexpectedInput = () => {\n if (this.props.onUnexpectedInput) {\n this.props.onUnexpectedInput(this.state.value);\n }\n };\n}\n"]}

package/cjs/internal/MaskedInput/MaskedInput.styles.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
-export declare const jsStyles: {
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
     container(): string;
-    inputMask(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
+    inputMask(t: Theme): string;
     inputMaskLeft(): string;
 };