import _extends from "@babel/runtime/helpers/esm/extends";
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _JSXStyle from "../styled-jsx.es.js";
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
import React, { Children } from 'react';
// @ts-ignore
import Swipe from '../swipe';
import klass from './cssClasses';
import Thumbs from './Thumbs';
import getDocument from './shims/document';
import getWindow from './shims/window';
import { noop, defaultStatusFormatter, isKeyboardEvent } from './utils';
import Arrow from './Arrow';
import Indicator from './Indicator';
import { slideAnimationHandler, slideSwipeAnimationHandler, slideStopSwipingHandler, fadeAnimationHandler } from './animations';
var Carousel = /*#__PURE__*/function (_React$Component) {
  function Carousel(props) {
    var _this;
    _classCallCheck(this, Carousel);
    _this = _callSuper(this, Carousel, [props]);
    _defineProperty(_this, "setThumbsRef", function (node) {
      _this.thumbsRef = node;
    });
    _defineProperty(_this, "setCarouselWrapperRef", function (node) {
      _this.carouselWrapperRef = node;
    });
    _defineProperty(_this, "setListRef", function (node) {
      _this.listRef = node;
    });
    _defineProperty(_this, "setItemsRef", function (node, index) {
      if (!_this.itemsRef) {
        _this.itemsRef = [];
      }
      _this.itemsRef[index] = node;
    });
    _defineProperty(_this, "autoPlay", function () {
      if (Children.count(_this.props.children) <= 1) {
        return;
      }
      _this.clearAutoPlay();
      if (!_this.props.autoPlay) {
        return;
      }
      _this.timer = setTimeout(function () {
        _this.increment();
      }, _this.props.interval);
    });
    _defineProperty(_this, "clearAutoPlay", function () {
      if (_this.timer) clearTimeout(_this.timer);
    });
    _defineProperty(_this, "resetAutoPlay", function () {
      _this.clearAutoPlay();
      _this.autoPlay();
    });
    _defineProperty(_this, "stopOnHover", function () {
      _this.setState({
        isMouseEntered: true
      }, _this.clearAutoPlay);
    });
    _defineProperty(_this, "startOnLeave", function () {
      _this.setState({
        isMouseEntered: false
      }, _this.autoPlay);
    });
    _defineProperty(_this, "isFocusWithinTheCarousel", function () {
      if (!_this.carouselWrapperRef) {
        return false;
      }
      if (getDocument().activeElement === _this.carouselWrapperRef || _this.carouselWrapperRef.contains(getDocument().activeElement)) {
        return true;
      }
      return false;
    });
    _defineProperty(_this, "navigateWithKeyboard", function (e) {
      if (!_this.isFocusWithinTheCarousel()) {
        return;
      }
      var axis = _this.props.axis;
      var isHorizontal = axis === 'horizontal';
      var keyNames = {
        ArrowUp: 38,
        ArrowRight: 39,
        ArrowDown: 40,
        ArrowLeft: 37
      };
      var nextKey = isHorizontal ? keyNames.ArrowRight : keyNames.ArrowDown;
      var prevKey = isHorizontal ? keyNames.ArrowLeft : keyNames.ArrowUp;
      if (nextKey === e.keyCode) {
        _this.increment();
      } else if (prevKey === e.keyCode) {
        _this.decrement();
      }
    });
    _defineProperty(_this, "updateSizes", function () {
      if (!_this.state.initialized || !_this.itemsRef || _this.itemsRef.length === 0) {
        return;
      }
      var isHorizontal = _this.props.axis === 'horizontal';
      var firstItem = _this.itemsRef[0];
      if (!firstItem) {
        return;
      }
      var itemSize = isHorizontal ? firstItem.clientWidth : firstItem.clientHeight;
      _this.setState({
        itemSize: itemSize
      });
      if (_this.thumbsRef) {
        _this.thumbsRef.updateSizes();
      }
    });
    _defineProperty(_this, "setMountState", function () {
      _this.setState({
        hasMount: true
      });
      _this.updateSizes();
    });
    _defineProperty(_this, "handleClickItem", function (index, item) {
      if (Children.count(_this.props.children) === 0) {
        return;
      }
      if (_this.state.cancelClick) {
        _this.setState({
          cancelClick: false
        });
        return;
      }
      _this.props.onClickItem(index, item);
      if (index !== _this.state.selectedItem) {
        _this.setState({
          selectedItem: index
        });
      }
    });
    /**
     * On Change handler, Passes the index and React node to the supplied onChange prop
     * @param index of the carousel item
     * @param item React node of the item being changed
     */
    _defineProperty(_this, "handleOnChange", function (index, item) {
      if (Children.count(_this.props.children) <= 1) {
        return;
      }
      _this.props.onChange(index, item);
    });
    _defineProperty(_this, "handleClickThumb", function (index, item) {
      _this.props.onClickThumb(index, item);
      _this.moveTo(index);
    });
    _defineProperty(_this, "onSwipeStart", function (event) {
      _this.setState({
        swiping: true
      });
      _this.props.onSwipeStart(event);
    });
    _defineProperty(_this, "onSwipeEnd", function (event) {
      _this.setState({
        swiping: false,
        cancelClick: false,
        swipeMovementStarted: false
      });
      _this.props.onSwipeEnd(event);
      _this.clearAutoPlay();
      if (_this.state.autoPlay) {
        _this.autoPlay();
      }
    });
    _defineProperty(_this, "onSwipeMove", function (delta, event) {
      _this.props.onSwipeMove(event);
      var animationHandlerResponse = _this.props.swipeAnimationHandler(delta, _this.props, _this.state, _this.setState.bind(_this));
      _this.setState(_extends({}, animationHandlerResponse));

      // If we have not moved, we should have an empty object returned
      // Return false to allow scrolling when not swiping
      return !!Object.keys(animationHandlerResponse).length;
    });
    /**
     * Decrements the selectedItem index a number of positions through the children list
     * @param positions
     * @param fromSwipe
     */
    _defineProperty(_this, "decrement", function () {
      var positions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
      _this.moveTo(_this.state.selectedItem - (typeof positions === 'number' ? positions : 1));
    });
    /**
     * Increments the selectedItem index a number of positions through the children list
     * @param positions
     * @param fromSwipe
     */
    _defineProperty(_this, "increment", function () {
      var positions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
      _this.moveTo(_this.state.selectedItem + (typeof positions === 'number' ? positions : 1));
    });
    /**
     * Moves the selected item to the position provided
     * @param position
     * @param fromSwipe
     */
    _defineProperty(_this, "moveTo", function (position) {
      if (typeof position !== 'number') {
        return;
      }
      var lastPosition = Children.count(_this.props.children) - 1;
      if (position < 0) {
        position = _this.props.infiniteLoop ? lastPosition : 0;
      }
      if (position > lastPosition) {
        position = _this.props.infiniteLoop ? 0 : lastPosition;
      }
      _this.selectItem({
        // if it's not a slider, we don't need to set position here
        selectedItem: position
      });

      // don't reset auto play when stop on hover is enabled, doing so will trigger a call to auto play more than once
      // and will result in the interval function not being cleared correctly.
      if (_this.state.autoPlay && _this.state.isMouseEntered === false) {
        _this.resetAutoPlay();
      }
    });
    _defineProperty(_this, "onClickNext", function () {
      _this.increment(1);
    });
    _defineProperty(_this, "onClickPrev", function () {
      _this.decrement(1);
    });
    _defineProperty(_this, "onSwipeForward", function () {
      _this.increment(1);
      if (_this.props.emulateTouch) {
        _this.setState({
          cancelClick: true
        });
      }
    });
    _defineProperty(_this, "onSwipeBackwards", function () {
      _this.decrement(1);
      if (_this.props.emulateTouch) {
        _this.setState({
          cancelClick: true
        });
      }
    });
    _defineProperty(_this, "changeItem", function (newIndex) {
      return function (e) {
        if (!isKeyboardEvent(e) || e.key === 'Enter') {
          _this.moveTo(newIndex);
        }
      };
    });
    /**
     * This function is called when you want to 'select' a new item, or rather move to a 'selected' item
     * It also handles the onChange callback wrapper
     * @param state state object with updated selected item, and swiping bool if relevant
     */
    _defineProperty(_this, "selectItem", function (state) {
      // Merge in the new state while updating updating previous item
      _this.setState(_extends({
        previousItem: _this.state.selectedItem
      }, state), function () {
        // Run animation handler and update styles based on it
        _this.setState(_this.animationHandler(_this.props, _this.state));
      });
      _this.handleOnChange(state.selectedItem, Children.toArray(_this.props.children)[state.selectedItem]);
    });
    _defineProperty(_this, "getInitialImage", function () {
      var selectedItem = _this.props.selectedItem;
      var item = _this.itemsRef && _this.itemsRef[selectedItem];
      var images = item && item.getElementsByTagName('img') || [];
      return images[0];
    });
    _defineProperty(_this, "getVariableItemHeight", function (position) {
      var item = _this.itemsRef && _this.itemsRef[position];
      if (_this.state.hasMount && item && item.children.length) {
        var slideImages = item.children[0].getElementsByTagName('img') || [];
        if (slideImages.length > 0) {
          var image = slideImages[0];
          if (!image.complete) {
            // if the image is still loading, the size won't be available so we trigger a new render after it's done
            var _onImageLoad = function onImageLoad() {
              _this.forceUpdate();
              image.removeEventListener('load', _onImageLoad);
            };
            image.addEventListener('load', _onImageLoad);
          }
        }

        // try to get img first, if img not there find first display tag
        var displayItem = slideImages[0] || item.children[0];
        var height = displayItem.clientHeight;
        return height > 0 ? height : null;
      }
      return null;
    });
    var initState = {
      initialized: false,
      previousItem: props.selectedItem,
      selectedItem: props.selectedItem,
      hasMount: false,
      isMouseEntered: false,
      autoPlay: props.autoPlay,
      swiping: false,
      swipeMovementStarted: false,
      cancelClick: false,
      itemSize: 1,
      itemListStyle: {},
      slideStyle: {},
      selectedStyle: {},
      prevStyle: {},
      indicator: 'dot'
    };
    _this.animationHandler = typeof props.animationHandler === 'function' && props.animationHandler || props.animationHandler === 'fade' && fadeAnimationHandler || slideAnimationHandler;
    _this.state = _extends({}, initState, _this.animationHandler(props, initState));
    return _this;
  }
  _inherits(Carousel, _React$Component);
  return _createClass(Carousel, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      if (!this.props.children) {
        return;
      }
      this.setupCarousel();
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate(prevProps, prevState) {
      if (!prevProps.children && this.props.children && !this.state.initialized) {
        this.setupCarousel();
      }
      if (!prevProps.autoFocus && this.props.autoFocus) {
        this.forceFocus();
      }
      if (prevState.swiping && !this.state.swiping) {
        // We stopped swiping, ensure we are heading to the new/current slide and not stuck

        this.setState(_extends({}, this.props.stopSwipingHandler(this.props, this.state)));
      }
      if (prevProps.selectedItem !== this.props.selectedItem || prevProps.centerMode !== this.props.centerMode) {
        this.updateSizes();
        this.moveTo(this.props.selectedItem);
      }
      if (prevProps.autoPlay !== this.props.autoPlay) {
        if (this.props.autoPlay) {
          this.setupAutoPlay();
        } else {
          this.destroyAutoPlay();
        }
        this.setState({
          autoPlay: this.props.autoPlay
        });
      }
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      this.destroyCarousel();
    }
  }, {
    key: "setupCarousel",
    value: function setupCarousel() {
      var _this2 = this;
      this.bindEvents();
      if (this.state.autoPlay && Children.count(this.props.children) > 1) {
        this.setupAutoPlay();
      }
      if (this.props.autoFocus) {
        this.forceFocus();
      }
      this.setState({
        initialized: true
      }, function () {
        var initialImage = _this2.getInitialImage();
        if (initialImage && !initialImage.complete) {
          // if it's a carousel of images, we set the mount state after the first image is loaded
          initialImage.addEventListener('load', _this2.setMountState);
        } else {
          _this2.setMountState();
        }
      });
    }
  }, {
    key: "destroyCarousel",
    value: function destroyCarousel() {
      if (this.state.initialized) {
        this.unbindEvents();
        this.destroyAutoPlay();
      }
    }
  }, {
    key: "setupAutoPlay",
    value: function setupAutoPlay() {
      this.autoPlay();
      var carouselWrapper = this.carouselWrapperRef;
      if (this.props.stopOnHover && carouselWrapper) {
        carouselWrapper.addEventListener('mouseenter', this.stopOnHover);
        carouselWrapper.addEventListener('mouseleave', this.startOnLeave);
      }
    }
  }, {
    key: "destroyAutoPlay",
    value: function destroyAutoPlay() {
      this.clearAutoPlay();
      var carouselWrapper = this.carouselWrapperRef;
      if (this.props.stopOnHover && carouselWrapper) {
        carouselWrapper.removeEventListener('mouseenter', this.stopOnHover);
        carouselWrapper.removeEventListener('mouseleave', this.startOnLeave);
      }
    }
  }, {
    key: "bindEvents",
    value: function bindEvents() {
      // as the widths are calculated, we need to resize
      // the carousel when the window is resized
      getWindow().addEventListener('resize', this.updateSizes);
      // issue #2 - image loading smaller
      getWindow().addEventListener('DOMContentLoaded', this.updateSizes);
      if (this.props.useKeyboardArrows) {
        getDocument().addEventListener('keydown', this.navigateWithKeyboard);
      }
    }
  }, {
    key: "unbindEvents",
    value: function unbindEvents() {
      // removing listeners
      getWindow().removeEventListener('resize', this.updateSizes);
      getWindow().removeEventListener('DOMContentLoaded', this.updateSizes);
      var initialImage = this.getInitialImage();
      if (initialImage) {
        initialImage.removeEventListener('load', this.setMountState);
      }
      if (this.props.useKeyboardArrows) {
        getDocument().removeEventListener('keydown', this.navigateWithKeyboard);
      }
    }
  }, {
    key: "forceFocus",
    value: function forceFocus() {
      var _this$carouselWrapper;
      (_this$carouselWrapper = this.carouselWrapperRef) === null || _this$carouselWrapper === void 0 || _this$carouselWrapper.focus();
    }
  }, {
    key: "renderItems",
    value: function renderItems(isClone) {
      var _this3 = this;
      if (!this.props.children) {
        return [];
      }
      return Children.map(this.props.children, function (item, index) {
        var isSelected = index === _this3.state.selectedItem;
        var isPrevious = index === _this3.state.previousItem;
        var style = isSelected && _this3.state.selectedStyle || isPrevious && _this3.state.prevStyle || _this3.state.slideStyle || {};
        if (_this3.props.centerMode && _this3.props.axis === 'horizontal') {
          style = _extends({}, style, {
            minWidth: _this3.props.centerSlidePercentage + '%'
          });
        }
        if (_this3.state.swiping && _this3.state.swipeMovementStarted) {
          style = _extends({}, style, {
            pointerEvents: 'none'
          });
        }
        var slideProps = {
          ref: function ref(e) {
            return _this3.setItemsRef(e, index);
          },
          key: 'itemKey' + index + (isClone ? 'clone' : ''),
          className: klass.ITEM(true, index === _this3.state.selectedItem, index === _this3.state.previousItem),
          onClick: _this3.handleClickItem.bind(_this3, index, item),
          style: style
        };
        return /*#__PURE__*/React.createElement("li", _extends({}, slideProps, {
          className: "jsx-4120978495" + " " + (slideProps && slideProps.className != null && slideProps.className || "")
        }), _this3.props.renderItem(item, {
          isSelected: index === _this3.state.selectedItem,
          isPrevious: index === _this3.state.previousItem
        }), /*#__PURE__*/React.createElement(_JSXStyle, {
          id: "4120978495"
        }, ".slide.jsx-4120978495{min-width:100%;margin:0;position:relative;text-align:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}img.jsx-4120978495{width:100%;vertical-align:top;border:0;}iframe.jsx-4120978495{display:inline-block;width:calc(100% - 80px);margin:0 40px 40px;border:0;}.legend.jsx-4120978495{-webkit-transition:opacity 0.35s ease-in-out;transition:opacity 0.35s ease-in-out;position:absolute;bottom:40px;left:50%;margin-left:-45%;width:90%;border-radius:10px;background:#000;color:#fff;padding:10px;font-size:12px;text-align:center;opacity:0.25;}.slide.jsx-4120978495 .legend.jsx-4120978495{opacity:1;}"));
      });
    }
  }, {
    key: "renderControls",
    value: function renderControls() {
      var _this4 = this;
      var _this$props = this.props,
        showIndicators = _this$props.showIndicators,
        labels = _this$props.labels,
        renderIndicator = _this$props.renderIndicator,
        children = _this$props.children,
        indicator = _this$props.indicator;
      if (!showIndicators) {
        return null;
      }
      return /*#__PURE__*/React.createElement("ul", {
        className: "jsx-4140983776" + " " + "control-dots"
      }, Children.map(children, function (_, index) {
        return renderIndicator && renderIndicator(_this4.changeItem(index), index === _this4.state.selectedItem, index, labels.item, indicator);
      }), /*#__PURE__*/React.createElement(_JSXStyle, {
        id: "4140983776"
      }, ".control-dots.jsx-4140983776{position:absolute;bottom:0;margin:10px 0;padding:0;text-align:center;width:100%;z-index:1;}"));
    }
  }, {
    key: "renderStatus",
    value: function renderStatus() {
      if (!this.props.showStatus) {
        return null;
      }
      return /*#__PURE__*/React.createElement("p", {
        className: "jsx-2959489890" + " " + "carousel-status"
      }, this.props.statusFormatter(this.state.selectedItem + 1, Children.count(this.props.children)), /*#__PURE__*/React.createElement(_JSXStyle, {
        id: "2959489890"
      }, ".carousel-status.jsx-2959489890{position:absolute;top:0;right:0;padding:5px;font-size:10px;text-shadow:1px 1px 1px rgba(0,0,0,0.9);color:#fff;}"));
    }
  }, {
    key: "renderThumbs",
    value: function renderThumbs() {
      if (!this.props.showThumbs || !this.props.children || Children.count(this.props.children) === 0) {
        return null;
      }
      return /*#__PURE__*/React.createElement(Thumbs, {
        ref: this.setThumbsRef,
        onSelectItem: this.handleClickThumb,
        selectedItem: this.state.selectedItem,
        transitionTime: this.props.transitionTime,
        thumbWidth: this.props.thumbWidth,
        labels: this.props.labels,
        emulateTouch: this.props.emulateTouch
      }, this.props.renderThumbs(this.props.children));
    }
  }, {
    key: "render",
    value: function render() {
      var _this5 = this;
      if (!this.props.children || Children.count(this.props.children) === 0) {
        return null;
      }
      var isSwipeable = this.props.swipeable && Children.count(this.props.children) > 1;
      var isHorizontal = this.props.axis === 'horizontal';
      var canShowArrows = this.props.showArrows && Children.count(this.props.children) > 1;

      // show left arrow?
      var hasPrev = canShowArrows && (this.state.selectedItem > 0 || this.props.infiniteLoop) || false;
      // show right arrow
      var hasNext = canShowArrows && (this.state.selectedItem < Children.count(this.props.children) - 1 || this.props.infiniteLoop) || false;
      var itemsClone = this.renderItems(true);
      var firstClone = itemsClone.shift(); // added not null
      var lastClone = itemsClone.pop(); // added not null

      var swiperProps = {
        className: klass.SLIDER(true, this.state.swiping),
        onSwipeMove: this.onSwipeMove,
        onSwipeStart: this.onSwipeStart,
        onSwipeEnd: this.onSwipeEnd,
        style: _extends({
          margin: 0,
          display: this.props.axis === 'horizontal' ? 'flex' : 'unset',
          flexDirection: this.props.axis === 'horizontal' ? 'row' : 'column'
        }, this.state.itemListStyle),
        tolerance: this.props.swipeScrollTolerance
      };
      var containerStyles = {};
      if (isHorizontal) {
        swiperProps.onSwipeLeft = this.onSwipeForward;
        swiperProps.onSwipeRight = this.onSwipeBackwards;
        if (this.props.dynamicHeight) {
          var itemHeight = this.getVariableItemHeight(this.state.selectedItem);
          // swiperProps.style.height = itemHeight || 'auto';
          containerStyles.height = itemHeight || 'auto';
        }
      } else {
        swiperProps.onSwipeUp = this.props.verticalSwipe === 'natural' ? this.onSwipeBackwards : this.onSwipeForward;
        swiperProps.onSwipeDown = this.props.verticalSwipe === 'natural' ? this.onSwipeForward : this.onSwipeBackwards;
        swiperProps.style = _extends({}, swiperProps.style, {
          height: this.state.itemSize
        });
        containerStyles.height = this.state.itemSize;
      }
      return /*#__PURE__*/React.createElement("div", {
        "aria-label": this.props.ariaLabel,
        ref: this.setCarouselWrapperRef,
        tabIndex: this.props.useKeyboardArrows ? 0 : undefined,
        className: "jsx-535322850" + " " + (klass.ROOT(this.props.className) || "")
      }, /*#__PURE__*/React.createElement("div", {
        style: {
          width: this.props.width
        },
        className: "jsx-535322850" + " " + (klass.CAROUSEL(true) || "")
      }, this.renderControls(), this.props.renderArrowPrev(this.onClickPrev, hasPrev, this.props.labels.leftArrow), /*#__PURE__*/React.createElement("div", {
        style: containerStyles,
        className: "jsx-535322850" + " " + (klass.WRAPPER(true, this.props.axis) || "")
      }, isSwipeable ? /*#__PURE__*/React.createElement(Swipe, _extends({
        tagName: "ul",
        innerRef: this.setListRef
      }, swiperProps, {
        allowMouseEvents: this.props.emulateTouch
      }), this.props.infiniteLoop && lastClone, this.renderItems(), this.props.infiniteLoop && firstClone) : /*#__PURE__*/React.createElement("ul", {
        ref: function ref(node) {
          return _this5.setListRef(node);
        },
        style: this.state.itemListStyle || {},
        className: "jsx-535322850" + " " + (klass.SLIDER(true, this.state.swiping) || "")
      }, this.props.infiniteLoop && lastClone, this.renderItems(), this.props.infiniteLoop && firstClone)), this.props.renderArrowNext(this.onClickNext, hasNext, this.props.labels.rightArrow), this.renderStatus()), this.renderThumbs(), /*#__PURE__*/React.createElement(_JSXStyle, {
        id: "535322850"
      }, ".carousel-root.jsx-535322850{outline:none;}.slider.jsx-535322850{margin:0 !important;padding:0;position:relative;list-style:none;width:100%;}.slider.jsx-535322850 .animated.jsx-535322850{-webkit-transition:all 0.35s ease-in-out;transition:all 0.35s ease-in-out;}.carousel.jsx-535322850{position:relative;width:100%;}.carousel.jsx-535322850 img.jsx-535322850{width:100%;display:inline-block;pointer-events:none;}.carousel.jsx-535322850 .carousel.jsx-535322850{position:relative;}.carousel-slider.jsx-535322850{position:relative;margin:0;overflow:hidden;}.slider-wrapper.jsx-535322850{overflow:hidden;margin:auto;width:100%;-webkit-transition:height 0.15s ease-in;transition:height 0.15s ease-in;}"));
    }
  }]);
}(React.Component);
// @ts-ignore
_defineProperty(Carousel, "displayName", 'Carousel');
_defineProperty(Carousel, "defaultProps", {
  ariaLabel: undefined,
  axis: 'horizontal',
  centerSlidePercentage: 80,
  interval: 3000,
  labels: {
    leftArrow: 'previous slide / item',
    rightArrow: 'next slide / item',
    item: 'slide item'
  },
  onClickItem: noop,
  onClickThumb: noop,
  onChange: noop,
  onSwipeStart: function onSwipeStart() {},
  onSwipeEnd: function onSwipeEnd() {},
  onSwipeMove: function onSwipeMove() {
    return false;
  },
  preventMovementUntilSwipeScrollTolerance: false,
  renderArrowPrev: function renderArrowPrev(onClickHandler, hasPrev, label) {
    return /*#__PURE__*/React.createElement(Arrow, {
      direction: "prev",
      onClickHandler: onClickHandler,
      enabled: hasPrev,
      label: label
    });
  },
  renderArrowNext: function renderArrowNext(onClickHandler, hasNext, label) {
    return /*#__PURE__*/React.createElement(Arrow, {
      direction: "next",
      onClickHandler: onClickHandler,
      enabled: hasNext,
      label: label
    });
  },
  renderIndicator: function renderIndicator(onClickHandler, isSelected, index, label, type) {
    return /*#__PURE__*/React.createElement(Indicator, {
      type: type,
      onClickHandler: onClickHandler,
      isSelected: isSelected,
      index: index,
      label: label
    });
  },
  renderItem: function renderItem(item) {
    return item;
  },
  renderThumbs: function renderThumbs(children) {
    var images = Children.map(children, function (item) {
      var _item = item;
      if (! /*#__PURE__*/React.isValidElement(_item)) return undefined;

      // Directly an <img> element
      if (_item.type === 'img') {
        return item;
      }

      // If not <img>, search its children
      var childArray = Children.toArray(_item.props.children);
      var foundImg = childArray.find(function (child) {
        return /*#__PURE__*/React.isValidElement(child) && child.type === 'img';
      });
      return foundImg !== null && foundImg !== void 0 ? foundImg : undefined;
    });
    if ((images === null || images === void 0 ? void 0 : images.filter(function (image) {
      return image;
    }).length) === 0) {
      console.warn("No images found! Can't build the thumb list without images. If you don't need thumbs, set showThumbs={false} in the Carousel. Note that it's not possible to get images rendered inside custom components. More info at https://github.com/leandrowd/react-responsive-carousel/blob/master/TROUBLESHOOTING.md");
      return [];
    }
    return images !== null && images !== void 0 ? images : [];
  },
  statusFormatter: defaultStatusFormatter,
  selectedItem: 0,
  showArrows: true,
  showIndicators: true,
  showStatus: true,
  showThumbs: true,
  stopOnHover: true,
  swipeScrollTolerance: 5,
  swipeable: true,
  transitionTime: 350,
  verticalSwipe: 'standard',
  width: '100%',
  indicator: 'dot',
  animationHandler: 'slide',
  swipeAnimationHandler: slideSwipeAnimationHandler,
  stopSwipingHandler: slideStopSwipingHandler
});
export { Carousel as default };