@megafon/ui-core 3.0.0-beta.6 → 3.0.0

package/dist/lib/components/TextField/TextField.js

@@ -121,9 +121,11 @@ var TextField = function TextField(_ref) {
       noticeText = _ref.noticeText,
       inputRef = _ref.inputRef,
       inputMode = _ref.inputMode,
+      autoComplete = _ref.autoComplete,
       _ref$classes = _ref.classes;
   _ref$classes = _ref$classes === void 0 ? {} : _ref$classes;
-  var input = _ref$classes.input;
+  var input = _ref$classes.input,
+      dataAttrs = _ref.dataAttrs;
 
   var _useState = (0, React.useState)(true),
       _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
@@ -174,7 +176,7 @@ var TextField = function TextField(_ref) {
   (0, React.useEffect)(function () {
     !isControlled && setInputValue(value);
     checkSymbolMaxLimit(value);
-  }, [value, checkSymbolMaxLimit]);
+  }, [value, checkSymbolMaxLimit, isControlled]);
   (0, React.useEffect)(function () {
     setTouch((0, _uiHelpers.detectTouch)());
   }, []);
@@ -182,7 +184,7 @@ var TextField = function TextField(_ref) {
     return setPasswordHidden(function (prevPassState) {
       return !prevPassState;
     });
-  }, [isPasswordHidden]);
+  }, []);
 
   var setTextareaHeight = function setTextareaHeight() {
     if (!(fieldNode === null || fieldNode === void 0 ? void 0 : fieldNode.current)) {
@@ -205,7 +207,7 @@ var TextField = function TextField(_ref) {
 
     !isControlled && setInputValue(e.target.value);
     checkSymbolMaxLimit(e.target.value);
-    onChange && onChange(e);
+    onChange === null || onChange === void 0 ? void 0 : onChange(e);
   };
 
   var handleTextareaClick = function handleTextareaClick() {
@@ -222,25 +224,25 @@ var TextField = function TextField(_ref) {
     var isClearFuncAvailable = !customIcon && !onCustomIconClick && verification === ERROR;
     var field = fieldNode.current;
     isPasswordType && togglePasswordHiding();
-    onCustomIconClick && onCustomIconClick(e);
+    onCustomIconClick === null || onCustomIconClick === void 0 ? void 0 : onCustomIconClick(e);
 
     if (!isControlled && isClearFuncAvailable) {
       setInputValue('');
-      field && field.focus();
+      field === null || field === void 0 ? void 0 : field.focus();
     }
-  }, [isPasswordType, togglePasswordHiding, onCustomIconClick, verification, setInputValue]);
+  }, [isPasswordType, togglePasswordHiding, onCustomIconClick, verification, customIcon, isControlled]);
   var handleFocus = (0, React.useCallback)(function (e) {
-    onFocus && onFocus(e);
+    onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
   }, [onFocus]);
   var handleBlur = (0, React.useCallback)(function (e) {
-    onBlur && onBlur(e);
+    onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
   }, [onBlur]);
   var handleBeforeMaskChange = (0, React.useCallback)(function (newState, oldState, inputedValue) {
     return onBeforeMaskChange && onBeforeMaskChange(inputedValue, newState, oldState);
   }, [onBeforeMaskChange]);
   var textareaType = textarea === TextareaTypes.FLEXIBLE ? TextareaTypes.FLEXIBLE : TextareaTypes.FIXED;
   var hasScrolling = initialTextareaHeight >= TEXTAREA_MAX_HEIGHT || isTextareaResized;
-  var commonParams = {
+  var commonParams = (0, _extends2["default"])((0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input)), {
     disabled: disabled,
     id: id,
     name: name,
@@ -253,10 +255,11 @@ var TextField = function TextField(_ref) {
     placeholder: placeholder,
     required: required,
     inputMode: inputMode
-  };
+  });
   var inputParams = (0, _extends2["default"])((0, _extends2["default"])({}, commonParams), {
     className: cn('field', input),
-    type: isVisiblePassword ? 'text' : type
+    type: isVisiblePassword ? 'text' : type,
+    autoComplete: autoComplete
   });
   var inputMaskParams = {
     mask: mask,
@@ -276,7 +279,7 @@ var TextField = function TextField(_ref) {
     }
 
     fieldNode.current = node;
-    inputRef && inputRef(node);
+    inputRef === null || inputRef === void 0 ? void 0 : inputRef(node);
   };
 
   var getIcon = function getIcon() {
@@ -321,14 +324,14 @@ var TextField = function TextField(_ref) {
 
   var renderIconBlock = function renderIconBlock() {
     var icon = getIcon();
-    return icon && /*#__PURE__*/React.createElement("div", {
+    return icon && /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.iconBox), {
       className: cn('icon-box', {
         error: verification === Verification.ERROR && !customIcon,
         password: isPasswordType,
         'custom-handler': !!onCustomIconClick
       }),
       onClick: handleIconClick
-    }, icon);
+    }), icon);
   };
 
   var renderInput = function renderInput() {
@@ -350,7 +353,7 @@ var TextField = function TextField(_ref) {
   var isPlaceholderShowed = isPasswordType && isPasswordHidden && !!inputValue;
   var valueHasSymbols = inputValue !== null && inputValue !== undefined;
   var currentSymbolCount = valueHasSymbols && String(inputValue).length || 0;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       disabled: disabled,
       theme: theme,
@@ -359,7 +362,10 @@ var TextField = function TextField(_ref) {
       icon: !hideIcon && (!!verification || !!customIcon || type === 'password') && !textarea,
       password: isPlaceholderShowed
     }, className)
-  }, label && /*#__PURE__*/React.createElement(_InputLabel["default"], {
+  }), label && /*#__PURE__*/React.createElement(_InputLabel["default"], {
+    dataAttrs: {
+      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.label
+    },
     htmlFor: id
   }, label, required && /*#__PURE__*/React.createElement("span", {
     className: cn('require-mark')
@@ -369,12 +375,12 @@ var TextField = function TextField(_ref) {
     })
   }, renderField()), /*#__PURE__*/React.createElement("div", {
     className: cn('wrap')
-  }, noticeText && /*#__PURE__*/React.createElement("div", {
+  }, noticeText && /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.notice), {
     className: cn('text', {
       error: verification === Verification.ERROR,
       success: verification === Verification.VALID
     })
-  }, noticeText), symbolCounter && /*#__PURE__*/React.createElement(_Paragraph["default"], {
+  }), noticeText), symbolCounter && /*#__PURE__*/React.createElement(_Paragraph["default"], {
     size: "small",
     hasMargin: false,
     className: cn('counter', {
@@ -392,6 +398,8 @@ TextField.propTypes = {
   disabled: PropTypes.bool,
   required: PropTypes.bool,
   type: PropTypes.oneOf(['text', 'password', 'tel', 'email']),
+  inputMode: PropTypes.oneOf(['numeric', 'tel', 'decimal', 'email', 'url', 'search', 'none']),
+  autoComplete: PropTypes.string,
   name: PropTypes.string,
   placeholder: PropTypes.string,
   id: PropTypes.string,
@@ -413,6 +421,13 @@ TextField.propTypes = {
   inputRef: PropTypes.func,
   classes: PropTypes.shape({
     input: PropTypes.string
+  }),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    label: PropTypes.objectOf(PropTypes.string.isRequired),
+    notice: PropTypes.objectOf(PropTypes.string.isRequired),
+    input: PropTypes.objectOf(PropTypes.string.isRequired),
+    iconBox: PropTypes.objectOf(PropTypes.string.isRequired)
   })
 };
 var _default = TextField;

package/dist/lib/components/TextLink/TextLink.js

@@ -33,8 +33,10 @@ var TextLink = function TextLink(_ref) {
       rel = _ref.rel,
       onClick = _ref.onClick,
       children = _ref.children,
-      download = _ref.download;
+      download = _ref.download,
+      dataAttrs = _ref.dataAttrs;
   return /*#__PURE__*/React.createElement(_Link["default"], {
+    dataAttrs: dataAttrs,
     target: target,
     href: href,
     rel: rel,
@@ -52,6 +54,9 @@ TextLink.propTypes = {
   color: PropTypes.oneOf(['default', 'white', 'black', 'gray', 'green', 'blue', 'inherit']),
   underlineVisibility: PropTypes.oneOf(['hover', 'always']),
   underlineStyle: PropTypes.oneOf(['solid', 'dashed', 'border', 'none']),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element), PropTypes.element, PropTypes.string, PropTypes.node])
 };
 TextLink.defaultProps = {

package/dist/lib/components/Tile/Tile.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import { IFilterDataAttrs } from '@megafon/ui-helpers';
 import './Tile.less';
 export declare const Theme: {
     readonly LIGHT: "light";
@@ -18,7 +17,7 @@ export declare const Shadow: {
     readonly HOVER: "hover";
 };
 declare type ShadowType = typeof Shadow[keyof typeof Shadow];
-export interface ITileProps extends IFilterDataAttrs {
+export interface ITileProps {
     /** Ссылка */
     href?: string;
     /** Тема */
@@ -31,6 +30,10 @@ export interface ITileProps extends IFilterDataAttrs {
     isInteractive?: boolean;
     /** Дополнительный класс корневого элемента */
     className?: string;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
     /** Обработчик клика */
     onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
 }

package/dist/lib/components/Tile/Tile.js

@@ -52,7 +52,7 @@ var Tile = function Tile(_ref) {
       dataAttrs = _ref.dataAttrs;
 
   var handleClick = function handleClick(e) {
-    onClick && onClick(e);
+    onClick === null || onClick === void 0 ? void 0 : onClick(e);
   };
 
   var isPointer = !!href || isInteractive;
@@ -65,7 +65,7 @@ var Tile = function Tile(_ref) {
       interactive: isInteractive
     }, className),
     onClick: handleClick
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs)), href && /*#__PURE__*/_react["default"].createElement("a", {
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), href && /*#__PURE__*/_react["default"].createElement("a", {
     href: href,
     className: cn('link')
   }, children), !href && children);

package/dist/lib/components/Tooltip/Tooltip.d.ts

@@ -46,6 +46,11 @@ export interface ITooltipProps {
         content?: string;
         contentShadow?: string;
     };
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        content?: Record<string, string>;
+    };
     /** Обработчик на открытие */
     onOpen?: (e: AccessibilityEventTypeNative) => void;
     /** Обработчик на закрытие */

package/dist/lib/components/Tooltip/Tooltip.js

@@ -79,6 +79,7 @@ var Tooltip = function Tooltip(_ref) {
       arrowClassName = _ref$classes.arrow,
       contentClassName = _ref$classes.content,
       contentShadowClassName = _ref$classes.contentShadow,
+      dataAttrs = _ref.dataAttrs,
       onOpen = _ref.onOpen,
       onClose = _ref.onClose;
   var currentTrigger = triggerElement.current;
@@ -102,7 +103,7 @@ var Tooltip = function Tooltip(_ref) {
 
   (0, _react.useEffect)(function () {
     return setIsOpen(isOpened);
-  }, [isOpened, setIsOpen]);
+  }, [isOpened]);
   var options = (0, _react.useMemo)(function () {
     return {
       placement: placement,
@@ -130,7 +131,7 @@ var Tooltip = function Tooltip(_ref) {
         }
       }]
     };
-  }, [placement, arrowElement, currentBoundary, isOpen]);
+  }, [placement, arrowElement, currentBoundary, isOpen, fallbackPlacements]);
 
   var _usePopper = (0, _reactPopper.usePopper)(currentTarget, popperElement, options),
       styles = _usePopper.styles,
@@ -138,7 +139,7 @@ var Tooltip = function Tooltip(_ref) {
       update = _usePopper.update;
 
   (0, _react.useEffect)(function () {
-    update && update();
+    update === null || update === void 0 ? void 0 : update();
   }, [children, update]);
 
   var _useState7 = (0, _react.useState)(false),
@@ -148,7 +149,7 @@ var Tooltip = function Tooltip(_ref) {
 
   (0, _react.useEffect)(function () {
     return setIsTouchDevice((0, _uiHelpers.detectTouch)());
-  }, [_uiHelpers.detectTouch, setIsTouchDevice]);
+  }, []);
   var clickEvent = (0, _react.useMemo)(function () {
     return isTouchDevice ? TOUCH_KEY : MOUSE_KEY;
   }, [isTouchDevice]);
@@ -158,9 +159,9 @@ var Tooltip = function Tooltip(_ref) {
   var handleMouseEnter = (0, _react.useCallback)(function (e) {
     if (!isOpen) {
       setIsOpen(true);
-      onOpen && onOpen(e);
+      onOpen === null || onOpen === void 0 ? void 0 : onOpen(e);
     }
-  }, [isOpen, onOpen, setIsOpen]);
+  }, [isOpen, onOpen]);
   var handleClick = (0, _react.useCallback)(function (e) {
     if (!(0, _uiHelpers.checkNativeEventIsClickOrEnterPress)(e)) {
       return;
@@ -171,24 +172,24 @@ var Tooltip = function Tooltip(_ref) {
     });
 
     if (!isOpen) {
-      onOpen && onOpen(e);
+      onOpen === null || onOpen === void 0 ? void 0 : onOpen(e);
     } else {
-      onClose && onClose(e);
+      onClose === null || onClose === void 0 ? void 0 : onClose(e);
     }
-  }, [isOpen, onOpen, onClose, setIsOpen]);
+  }, [isOpen, onOpen, onClose]);
   var handleOutsideEvent = (0, _react.useCallback)(function (e) {
     var isTargetInPopper = e.target instanceof Element && popperElement && popperElement.contains(e.target);
     var isTargetInTrigger = e.target instanceof Element && currentTrigger && currentTrigger.contains(e.target);
 
     if (!isTargetInPopper && !isTargetInTrigger) {
       setIsOpen(false);
-      onClose && onClose(e);
+      onClose === null || onClose === void 0 ? void 0 : onClose(e);
     }
-  }, [onClose, currentTrigger, popperElement, setIsOpen]);
+  }, [onClose, currentTrigger, popperElement]);
   var handleBlurEvent = (0, _react.useCallback)(function (e) {
     setIsOpen(false);
-    onClose && onClose(e);
-  }, [onClose, setIsOpen]);
+    onClose === null || onClose === void 0 ? void 0 : onClose(e);
+  }, [onClose]);
   (0, _react.useEffect)(function () {
     if (triggerEventName === TriggerEvent.HOVER) {
       if (currentTrigger) {
@@ -198,10 +199,10 @@ var Tooltip = function Tooltip(_ref) {
 
       if (isOpen) {
         document.addEventListener('mouseover', handleOutsideEvent);
-        currentTrigger && currentTrigger.addEventListener('blur', handleBlurEvent);
+        currentTrigger === null || currentTrigger === void 0 ? void 0 : currentTrigger.addEventListener('blur', handleBlurEvent);
       } else {
         document.removeEventListener('mouseover', handleOutsideEvent);
-        currentTrigger && currentTrigger.removeEventListener('blur', handleBlurEvent);
+        currentTrigger === null || currentTrigger === void 0 ? void 0 : currentTrigger.removeEventListener('blur', handleBlurEvent);
       }
 
       return function () {
@@ -215,7 +216,7 @@ var Tooltip = function Tooltip(_ref) {
     }
 
     return undefined;
-  }, [triggerEventName, isOpen, currentTrigger, handleOutsideEvent, handleMouseEnter]);
+  }, [triggerEventName, isOpen, currentTrigger, handleOutsideEvent, handleMouseEnter, handleBlurEvent]);
   (0, _react.useEffect)(function () {
     if (triggerEventName === TriggerEvent.CLICK) {
       if (currentTrigger) {
@@ -240,8 +241,8 @@ var Tooltip = function Tooltip(_ref) {
     }
 
     return undefined;
-  }, [triggerEventName, isOpen, currentTrigger, handleOutsideEvent, handleClick]);
-  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
+  }, [triggerEventName, isOpen, currentTrigger, handleOutsideEvent, handleClick, clickEvent]);
+  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       paddings: paddings,
       open: isOpen
@@ -256,6 +257,9 @@ var Tooltip = function Tooltip(_ref) {
     className: cn('arrow-shadow'),
     style: styles.arrow
   }), /*#__PURE__*/_react["default"].createElement(_Tile["default"], {
+    dataAttrs: {
+      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.content
+    },
     className: cn('content', [contentClassName])
   }, children), /*#__PURE__*/_react["default"].createElement(_Tile["default"], {
     shadowLevel: "high",
@@ -298,6 +302,10 @@ Tooltip.propTypes = {
     content: _propTypes["default"].string,
     contentShadow: _propTypes["default"].string
   }),
+  dataAttrs: _propTypes["default"].shape({
+    root: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
+    content: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired)
+  }),
   onOpen: _propTypes["default"].func,
   onClose: _propTypes["default"].func
 };

package/dist/lib/index.d.ts

@@ -31,6 +31,7 @@ export { default as Preloader } from './components/Preloader/Preloader';
 export { default as RadioButton } from './components/RadioButton/RadioButton';
 export { default as Search } from './components/Search/Search';
 export { default as Select } from './components/Select/Select';
+export { default as selectReducer } from './components/Select/reducer/selectReducer';
 export { default as Switcher } from './components/Switcher/Switcher';
 export { default as Tab } from './components/Tabs/Tab';
 export { default as Tabs } from './components/Tabs/Tabs';

package/dist/lib/index.js

@@ -201,6 +201,12 @@ Object.defineProperty(exports, "Select", {
     return _Select["default"];
   }
 });
+Object.defineProperty(exports, "selectReducer", {
+  enumerable: true,
+  get: function get() {
+    return _selectReducer["default"];
+  }
+});
 Object.defineProperty(exports, "Switcher", {
   enumerable: true,
   get: function get() {
@@ -316,6 +322,8 @@ var _Search = _interopRequireDefault(require("./components/Search/Search"));
 
 var _Select = _interopRequireDefault(require("./components/Select/Select"));
 
+var _selectReducer = _interopRequireDefault(require("./components/Select/reducer/selectReducer"));
+
 var _Switcher = _interopRequireDefault(require("./components/Switcher/Switcher"));
 
 var _Tab = _interopRequireDefault(require("./components/Tabs/Tab"));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-core",
-  "version": "3.0.0-beta.6",
+  "version": "3.0.0",
   "files": [
     "dist",
     "styles"
@@ -54,7 +54,7 @@
     "@babel/preset-env": "^7.8.6",
     "@babel/preset-react": "^7.8.3",
     "@babel/preset-typescript": "^7.8.3",
-    "@megafon/ui-icons": "^1.0.0-beta.3",
+    "@megafon/ui-icons": "^1.0.0",
     "@svgr/core": "^2.4.1",
     "@testing-library/react-hooks": "^7.0.1",
     "@types/enzyme": "^3.10.5",
@@ -86,7 +86,7 @@
   "dependencies": {
     "@babel/runtime": "^7.8.4",
     "@datepicker-react/hooks": "^2.7.0",
-    "@megafon/ui-helpers": "^2.0.0-beta.3",
+    "@megafon/ui-helpers": "^2.0.0",
     "@popperjs/core": "^2.5.3",
     "core-js": "^3.6.4",
     "date-fns": "^2.16.1",
@@ -97,5 +97,5 @@
     "react-popper": "^2.2.3",
     "swiper": "^6.5.6"
   },
-  "gitHead": "b9c40183bddf83627eb55aefdfc561babfd1f64f"
+  "gitHead": "6c0ceaf24ab250ae0d733395974991f0b58572b6"
 }