@megafon/ui-core 2.1.3 → 2.4.0

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

@@ -121,6 +121,7 @@ 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;
@@ -174,7 +175,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 +183,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 +206,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,18 +223,18 @@ 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);
@@ -256,7 +257,8 @@ var TextField = function TextField(_ref) {
   };
   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 +278,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() {
@@ -392,6 +394,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,

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;

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

@@ -109,7 +109,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,
@@ -137,7 +137,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,
@@ -145,7 +145,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),
@@ -155,7 +155,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]);
@@ -165,9 +165,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 (!checkEventIsClickOrEnterPress(e)) {
       return;
@@ -178,24 +178,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) {
@@ -205,10 +205,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 () {
@@ -222,7 +222,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) {
@@ -247,7 +247,7 @@ var Tooltip = function Tooltip(_ref) {
     }
 
     return undefined;
-  }, [triggerEventName, isOpen, currentTrigger, handleOutsideEvent, handleClick]);
+  }, [triggerEventName, isOpen, currentTrigger, handleOutsideEvent, handleClick, clickEvent]);
   return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
     className: cn({
       paddings: paddings,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-core",
-  "version": "2.1.3",
+  "version": "2.4.0",
   "files": [
     "dist",
     "styles"
@@ -96,5 +96,5 @@
     "react-popper": "^2.2.3",
     "swiper": "^6.5.6"
   },
-  "gitHead": "884922566102445160ff8cbc20f6d54142b621e5"
+  "gitHead": "1c92184284a8224e5832b4c2218231edfcbb4d5f"
 }

package/styles/base.less

@@ -19,6 +19,9 @@
 @fury: #F62434;
 @systemBlue: #34AAF2;
 @background: #FFFFFF;
+@buttonHoverGreen: #10E272;
+@buttonhoverPurple: #534455;
+@buttonDown: #404D46;
 
 // Gradients
 @basic: linear-gradient(90deg, #01873F 0%, #00B956 74%, #14CD6A 100%);
@@ -56,11 +59,6 @@
 @fury80: #F8505D;
 @fury20: #FFC5C9;
 
-// old colors
-@buttonHoverGreen: #10E272;
-@buttonhoverPurple: #534455;
-@buttonDown: #404D46;
-
 // Notification Colors
 // TODO: будут отрефакторены после обновления дизайном Notification по новой палитре
 @error: #FFC4C9;