@megafon/ui-core 8.17.1 → 8.17.4

package/dist/lib/hooks/useResolution.d.ts

@@ -0,0 +1,6 @@
+type UseResolutionReturnType = {
+    isMobileExtraSmall: boolean;
+    isMobile: boolean;
+};
+declare function useResolution(): UseResolutionReturnType;
+export default useResolution;

package/dist/lib/hooks/useResolution.js

@@ -0,0 +1,61 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var React = _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var RESOLUTIONS;
+(function (RESOLUTIONS) {
+  RESOLUTIONS[RESOLUTIONS["MOBILE_XS_END"] = 359] = "MOBILE_XS_END";
+  RESOLUTIONS[RESOLUTIONS["MOBILE_END"] = 767] = "MOBILE_END";
+})(RESOLUTIONS || (RESOLUTIONS = {}));
+var _RESOLUTIONS = RESOLUTIONS,
+  MOBILE_END = _RESOLUTIONS.MOBILE_END,
+  MOBILE_XS_END = _RESOLUTIONS.MOBILE_XS_END;
+var MEDIA_QUERIES = {
+  MAX_WIDTH_MOBILE_XS_END: "(max-width: ".concat(MOBILE_XS_END, "px)"),
+  MAX_WIDTH_MOBILE_END: "(max-width: ".concat(MOBILE_END, "px)")
+};
+var MAX_WIDTH_MOBILE_XS_END = MEDIA_QUERIES.MAX_WIDTH_MOBILE_XS_END,
+  MAX_WIDTH_MOBILE_END = MEDIA_QUERIES.MAX_WIDTH_MOBILE_END;
+var isScreenWidthAtMost = function isScreenWidthAtMost(maxWidth) {
+  return typeof window !== 'undefined' ? window.innerWidth <= maxWidth : false;
+};
+function useResolution() {
+  var _React$useState = React.useState(isScreenWidthAtMost(MOBILE_END)),
+    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    isMobile = _React$useState2[0],
+    setIsMobile = _React$useState2[1];
+  var _React$useState3 = React.useState(isScreenWidthAtMost(MOBILE_XS_END)),
+    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
+    isMobileExtraSmall = _React$useState4[0],
+    setIsMobileExtraSmall = _React$useState4[1];
+  var handleMediaChange = function handleMediaChange(updateStateFn) {
+    return function (e) {
+      return updateStateFn(e.matches);
+    };
+  };
+  var handleMaxWidthMobileEnd = handleMediaChange(setIsMobile);
+  var handleMaxWidthMobileExtraSmall = handleMediaChange(setIsMobileExtraSmall);
+  React.useEffect(function () {
+    var mobileExtraSmallQuery = window.matchMedia(MAX_WIDTH_MOBILE_XS_END);
+    var mobileQuery = window.matchMedia(MAX_WIDTH_MOBILE_END);
+    mobileExtraSmallQuery.addEventListener('change', handleMaxWidthMobileExtraSmall);
+    mobileQuery.addEventListener('change', handleMaxWidthMobileEnd);
+    return function () {
+      mobileExtraSmallQuery.removeEventListener('change', handleMaxWidthMobileExtraSmall);
+      mobileQuery.removeEventListener('change', handleMaxWidthMobileEnd);
+    };
+  }, [handleMaxWidthMobileEnd, handleMaxWidthMobileExtraSmall]);
+  return {
+    isMobile: isMobile,
+    isMobileExtraSmall: isMobileExtraSmall
+  };
+}
+var _default = exports["default"] = useResolution;

package/dist/lib/hooks/useSwipe.d.ts

@@ -0,0 +1,13 @@
+export declare enum TransitionSteps {
+    INITIAL_STEP = "initial-step",
+    MOVE_STEP = "move-step",
+    MOVE_END_STEP = "move-end-step"
+}
+type UseSwipeReturnType = {
+    /** Значение для css-свойства transform управляемого элемента */
+    transform: string;
+    /** Текущий этап смахивания элемента */
+    transitionStep: TransitionSteps;
+};
+declare function useSwipe(element: HTMLElement | null): UseSwipeReturnType;
+export default useSwipe;

package/dist/lib/hooks/useSwipe.js

@@ -0,0 +1,137 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.TransitionSteps = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+require("core-js/modules/es.number.constructor.js");
+require("core-js/modules/es.number.is-nan.js");
+require("core-js/modules/es.regexp.exec.js");
+require("core-js/modules/es.string.match.js");
+var React = _interopRequireWildcard(require("react"));
+var _useResolution2 = _interopRequireDefault(require("./useResolution"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var TransitionSteps;
+(function (TransitionSteps) {
+  TransitionSteps["INITIAL_STEP"] = "initial-step";
+  TransitionSteps["MOVE_STEP"] = "move-step";
+  TransitionSteps["MOVE_END_STEP"] = "move-end-step";
+})(TransitionSteps || (exports.TransitionSteps = TransitionSteps = {}));
+// Смахивание элемента влево или вправо на мобильном устройстве.
+// Элемент закрывается на событии 'touchend', если он был смещен пользователем больше, чем на половину ширины окна.
+function useSwipe(element) {
+  var _useResolution = (0, _useResolution2["default"])(),
+    isMobile = _useResolution.isMobile;
+  var _React$useState = React.useState(null),
+    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    initialTouchPositionX = _React$useState2[0],
+    setInitialTouchPositionX = _React$useState2[1];
+  var _React$useState3 = React.useState(null),
+    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
+    initialTouchPositionY = _React$useState4[0],
+    setInitialTouchPositionY = _React$useState4[1];
+  var _React$useState5 = React.useState(TransitionSteps.INITIAL_STEP),
+    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
+    transitionStep = _React$useState6[0],
+    setTransitionStep = _React$useState6[1];
+  var _React$useState7 = React.useState(''),
+    _React$useState8 = (0, _slicedToArray2["default"])(_React$useState7, 2),
+    transform = _React$useState8[0],
+    setTransform = _React$useState8[1];
+  var animationFrameId = React.useRef(0);
+  var currentElement = element;
+  var isTransitionMoveStep = transitionStep === TransitionSteps.MOVE_STEP;
+  var currentTransform = currentElement ? getComputedStyle(currentElement).transform : '';
+  var handleWindowTouchMove = React.useCallback(function (e) {
+    if (animationFrameId) {
+      window.cancelAnimationFrame(animationFrameId.current);
+    }
+    animationFrameId.current = window.requestAnimationFrame(function () {
+      var _a;
+      if (!initialTouchPositionY) {
+        setInitialTouchPositionY(e.touches[0].clientY);
+        return;
+      }
+      if (!initialTouchPositionX) {
+        setInitialTouchPositionX(e.touches[0].clientX);
+        return;
+      }
+      var positionsDiffX = initialTouchPositionX - e.touches[0].clientX;
+      var positionsDiffY = initialTouchPositionY - e.touches[0].clientY;
+      if (Math.abs(positionsDiffY) > Math.abs(positionsDiffX)) {
+        return;
+      }
+      setTransitionStep(TransitionSteps.MOVE_STEP);
+      if (!currentElement) {
+        return;
+      }
+      var positionsDiff = initialTouchPositionX - e.touches[0].clientX;
+      var values = !!currentTransform && currentTransform !== 'none' ? (_a = currentTransform.match(/\(((?:[0-9][,\s]*)+)\)/)) === null || _a === void 0 ? void 0 : _a[0].split(', ') : undefined;
+      var currentTranslateX = !values || Number.isNaN(Number(values === null || values === void 0 ? void 0 : values[4])) ? 0 : Number(values === null || values === void 0 ? void 0 : values[4]);
+      positionsDiff !== 0 && setTransform("translateX(".concat(currentTranslateX - positionsDiff, "px)"));
+      animationFrameId.current = 0;
+    });
+  }, [initialTouchPositionX, initialTouchPositionY, currentElement, currentTransform]);
+  var handleWindowTouchEnd = React.useCallback(function (e) {
+    var _a, _b;
+    if (!currentElement || !isTransitionMoveStep || !initialTouchPositionX || !initialTouchPositionY) {
+      return;
+    }
+    window.cancelAnimationFrame(animationFrameId.current);
+    var touchPositionY = (_a = e.changedTouches[0]) === null || _a === void 0 ? void 0 : _a.clientY;
+    var touchPositionX = (_b = e.changedTouches[0]) === null || _b === void 0 ? void 0 : _b.clientX;
+    if (Math.abs(touchPositionY - initialTouchPositionY) > Math.abs(touchPositionX - initialTouchPositionX)) {
+      setInitialTouchPositionX(null);
+      setInitialTouchPositionY(null);
+      return;
+    }
+    var windowCenterPosition = window.innerWidth / 2;
+    var isRightSwipe = touchPositionX > initialTouchPositionX;
+    var isLeftSwipe = touchPositionX < initialTouchPositionX;
+    var isMoreHalfSwiped = Math.abs(initialTouchPositionX - touchPositionX) > windowCenterPosition;
+    setInitialTouchPositionX(null);
+    switch (true) {
+      case isMoreHalfSwiped && isRightSwipe:
+        {
+          setTransform('translateX(110%)');
+          setTransitionStep(TransitionSteps.MOVE_END_STEP);
+          break;
+        }
+      case isMoreHalfSwiped && isLeftSwipe:
+        {
+          setTransform('translateX(-110%)');
+          setTransitionStep(TransitionSteps.MOVE_END_STEP);
+          break;
+        }
+      default:
+        {
+          setTransform('none');
+          setTransitionStep(TransitionSteps.INITIAL_STEP);
+        }
+    }
+  }, [currentElement, isTransitionMoveStep, initialTouchPositionX, initialTouchPositionY]);
+  React.useEffect(function () {
+    if (!isMobile || !currentElement) {
+      return;
+    }
+    currentElement.addEventListener('touchmove', handleWindowTouchMove);
+    currentElement.addEventListener('touchend', handleWindowTouchEnd);
+    /* eslint-disable-next-line consistent-return */
+    return function () {
+      if (!currentElement) {
+        return;
+      }
+      currentElement.removeEventListener('touchmove', handleWindowTouchMove);
+      currentElement.removeEventListener('touchend', handleWindowTouchEnd);
+    };
+  }, [isMobile, handleWindowTouchMove, handleWindowTouchEnd, currentElement]);
+  return {
+    transform: transform,
+    transitionStep: transitionStep
+  };
+}
+var _default = exports["default"] = useSwipe;

package/dist/lib/index.d.ts

@@ -0,0 +1,84 @@
+export { default as Accordion } from './components/Accordion/Accordion';
+export { default as Avatar } from './components/Avatar/Avatar';
+export { default as Banner } from './components/Banner/Banner';
+export { default as BannerDot } from './components/Banner/BannerDot';
+export { default as Button } from './components/Button/Button';
+export { default as Calendar } from './components/Calendar/Calendar';
+export { default as Caption } from './components/Caption/Caption';
+export { default as Carousel } from './components/Carousel/Carousel';
+export { default as Checkbox } from './components/Checkbox/Checkbox';
+export { default as checkBreakpointsPropTypes } from './components/Carousel/checkBreakpointsPropTypes';
+export { default as Chip } from './components/Chips/Chip';
+export { default as Chips } from './components/Chips/Chips';
+export { default as ChipsDropdown } from './components/Chips/components/ChipsDropdown/ChipsDropdown';
+export { default as ChipsScrollPanel } from './components/Chips/components/ChipsScrollPanel/ChipsScrollPanel';
+export { default as Collapse } from './components/_Collapse/Collapse';
+export { default as ContentArea } from './components/ContentArea/ContentArea';
+export { default as ContentView } from './components/ContentView/ContentView';
+export { default as Counter } from './components/Counter/Counter';
+export { default as CounterBadge } from './components/Badges/CounterBadge/CounterBadge';
+export { default as countGraphemes } from './components/TextField/utils/countGraphemes';
+export { default as Day } from './components/Calendar/components/_Day/Day';
+export { default as ErrorLoad } from './components/ErrorLoad/ErrorLoad';
+export { default as Grid } from './components/Grid/Grid';
+export { default as GridColumn } from './components/Grid/GridColumn';
+export { default as Header } from './components/Header/Header';
+export { default as Link } from './components/Link/Link';
+export { default as List } from './components/List/List';
+export { default as ListData } from './components/ListData/ListData';
+export { default as ListDataGroup } from './components/ListData/ListDataGroup';
+export { default as ListDataSortable } from './components/ListData/components/ListDataSortable';
+export { default as ListItem } from './components/List/ListItem';
+export { default as Logo } from './components/Logo/Logo';
+export { default as Modal } from './components/Modal/Modal';
+export { default as ModalContent } from './components/Modal/_ModalContent/ModalContent';
+export { default as ModalDesktop } from './components/Modal/_ModalDesktop/ModalDesktop';
+export { default as ModalMobileBottom } from './components/Modal/_ModalMobileBottom/ModalMobileBottom';
+export { default as ModalMobileFullScreen } from './components/Modal/_ModalMobileFullScreen/ModalMobileFullScreen';
+export { default as Month } from './components/Calendar/components/_Month/Month';
+export { default as NavArrow } from './components/NavArrow/NavArrow';
+export { default as Notification } from './components/Notification/Notification';
+export { default as NotificationBadge } from './components/Badges/NotificationBadge/NotificationBadge';
+export { default as Pagination } from './components/Pagination/Pagination';
+export { default as PaginationButton } from './components/Pagination/components/PaginationButton/PaginationButton';
+export { default as PaginationButtons } from './components/Pagination/components/PaginationButtons/PaginationButtons';
+export { default as PaginationNavigation } from './components/Pagination/components/PaginationNavigation/PaginationNavigation';
+export { default as Paragraph } from './components/Paragraph/Paragraph';
+export { default as Parameter } from './components/Parameter/Parameter';
+export { default as ParameterDescription } from './components/Parameter/components/ParameterDescription';
+export { default as Preloader } from './components/Preloader/Preloader';
+export { default as PriceBadge } from './components/Badges/PriceBadge/PriceBadge';
+export { default as PromoBadge } from './components/Badges/PromoBadge/PromoBadge';
+export { default as RadioButton } from './components/RadioButton/RadioButton';
+export { default as Row } from './components/Row/Row';
+export { default as ScrollBar } from './components/ScrollBar/ScrollBar';
+export { default as Search } from './components/Search/Search';
+export { default as Select } from './components/Select/Select';
+export { default as Selector } from './components/Selector/Selector';
+export { default as selectReducer } from './components/Select/reducer/selectReducer';
+export { default as Slider } from './components/Sliders/Slider/Slider';
+export { default as SliderRange } from './components/Sliders/SliderRange/SliderRange';
+export { default as SliderRatio } from './components/Sliders/SliderRatio/SliderRatio';
+export { default as SliderScale } from './components/Sliders/components/SliderScale/SliderScale';
+export { default as slidesSettings } from './components/Banner/slidesSettings';
+export { default as Snackbar } from './components/Snackbar/Snackbar';
+export { default as SnackbarTimer } from './components/Snackbar/SnackbarTimer/SnackbarTimer';
+export { default as StatusBadge } from './components/Badges/StatusBadge/StatusBadge';
+export { default as Switcher } from './components/Switcher/Switcher';
+export { default as Tab } from './components/Tabs/Tab';
+export { default as Tabs } from './components/Tabs/Tabs';
+export { default as TextField } from './components/TextField/TextField';
+export { default as TextLink } from './components/TextLink/TextLink';
+export { default as Tile } from './components/Tile/Tile';
+export { default as Timer } from './components/Badges/TimerBadge/components/Timer/Timer';
+export { default as TimerBadge } from './components/Badges/TimerBadge/TimerBadge';
+export { default as Tooltip } from './components/Tooltip/Tooltip';
+export { default as UploadField } from './components/UploadForm/UploadField/UploadField';
+export { default as UploadFieldDropArea } from './components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea';
+export { default as UploadFileItem } from './components/UploadForm/UploadFileItem/UploadFileItem';
+export { default as UploadFileItemIcon } from './components/UploadForm/UploadFileItem/components/_UploadFileItemIcon/UploadFileItemIcon';
+export { default as useDragAndDrop } from './components/UploadForm/UploadField/components/useDragAndDrop';
+export { default as useGradient } from './components/Carousel/useGradient';
+export { default as usePagination } from './components/Pagination/usePagination';
+export { default as utils } from './components/Modal/utils/utils';
+export { default as ValueField } from './components/ValueField/ValueField';