@megafon/ui-core 5.2.1 → 5.2.3

package/CHANGELOG.md

@@ -3,6 +3,29 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.3](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/compare/@megafon/ui-core@5.2.2...@megafon/ui-core@5.2.3) (2023-10-17)
+
+
+### Bug Fixes
+
+* **preloader:** add new prop disableAnimate ([5b1fc46](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/commit/5b1fc469ccab408679e07e64ce3e04474a410c09))
+* **switcher:** add new prop waiting ([78b8bb9](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/commit/78b8bb9d115ed0a45d529a1204f5a3d5d132a330))
+
+
+
+
+
+## [5.2.2](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/compare/@megafon/ui-core@5.2.1...@megafon/ui-core@5.2.2) (2023-09-14)
+
+
+### Bug Fixes
+
+* **colors:** replace dark buttonHoverPurpleSoft color ([0b68d15](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/commit/0b68d15cb053f4e9020e28e0a997c81e070f060c))
+
+
+
+
+
 ## [5.2.1](https://hq-gitlab.megafon.ru/site-portal/libraries/javascript/megafon-ui/compare/@megafon/ui-core@5.2.0...@megafon/ui-core@5.2.1) (2023-08-28)
 
 

package/dist/es/components/Preloader/Preloader.css

@@ -138,6 +138,10 @@
   -webkit-animation-delay: 0.33s;
           animation-delay: 0.33s;
 }
+.mfui-preloader_disable-animate .mfui-preloader__item:before {
+  -webkit-animation: none;
+          animation: none;
+}
 @-webkit-keyframes scaling {
   0% {
     -webkit-transform: scale(1);

package/dist/es/components/Preloader/Preloader.d.ts

@@ -26,6 +26,8 @@ export interface IPreloaderProps {
     sizeTablet?: PreloaderSizesType;
     /** Размер на разрешении экрана 0-767 */
     sizeMobile?: PreloaderSizesType;
+    /** Отмена анимации  */
+    disableAnimate?: boolean;
     /** Дополнительный класс корневого элемента */
     className?: string;
     /** Дополнительные data атрибуты к внутренним элементам */

package/dist/es/components/Preloader/Preloader.js

@@ -24,6 +24,8 @@ var Preloader = function Preloader(_ref) {
       sizeAll = _ref$sizeAll === void 0 ? 'medium' : _ref$sizeAll,
       _ref$delay = _ref.delay,
       delay = _ref$delay === void 0 ? true : _ref$delay,
+      _ref$disableAnimate = _ref.disableAnimate,
+      disableAnimate = _ref$disableAnimate === void 0 ? false : _ref$disableAnimate,
       sizeWide = _ref.sizeWide,
       sizeDesktop = _ref.sizeDesktop,
       sizeTablet = _ref.sizeTablet,
@@ -55,7 +57,8 @@ var Preloader = function Preloader(_ref) {
       'size-wide': sizeWide,
       'size-desktop': sizeDesktop,
       'size-tablet': sizeTablet,
-      'size-mobile': sizeMobile
+      'size-mobile': sizeMobile,
+      'disable-animate': disableAnimate
     }, className)
   }), /*#__PURE__*/React.createElement("div", {
     className: cn('item', {
@@ -79,6 +82,7 @@ Preloader.propTypes = {
   sizeDesktop: PropTypes.oneOf(Object.values(PreloaderSizes)),
   sizeTablet: PropTypes.oneOf(Object.values(PreloaderSizes)),
   sizeMobile: PropTypes.oneOf(Object.values(PreloaderSizes)),
+  disableAnimate: PropTypes.bool,
   className: PropTypes.string,
   dataAttrs: PropTypes.shape({
     root: PropTypes.objectOf(PropTypes.string.isRequired)

package/dist/es/components/Switcher/Switcher.css

@@ -75,6 +75,27 @@
             transform: translateX(0);
   }
 }
+.mfui-switcher__timer {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background: var(--base);
+  -webkit-transform: translate(-50%, -50%);
+          transform: translate(-50%, -50%);
+}
+.mfui-switcher__timer-icon {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 20px;
+  height: 20px;
+  -webkit-transform: translate(-50%, -50%);
+          transform: translate(-50%, -50%);
+  fill: var(--spbSky2);
+}
 .mfui-switcher__input {
   position: relative;
   -ms-flex-item-align: start;
@@ -96,7 +117,8 @@
   background-color: var(--spbSky1);
 }
 .mfui-switcher__input_disabled,
-.mfui-switcher__input_loaded {
+.mfui-switcher__input_loaded,
+.mfui-switcher__input_waiting {
   cursor: default;
 }
 .mfui-switcher__input:hover:not(.mfui-switcher__input_disabled) {

package/dist/es/components/Switcher/Switcher.d.ts

@@ -7,12 +7,16 @@ export interface ISwitcherProps {
         root?: Record<string, string>;
         input?: Record<string, string>;
         loader?: Record<string, string>;
+        pointer?: Record<string, string>;
+        timer?: Record<string, string>;
     };
     /** Дополнительный класс корневого элемента */
     className?: string;
     /** Управление состоянием вкл/выкл компонента */
     checked?: boolean;
-    /** Отключение переключателя */
+    /** Состояние ожидание */
+    waiting?: boolean;
+    /** сот */
     disabled?: boolean;
     /** Состояние загрузки */
     showLoader?: boolean;

package/dist/es/components/Switcher/Switcher.js

@@ -3,6 +3,17 @@ import * as React from 'react';
 import { checkEventIsClickOrEnterPress, cnCreate, detectTouch, filterDataAttrs } from '@megafon/ui-helpers';
 import * as PropTypes from 'prop-types';
 import "./Switcher.css";
+
+var WaitingIcon = function WaitingIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    viewBox: "0 0 20 20"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M10 18a8 8 0 100-16 8 8 0 000 16zm1-8.414V5H9v5.414l3 3L13.414 12 11 9.586z"
+  }));
+};
+
 var cn = cnCreate('mfui-switcher');
 
 var Switcher = function Switcher(_ref) {
@@ -14,6 +25,8 @@ var Switcher = function Switcher(_ref) {
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       _ref$showLoader = _ref.showLoader,
       showLoader = _ref$showLoader === void 0 ? false : _ref$showLoader,
+      _ref$waiting = _ref.waiting,
+      waiting = _ref$waiting === void 0 ? false : _ref$waiting,
       children = _ref.children,
       _ref$textSize = _ref.textSize,
       textSize = _ref$textSize === void 0 ? 'medium' : _ref$textSize,
@@ -23,7 +36,9 @@ var Switcher = function Switcher(_ref) {
   var isTouch = detectTouch();
   var isLeftContent = !!children && textPosition === 'left';
   var isRightContent = !!children && textPosition === 'right';
-  var isInteractiveDisabled = showLoader || disabled;
+  var isNoProcesses = disabled || waiting;
+  var isInteractiveDisabled = showLoader || isNoProcesses;
+  var isLoaderDisplayed = showLoader && !isNoProcesses;
   var handleChange = React.useCallback(function (e) {
     if (isInteractiveDisabled || !checkEventIsClickOrEnterPress(e)) {
       return;
@@ -42,19 +57,23 @@ var Switcher = function Switcher(_ref) {
     })
   }, children), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input), {
     className: cn('input', {
-      checked: checked,
-      disabled: disabled,
-      loaded: showLoader,
+      checked: checked && !waiting,
+      disabled: isNoProcesses,
+      loaded: showLoader && !waiting,
       'no-touch': !isTouch
     }),
     onClick: handleChange,
     onKeyDown: handleChange,
     tabIndex: isInteractiveDisabled ? undefined : 0
-  }), showLoader && !disabled && /*#__PURE__*/React.createElement("div", _extends({
+  }), isLoaderDisplayed && /*#__PURE__*/React.createElement("div", _extends({
     className: cn('loader')
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.loader))), /*#__PURE__*/React.createElement("div", {
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.loader))), waiting ? /*#__PURE__*/React.createElement("div", _extends({
+    className: cn('timer')
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.timer)), /*#__PURE__*/React.createElement(WaitingIcon, {
+    className: cn('timer-icon')
+  })) : /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.pointer), {
     className: cn('pointer')
-  })), isRightContent && /*#__PURE__*/React.createElement("div", {
+  }))), isRightContent && /*#__PURE__*/React.createElement("div", {
     className: cn('content', {
       size: textSize
     })
@@ -72,6 +91,7 @@ Switcher.propTypes = {
   textPosition: PropTypes.oneOf(['left', 'right']),
   checked: PropTypes.bool,
   disabled: PropTypes.bool,
+  waiting: PropTypes.bool,
   showLoader: PropTypes.bool,
   onChange: PropTypes.func
 };

package/dist/lib/components/Preloader/Preloader.css

@@ -138,6 +138,10 @@
   -webkit-animation-delay: 0.33s;
           animation-delay: 0.33s;
 }
+.mfui-preloader_disable-animate .mfui-preloader__item:before {
+  -webkit-animation: none;
+          animation: none;
+}
 @-webkit-keyframes scaling {
   0% {
     -webkit-transform: scale(1);

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

@@ -26,6 +26,8 @@ export interface IPreloaderProps {
     sizeTablet?: PreloaderSizesType;
     /** Размер на разрешении экрана 0-767 */
     sizeMobile?: PreloaderSizesType;
+    /** Отмена анимации  */
+    disableAnimate?: boolean;
     /** Дополнительный класс корневого элемента */
     className?: string;
     /** Дополнительные data атрибуты к внутренним элементам */

package/dist/lib/components/Preloader/Preloader.js

@@ -47,6 +47,8 @@ var Preloader = function Preloader(_ref) {
       sizeAll = _ref$sizeAll === void 0 ? 'medium' : _ref$sizeAll,
       _ref$delay = _ref.delay,
       delay = _ref$delay === void 0 ? true : _ref$delay,
+      _ref$disableAnimate = _ref.disableAnimate,
+      disableAnimate = _ref$disableAnimate === void 0 ? false : _ref$disableAnimate,
       sizeWide = _ref.sizeWide,
       sizeDesktop = _ref.sizeDesktop,
       sizeTablet = _ref.sizeTablet,
@@ -78,7 +80,8 @@ var Preloader = function Preloader(_ref) {
       'size-wide': sizeWide,
       'size-desktop': sizeDesktop,
       'size-tablet': sizeTablet,
-      'size-mobile': sizeMobile
+      'size-mobile': sizeMobile,
+      'disable-animate': disableAnimate
     }, className)
   }), /*#__PURE__*/React.createElement("div", {
     className: cn('item', {
@@ -102,6 +105,7 @@ Preloader.propTypes = {
   sizeDesktop: PropTypes.oneOf(Object.values(PreloaderSizes)),
   sizeTablet: PropTypes.oneOf(Object.values(PreloaderSizes)),
   sizeMobile: PropTypes.oneOf(Object.values(PreloaderSizes)),
+  disableAnimate: PropTypes.bool,
   className: PropTypes.string,
   dataAttrs: PropTypes.shape({
     root: PropTypes.objectOf(PropTypes.string.isRequired)

package/dist/lib/components/Switcher/Switcher.css

@@ -75,6 +75,27 @@
             transform: translateX(0);
   }
 }
+.mfui-switcher__timer {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background: var(--base);
+  -webkit-transform: translate(-50%, -50%);
+          transform: translate(-50%, -50%);
+}
+.mfui-switcher__timer-icon {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 20px;
+  height: 20px;
+  -webkit-transform: translate(-50%, -50%);
+          transform: translate(-50%, -50%);
+  fill: var(--spbSky2);
+}
 .mfui-switcher__input {
   position: relative;
   -ms-flex-item-align: start;
@@ -96,7 +117,8 @@
   background-color: var(--spbSky1);
 }
 .mfui-switcher__input_disabled,
-.mfui-switcher__input_loaded {
+.mfui-switcher__input_loaded,
+.mfui-switcher__input_waiting {
   cursor: default;
 }
 .mfui-switcher__input:hover:not(.mfui-switcher__input_disabled) {

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

@@ -7,12 +7,16 @@ export interface ISwitcherProps {
         root?: Record<string, string>;
         input?: Record<string, string>;
         loader?: Record<string, string>;
+        pointer?: Record<string, string>;
+        timer?: Record<string, string>;
     };
     /** Дополнительный класс корневого элемента */
     className?: string;
     /** Управление состоянием вкл/выкл компонента */
     checked?: boolean;
-    /** Отключение переключателя */
+    /** Состояние ожидание */
+    waiting?: boolean;
+    /** сот */
     disabled?: boolean;
     /** Состояние загрузки */
     showLoader?: boolean;

package/dist/lib/components/Switcher/Switcher.js

@@ -21,6 +21,16 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+var WaitingIcon = function WaitingIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
+    viewBox: "0 0 20 20"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M10 18a8 8 0 100-16 8 8 0 000 16zm1-8.414V5H9v5.414l3 3L13.414 12 11 9.586z"
+  }));
+};
+
 var cn = (0, _uiHelpers.cnCreate)('mfui-switcher');
 
 var Switcher = function Switcher(_ref) {
@@ -32,6 +42,8 @@ var Switcher = function Switcher(_ref) {
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       _ref$showLoader = _ref.showLoader,
       showLoader = _ref$showLoader === void 0 ? false : _ref$showLoader,
+      _ref$waiting = _ref.waiting,
+      waiting = _ref$waiting === void 0 ? false : _ref$waiting,
       children = _ref.children,
       _ref$textSize = _ref.textSize,
       textSize = _ref$textSize === void 0 ? 'medium' : _ref$textSize,
@@ -41,7 +53,9 @@ var Switcher = function Switcher(_ref) {
   var isTouch = (0, _uiHelpers.detectTouch)();
   var isLeftContent = !!children && textPosition === 'left';
   var isRightContent = !!children && textPosition === 'right';
-  var isInteractiveDisabled = showLoader || disabled;
+  var isNoProcesses = disabled || waiting;
+  var isInteractiveDisabled = showLoader || isNoProcesses;
+  var isLoaderDisplayed = showLoader && !isNoProcesses;
   var handleChange = React.useCallback(function (e) {
     if (isInteractiveDisabled || !(0, _uiHelpers.checkEventIsClickOrEnterPress)(e)) {
       return;
@@ -60,19 +74,23 @@ var Switcher = function Switcher(_ref) {
     })
   }, children), /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input), {
     className: cn('input', {
-      checked: checked,
-      disabled: disabled,
-      loaded: showLoader,
+      checked: checked && !waiting,
+      disabled: isNoProcesses,
+      loaded: showLoader && !waiting,
       'no-touch': !isTouch
     }),
     onClick: handleChange,
     onKeyDown: handleChange,
     tabIndex: isInteractiveDisabled ? undefined : 0
-  }), showLoader && !disabled && /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+  }), isLoaderDisplayed && /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn('loader')
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.loader))), /*#__PURE__*/React.createElement("div", {
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.loader))), waiting ? /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+    className: cn('timer')
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.timer)), /*#__PURE__*/React.createElement(WaitingIcon, {
+    className: cn('timer-icon')
+  })) : /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.pointer), {
     className: cn('pointer')
-  })), isRightContent && /*#__PURE__*/React.createElement("div", {
+  }))), isRightContent && /*#__PURE__*/React.createElement("div", {
     className: cn('content', {
       size: textSize
     })
@@ -90,6 +108,7 @@ Switcher.propTypes = {
   textPosition: PropTypes.oneOf(['left', 'right']),
   checked: PropTypes.bool,
   disabled: PropTypes.bool,
+  waiting: PropTypes.bool,
   showLoader: PropTypes.bool,
   onChange: PropTypes.func
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-core",
-  "version": "5.2.1",
+  "version": "5.2.3",
   "files": [
     "dist",
     "styles"
@@ -50,7 +50,7 @@
     "@babel/preset-env": "^7.8.6",
     "@babel/preset-react": "^7.8.3",
     "@babel/preset-typescript": "^7.8.3",
-    "@megafon/ui-icons": "^2.14.0",
+    "@megafon/ui-icons": "^2.14.1",
     "@svgr/core": "^2.4.1",
     "@testing-library/jest-dom": "5.16.2",
     "@testing-library/react": "12.1.2",
@@ -85,7 +85,7 @@
   "dependencies": {
     "@babel/runtime": "^7.8.4",
     "@datepicker-react/hooks": "^2.7.0",
-    "@megafon/ui-helpers": "^2.5.2",
+    "@megafon/ui-helpers": "^2.5.3",
     "@popperjs/core": "^2.5.3",
     "core-js": "^3.6.4",
     "date-fns": "^2.16.1",
@@ -96,5 +96,5 @@
     "react-popper": "^2.2.3",
     "swiper": "^6.5.6"
   },
-  "gitHead": "61659ea89aca6bac2ebcd3befa866f430ad0ee30"
+  "gitHead": "1bb6769da99d917f5dd4420892c57a7af5be3ab4"
 }

package/styles/colorsDark.css

@@ -23,7 +23,7 @@
         --buttonHoverGreen: #10E272;
         --buttonHoverGreenSoft: #355A46;
         --buttonHoverPurple: #A500BF;
-        --buttonHoverPurpleSoft: #FFE1FF;
+        --buttonHoverPurpleSoft: #492B50;
         --buttonHoverGrey: #D6D6D6;
         --buttonDown: #404D46;
         --overlay: #000000CC;