@megafon/ui-core 6.0.0-beta.4 → 6.0.0

package/dist/lib/components/Carousel/Carousel.js

@@ -1,115 +1,70 @@
 "use strict";
 
-function _typeof3(o) { "@babel/helpers - typeof"; return _typeof3 = "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; }, _typeof3(o); }
+function _typeof3(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof3 = function _typeof3(obj) { return typeof obj; }; } else { _typeof3 = function _typeof3(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof3(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.NavTheme = exports.EffectTheme = void 0;
+exports["default"] = exports.EffectTheme = exports.NavTheme = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-require("core-js/modules/es.array.index-of.js");
-require("core-js/modules/es.symbol.js");
-require("core-js/modules/es.symbol.description.js");
-require("core-js/modules/es.symbol.iterator.js");
-require("core-js/modules/es.array.from.js");
+
 require("core-js/modules/es.array.is-array.js");
-require("core-js/modules/es.array.iterator.js");
-require("core-js/modules/es.array.slice.js");
-require("core-js/modules/es.date.to-string.js");
-require("core-js/modules/es.function.name.js");
-require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/es.regexp.exec.js");
-require("core-js/modules/es.regexp.test.js");
-require("core-js/modules/es.regexp.to-string.js");
-require("core-js/modules/es.string.iterator.js");
-require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.array.index-of.js");
+
 require("core-js/modules/es.array.map.js");
-var React = _interopRequireWildcard(require("react"));
+
+require("core-js/modules/es.object.values.js");
+
+var _react = _interopRequireDefault(require("react"));
+
 var _uiHelpers = require("@megafon/ui-helpers");
+
 var _lodash = _interopRequireDefault(require("lodash.throttle"));
-var _modules = require("swiper/modules");
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
+var _swiper = _interopRequireWildcard(require("swiper"));
+
 var _react2 = require("swiper/react");
+
+var _NavArrow = _interopRequireWildcard(require("../NavArrow/NavArrow"));
+
 var _throttleTime = _interopRequireDefault(require("../../constants/throttleTime"));
+
 var _usePrevious = _interopRequireDefault(require("../../hooks/usePrevious"));
-var _NavArrow = _interopRequireWildcard(require("../NavArrow/NavArrow"));
+
+var _checkBreakpointsPropTypes = _interopRequireDefault(require("./checkBreakpointsPropTypes"));
+
 var _useGradient = _interopRequireDefault(require("./useGradient"));
-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" != _typeof3(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 && Object.prototype.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 _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-function _createForOfIteratorHelper(o, allowArrayLike) {
-  var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
-  if (!it) {
-    if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
-      if (it) o = it;
-      var i = 0;
-      var F = function F() {};
-      return {
-        s: F,
-        n: function n() {
-          if (i >= o.length) return {
-            done: true
-          };
-          return {
-            done: false,
-            value: o[i++]
-          };
-        },
-        e: function e(_e) {
-          throw _e;
-        },
-        f: F
-      };
-    }
-    throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-  }
-  var normalCompletion = true,
-    didErr = false,
-    err;
-  return {
-    s: function s() {
-      it = it.call(o);
-    },
-    n: function n() {
-      var step = it.next();
-      normalCompletion = step.done;
-      return step;
-    },
-    e: function e(_e2) {
-      didErr = true;
-      err = _e2;
-    },
-    f: function f() {
-      try {
-        if (!normalCompletion && it["return"] != null) it["return"]();
-      } finally {
-        if (didErr) throw err;
-      }
-    }
-  };
-}
-function _unsupportedIterableToArray(o, minLen) {
-  if (!o) return;
-  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-  var n = Object.prototype.toString.call(o).slice(8, -1);
-  if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(o);
-  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-}
-function _arrayLikeToArray(arr, len) {
-  if (len == null || len > arr.length) len = arr.length;
-  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-  return arr2;
-}
-var NavTheme = exports.NavTheme = {
+
+var _defaultSlidesSetting;
+
+_swiper["default"].use([_swiper.Autoplay, _swiper.Pagination, _swiper.EffectFade]);
+
+var NavTheme = {
   LIGHT: 'light',
   GREEN: 'green'
 };
-var EffectTheme = exports.EffectTheme = {
+exports.NavTheme = NavTheme;
+var EffectTheme = {
   SLIDE: 'slide',
   FADE: 'fade'
 };
+exports.EffectTheme = EffectTheme;
 var SlidesPerView = {
   AUTO: 'auto'
 };
@@ -121,6 +76,7 @@ var GradientTheme = {
   SPB_SKY_1: 'spbSky1',
   SPB_SKY_2: 'spbSky2'
 };
+
 var getAutoPlayConfig = function getAutoPlayConfig(delay) {
   return {
     delay: delay,
@@ -129,80 +85,87 @@ var getAutoPlayConfig = function getAutoPlayConfig(delay) {
     stopOnLastSlide: true
   };
 };
-var defaultSlidesSettings = (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _uiHelpers.breakpoints.MOBILE_SMALL_START, {
+
+var defaultSlidesSettings = (_defaultSlidesSetting = {}, (0, _defineProperty2["default"])(_defaultSlidesSetting, _uiHelpers.breakpoints.MOBILE_SMALL_START, {
   slidesPerView: 1,
   spaceBetween: 16
-}), _uiHelpers.breakpoints.MOBILE_BIG_START, {
+}), (0, _defineProperty2["default"])(_defaultSlidesSetting, _uiHelpers.breakpoints.MOBILE_BIG_START, {
   slidesPerView: 3,
   spaceBetween: 20
-}), _uiHelpers.breakpoints.DESKTOP_MIDDLE_START, {
+}), (0, _defineProperty2["default"])(_defaultSlidesSetting, _uiHelpers.breakpoints.DESKTOP_MIDDLE_START, {
   slidesPerView: 4,
   spaceBetween: 20
-});
+}), _defaultSlidesSetting);
 var cn = (0, _uiHelpers.cnCreate)('mfui-carousel');
+
 var Carousel = function Carousel(_ref) {
   var rootRef = _ref.rootRef,
-    className = _ref.className,
-    _ref$classes = _ref.classes,
-    _ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
-    rootClass = _ref$classes2.root,
-    innerIndentsClass = _ref$classes2.innerIndents,
-    prevClass = _ref$classes2.prev,
-    nextClass = _ref$classes2.next,
-    containerClass = _ref$classes2.container,
-    containerModifier = _ref$classes2.containerModifier,
-    slideClass = _ref$classes2.slide,
-    dataAttrs = _ref.dataAttrs,
-    _ref$slidesSettings = _ref.slidesSettings,
-    slidesSettings = _ref$slidesSettings === void 0 ? defaultSlidesSettings : _ref$slidesSettings,
-    _ref$autoPlay = _ref.autoPlay,
-    autoPlay = _ref$autoPlay === void 0 ? false : _ref$autoPlay,
-    _ref$autoPlayDelay = _ref.autoPlayDelay,
-    autoPlayDelay = _ref$autoPlayDelay === void 0 ? 5000 : _ref$autoPlayDelay,
-    _ref$loop = _ref.loop,
-    loop = _ref$loop === void 0 ? false : _ref$loop,
-    _ref$transitionSpeed = _ref.transitionSpeed,
-    transitionSpeed = _ref$transitionSpeed === void 0 ? 300 : _ref$transitionSpeed,
-    threshold = _ref.threshold,
-    _ref$initialSlide = _ref.initialSlide,
-    initialSlide = _ref$initialSlide === void 0 ? 1 : _ref$initialSlide,
-    _ref$disableTouchMove = _ref.disableTouchMove,
-    disableTouchMove = _ref$disableTouchMove === void 0 ? false : _ref$disableTouchMove,
-    _ref$centeredSlides = _ref.centeredSlides,
-    centeredSlides = _ref$centeredSlides === void 0 ? false : _ref$centeredSlides,
-    _ref$navTheme = _ref.navTheme,
-    navTheme = _ref$navTheme === void 0 ? 'light' : _ref$navTheme,
-    _ref$effectTheme = _ref.effectTheme,
-    effectTheme = _ref$effectTheme === void 0 ? 'slide' : _ref$effectTheme,
-    noSwipingSelector = _ref.noSwipingSelector,
-    children = _ref.children,
-    pagination = _ref.pagination,
-    getSwiper = _ref.getSwiper,
-    onNextClick = _ref.onNextClick,
-    onPrevClick = _ref.onPrevClick,
-    onChange = _ref.onChange,
-    _ref$slideToClickedSl = _ref.slideToClickedSlide,
-    slideToClickedSlide = _ref$slideToClickedSl === void 0 ? false : _ref$slideToClickedSl,
-    _ref$gradient = _ref.gradient,
-    gradient = _ref$gradient === void 0 ? false : _ref$gradient,
-    _ref$gradientColor = _ref.gradientColor,
-    gradientColor = _ref$gradientColor === void 0 ? 'default' : _ref$gradientColor;
-  var _React$useState = React.useState(),
-    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
-    swiperInstance = _React$useState2[0],
-    setSwiperInstance = _React$useState2[1];
-  var _React$useState3 = React.useState(true),
-    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
-    isBeginning = _React$useState4[0],
-    setBeginning = _React$useState4[1];
-  var _React$useState5 = React.useState(false),
-    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
-    isEnd = _React$useState6[0],
-    setEnd = _React$useState6[1];
-  var _React$useState7 = React.useState(false),
-    _React$useState8 = (0, _slicedToArray2["default"])(_React$useState7, 2),
-    isLocked = _React$useState8[0],
-    setLocked = _React$useState8[1];
+      className = _ref.className,
+      _ref$classes = _ref.classes;
+  _ref$classes = _ref$classes === void 0 ? {} : _ref$classes;
+  var rootClass = _ref$classes.root,
+      innerIndentsClass = _ref$classes.innerIndents,
+      prevClass = _ref$classes.prev,
+      nextClass = _ref$classes.next,
+      containerClass = _ref$classes.container,
+      containerModifier = _ref$classes.containerModifier,
+      slideClass = _ref$classes.slide,
+      dataAttrs = _ref.dataAttrs,
+      _ref$slidesSettings = _ref.slidesSettings,
+      slidesSettings = _ref$slidesSettings === void 0 ? defaultSlidesSettings : _ref$slidesSettings,
+      _ref$autoPlay = _ref.autoPlay,
+      autoPlay = _ref$autoPlay === void 0 ? false : _ref$autoPlay,
+      _ref$autoPlayDelay = _ref.autoPlayDelay,
+      autoPlayDelay = _ref$autoPlayDelay === void 0 ? 5000 : _ref$autoPlayDelay,
+      _ref$loop = _ref.loop,
+      loop = _ref$loop === void 0 ? false : _ref$loop,
+      _ref$transitionSpeed = _ref.transitionSpeed,
+      transitionSpeed = _ref$transitionSpeed === void 0 ? 300 : _ref$transitionSpeed,
+      threshold = _ref.threshold,
+      _ref$initialSlide = _ref.initialSlide,
+      initialSlide = _ref$initialSlide === void 0 ? 1 : _ref$initialSlide,
+      _ref$disableTouchMove = _ref.disableTouchMove,
+      disableTouchMove = _ref$disableTouchMove === void 0 ? false : _ref$disableTouchMove,
+      _ref$centeredSlides = _ref.centeredSlides,
+      centeredSlides = _ref$centeredSlides === void 0 ? false : _ref$centeredSlides,
+      _ref$navTheme = _ref.navTheme,
+      navTheme = _ref$navTheme === void 0 ? 'light' : _ref$navTheme,
+      _ref$effectTheme = _ref.effectTheme,
+      effectTheme = _ref$effectTheme === void 0 ? 'slide' : _ref$effectTheme,
+      noSwipingSelector = _ref.noSwipingSelector,
+      children = _ref.children,
+      pagination = _ref.pagination,
+      getSwiper = _ref.getSwiper,
+      onNextClick = _ref.onNextClick,
+      onPrevClick = _ref.onPrevClick,
+      onChange = _ref.onChange,
+      _ref$slideToClickedSl = _ref.slideToClickedSlide,
+      slideToClickedSlide = _ref$slideToClickedSl === void 0 ? false : _ref$slideToClickedSl,
+      _ref$gradient = _ref.gradient,
+      gradient = _ref$gradient === void 0 ? false : _ref$gradient,
+      _ref$gradientColor = _ref.gradientColor,
+      gradientColor = _ref$gradientColor === void 0 ? 'default' : _ref$gradientColor;
+
+  var _React$useState = _react["default"].useState(),
+      _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+      swiperInstance = _React$useState2[0],
+      setSwiperInstance = _React$useState2[1];
+
+  var _React$useState3 = _react["default"].useState(true),
+      _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
+      isBeginning = _React$useState4[0],
+      setBeginning = _React$useState4[1];
+
+  var _React$useState5 = _react["default"].useState(false),
+      _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
+      isEnd = _React$useState6[0],
+      setEnd = _React$useState6[1];
+
+  var _React$useState7 = _react["default"].useState(false),
+      _React$useState8 = (0, _slicedToArray2["default"])(_React$useState7, 2),
+      isLocked = _React$useState8[0],
+      setLocked = _React$useState8[1];
+
   var childrenLen = Array.isArray(children) ? children.length : 0;
   var prevChildrenLen = (0, _usePrevious["default"])(childrenLen) || 0;
   var isChildrenLenDiff = childrenLen !== prevChildrenLen;
@@ -211,94 +174,101 @@ var Carousel = function Carousel(_ref) {
     slidesSettings: slidesSettings,
     isLocked: isLocked
   });
-  var increaseAutoplayDelay = React.useCallback(function (_ref2) {
+
+  var increaseAutoplayDelay = _react["default"].useCallback(function (_ref2) {
     var params = _ref2.params,
-      autoplay = _ref2.autoplay;
+        autoplay = _ref2.autoplay;
+
     if ((0, _typeof2["default"])(params.autoplay) !== 'object' || !autoplay.running) {
       return;
     }
-    autoplay.stop();
-    // eslint-disable-next-line no-param-reassign
+
+    autoplay.stop(); // eslint-disable-next-line no-param-reassign
+
     params.autoplay.delay = autoPlayDelay * 3;
     autoplay.start();
   }, [autoPlayDelay]);
-  var handlePrevClick = React.useCallback(function () {
+
+  var handlePrevClick = _react["default"].useCallback(function () {
     if (!swiperInstance) {
       return;
     }
+
     swiperInstance.slidePrev();
     onPrevClick === null || onPrevClick === void 0 ? void 0 : onPrevClick(swiperInstance.realIndex);
     increaseAutoplayDelay(swiperInstance);
   }, [swiperInstance, onPrevClick, increaseAutoplayDelay]);
-  var handleNextClick = React.useCallback(function () {
+
+  var handleNextClick = _react["default"].useCallback(function () {
     if (!swiperInstance) {
       return;
     }
+
     swiperInstance.slideNext();
     onNextClick === null || onNextClick === void 0 ? void 0 : onNextClick(swiperInstance.realIndex);
     increaseAutoplayDelay(swiperInstance);
   }, [swiperInstance, onNextClick, increaseAutoplayDelay]);
-  var handleSwiper = React.useCallback(function (swiper) {
+
+  var handleSwiper = _react["default"].useCallback(function (swiper) {
     setSwiperInstance(swiper);
     setLocked(swiper.isBeginning && swiper.isEnd);
     getSwiper === null || getSwiper === void 0 ? void 0 : getSwiper(swiper);
   }, [getSwiper]);
-  var handleReachBeginnig = React.useCallback(function () {
+
+  var handleReachBeginnig = _react["default"].useCallback(function () {
     setBeginning(true);
   }, []);
-  var handleReachEnd = React.useCallback(function (_ref3) {
+
+  var handleReachEnd = _react["default"].useCallback(function (_ref3) {
     var params = _ref3.params,
-      autoplay = _ref3.autoplay;
+        autoplay = _ref3.autoplay;
     setEnd(true);
+
     if (!params.loop && autoplay.running) {
       autoplay.stop();
     }
   }, []);
-  var handleFromEdge = React.useCallback(function (swiper) {
+
+  var handleFromEdge = _react["default"].useCallback(function (swiper) {
     setBeginning(swiper.isBeginning);
     setEnd(swiper.isEnd);
   }, []);
-  var handleSlideChange = React.useCallback(function (_ref4) {
+
+  var handleSlideChange = _react["default"].useCallback(function (_ref4) {
     var realIndex = _ref4.realIndex,
-      previousIndex = _ref4.previousIndex,
-      params = _ref4.params;
+        previousIndex = _ref4.previousIndex,
+        params = _ref4.params;
     onChange === null || onChange === void 0 ? void 0 : onChange(realIndex, previousIndex, params.slidesPerView);
   }, [onChange]);
+
   var handleRootClick = function handleRootClick(e) {
     var elem = e.target;
     var isBullet = elem.classList.contains('swiper-pagination-bullet');
+
     if (isBullet && swiperInstance) {
       increaseAutoplayDelay(swiperInstance);
     }
   };
+
   var handleNavDisplay = function handleNavDisplay(swiper) {
     setBeginning(swiper.isBeginning);
     setEnd(swiper.isEnd);
     setLocked(swiper.isBeginning && swiper.isEnd);
-  };
-  // https://github.com/nolimits4web/Swiper/issues/2346
-  var handleSwiperResize = React.useCallback(function () {
+  }; // https://github.com/nolimits4web/Swiper/issues/2346
+
+
+  var handleSwiperResize = _react["default"].useCallback(function () {
     (0, _lodash["default"])(function (swiper) {
       handleNavDisplay(swiper);
-      if (swiper.params.slidesPerView === SlidesPerView.AUTO) {
-        var _iterator = _createForOfIteratorHelper(swiper.slides),
-          _step;
-        try {
-          for (_iterator.s(); !(_step = _iterator.n()).done;) {
-            var slide = _step.value;
-            slide.style.width = '';
-          }
-        } catch (err) {
-          _iterator.e(err);
-        } finally {
-          _iterator.f();
-        }
-      }
+
+      if (swiper.params.slidesPerView === SlidesPerView.AUTO) {}
     }, _throttleTime["default"].resize);
   }, []);
+
   var handleSlideFocus = function handleSlideFocus(index) {
     return function (e) {
       var _a;
+
       if (loop) {
         // for correctly scroll the looped carousel to the focused element, we need to get its real index in the DOM-collection of slides
         // because swiper does not provide this, only data-swiper-slide-index, whose values are in the range from 0 to children.length - 1,
@@ -309,21 +279,26 @@ var Carousel = function Carousel(_ref) {
         swiperInstance === null || swiperInstance === void 0 ? void 0 : swiperInstance.slideTo(realIndex);
         return;
       }
+
       swiperInstance === null || swiperInstance === void 0 ? void 0 : swiperInstance.slideTo(index);
     };
   };
+
   var disableFocusOnSlideClick = function disableFocusOnSlideClick(e) {
     if (e.nativeEvent.target.closest(".".concat(cn()))) {
       e.nativeEvent.preventDefault();
     }
   };
-  React.useEffect(function () {
+
+  _react["default"].useEffect(function () {
     if (!swiperInstance) {
       return undefined;
     }
+
     var windowResizeHandler = function windowResizeHandler() {
       return handleNavDisplay(swiperInstance);
     };
+
     var windowResizeHandlerThrottled = (0, _lodash["default"])(windowResizeHandler, _throttleTime["default"].resize);
     window.addEventListener('resize', windowResizeHandlerThrottled);
     return function () {
@@ -331,19 +306,21 @@ var Carousel = function Carousel(_ref) {
       window.removeEventListener('resize', windowResizeHandlerThrottled);
     };
   }, [slidesSettings, swiperInstance]);
-  React.useEffect(function () {
+
+  _react["default"].useEffect(function () {
     if (swiperInstance && isChildrenLenDiff) {
       handleNavDisplay(swiperInstance);
     }
   }, [isChildrenLenDiff, swiperInstance]);
-  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+
+  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     ref: rootRef,
     className: cn({
       'nav-theme': navTheme
     }, [className, rootClass]),
     onClick: handleRootClick,
     style: gradientStyles
-  }), /*#__PURE__*/React.createElement(_react2.Swiper, (0, _extends2["default"])({}, containerModifier ? {
+  }), /*#__PURE__*/_react["default"].createElement(_react2.Swiper, (0, _extends2["default"])({}, containerModifier ? {
     containerModifierClass: containerModifier
   } : {}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slider), {
     className: cn('swiper', {
@@ -352,9 +329,8 @@ var Carousel = function Carousel(_ref) {
       'gradient-color': gradient && gradientColor
     }, [innerIndentsClass, containerClass]),
     breakpoints: slidesSettings,
-    watchSlidesProgress: true,
+    watchSlidesVisibility: true,
     watchOverflow: true,
-    modules: [_modules.Autoplay, _modules.Pagination, _modules.EffectFade],
     loop: loop,
     pagination: (0, _extends2["default"])({
       clickable: true
@@ -379,14 +355,14 @@ var Carousel = function Carousel(_ref) {
     onSlideChange: handleSlideChange,
     onTouchEnd: increaseAutoplayDelay,
     onResize: handleSwiperResize
-  }), React.Children.map(children, function (child, i) {
-    return /*#__PURE__*/React.createElement(_react2.SwiperSlide, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slide, i + 1), {
+  }), _react["default"].Children.map(children, function (child, i) {
+    return /*#__PURE__*/_react["default"].createElement(_react2.SwiperSlide, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slide, i + 1), {
       key: i,
       className: cn('slide', slideClass),
       onFocus: handleSlideFocus(i),
       onMouseDown: disableFocusOnSlideClick
     }), child);
-  })), /*#__PURE__*/React.createElement(_NavArrow["default"], {
+  })), /*#__PURE__*/_react["default"].createElement(_NavArrow["default"], {
     dataAttrs: {
       root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.prev
     },
@@ -397,7 +373,7 @@ var Carousel = function Carousel(_ref) {
     onClick: handlePrevClick,
     disabled: !loop && isBeginning,
     theme: _NavArrow.Theme.PURPLE
-  }), /*#__PURE__*/React.createElement(_NavArrow["default"], {
+  }), /*#__PURE__*/_react["default"].createElement(_NavArrow["default"], {
     dataAttrs: {
       root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.next
     },
@@ -411,4 +387,59 @@ var Carousel = function Carousel(_ref) {
     theme: _NavArrow.Theme.PURPLE
   }));
 };
-var _default = exports["default"] = Carousel;
+
+Carousel.propTypes = {
+  rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
+    current: PropTypes.elementType
+  }), PropTypes.any])]),
+  className: PropTypes.string,
+  classes: PropTypes.shape({
+    root: PropTypes.string,
+    innerIndents: PropTypes.string,
+    container: PropTypes.string,
+    containerModifier: PropTypes.string,
+    prev: PropTypes.string,
+    next: PropTypes.string,
+    slide: PropTypes.string
+  }),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    slider: PropTypes.objectOf(PropTypes.string.isRequired),
+    prev: PropTypes.objectOf(PropTypes.string.isRequired),
+    next: PropTypes.objectOf(PropTypes.string.isRequired),
+    slide: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
+  slidesSettings: PropTypes.objectOf((0, _checkBreakpointsPropTypes["default"])({
+    slidesPerView: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf(Object.values(SlidesPerView))]).isRequired,
+    spaceBetween: PropTypes.number.isRequired,
+    slidesPerGroup: PropTypes.number
+  })),
+  pagination: PropTypes.shape({
+    el: PropTypes.string,
+    bulletElement: PropTypes.string,
+    dynamicBullets: PropTypes.string,
+    clickable: PropTypes.bool,
+    renderBullet: PropTypes.func,
+    bulletClass: PropTypes.string,
+    bulletActiveClass: PropTypes.string,
+    modifierClass: PropTypes.string
+  }),
+  loop: PropTypes.bool,
+  threshold: PropTypes.number,
+  autoPlay: PropTypes.bool,
+  autoPlayDelay: PropTypes.number,
+  disableTouchMove: PropTypes.bool,
+  centeredSlides: PropTypes.bool,
+  transitionSpeed: PropTypes.number,
+  navTheme: PropTypes.oneOf(Object.values(NavTheme)),
+  effectTheme: PropTypes.oneOf(Object.values(EffectTheme)),
+  noSwipingSelector: PropTypes.string,
+  getSwiper: PropTypes.func,
+  onNextClick: PropTypes.func,
+  onPrevClick: PropTypes.func,
+  onChange: PropTypes.func,
+  gradient: PropTypes.oneOfType([PropTypes.bool]),
+  gradientColor: PropTypes.oneOf(Object.values(GradientTheme))
+};
+var _default = Carousel;
+exports["default"] = _default;

package/dist/lib/components/Carousel/checkBreakpointsPropTypes.d.ts

@@ -1,4 +1,4 @@
-type ObjectType = {
+declare type ObjectType = {
     [key: string]: unknown;
 };
 declare const checkBreakpointsPropTypes: (settingsPropTypes: ObjectType) => (object: ObjectType, key: string, componentName: string) => Error | null;

package/dist/lib/components/Carousel/checkBreakpointsPropTypes.js

@@ -1,24 +1,36 @@
 "use strict";
 
-function _typeof3(o) { "@babel/helpers - typeof"; return _typeof3 = "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; }, _typeof3(o); }
+function _typeof3(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof3 = function _typeof3(obj) { return typeof obj; }; } else { _typeof3 = function _typeof3(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof3(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-require("core-js/modules/es.array.concat.js");
+
 require("core-js/modules/es.number.constructor.js");
+
+require("core-js/modules/es.array.concat.js");
+
 var PropTypes = _interopRequireWildcard(require("prop-types"));
-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" != _typeof3(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 && Object.prototype.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 _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
 var checkBreakpointsPropTypes = function checkBreakpointsPropTypes(settingsPropTypes) {
   return function (object, key, componentName) {
     if (!object[Number(key)]) {
       return new Error("Invalid key name 'breakpoints.".concat(key, "' of type ").concat((0, _typeof2["default"])(key), " supplied to ").concat(componentName, ", expected number"));
     }
+
     PropTypes.checkPropTypes(settingsPropTypes, object[key], 'prop', componentName);
     return null;
   };
 };
-var _default = exports["default"] = checkBreakpointsPropTypes;
+
+var _default = checkBreakpointsPropTypes;
+exports["default"] = _default;