"use strict"; import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2"; import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck"; import _createClass from "@babel/runtime/helpers/esm/createClass"; import _inherits from "@babel/runtime/helpers/esm/inherits"; import _createSuper from "@babel/runtime/helpers/esm/createSuper"; import React from "react"; import classnames from "classnames"; import { clamp } from "./utils/innerSliderUtils"; var getDotCount = function getDotCount(spec) { var dots; if (spec.infinite) { dots = Math.ceil(spec.slideCount / spec.slidesToScroll); } else { dots = Math.ceil((spec.slideCount - spec.slidesToShow) / spec.slidesToScroll) + 1; } return dots; }; export var Dots = /*#__PURE__*/function (_React$PureComponent) { _inherits(Dots, _React$PureComponent); var _super = _createSuper(Dots); function Dots() { _classCallCheck(this, Dots); return _super.apply(this, arguments); } _createClass(Dots, [{ key: "clickHandler", value: function clickHandler(options, e) { // In Autoplay the focus stays on clicked button even after transition // to next slide. That only goes away by click somewhere outside e.preventDefault(); this.props.clickHandler(options); } }, { key: "render", value: function render() { var _this$props = this.props, onMouseEnter = _this$props.onMouseEnter, onMouseOver = _this$props.onMouseOver, onMouseLeave = _this$props.onMouseLeave, infinite = _this$props.infinite, slidesToScroll = _this$props.slidesToScroll, slidesToShow = _this$props.slidesToShow, slideCount = _this$props.slideCount, currentSlide = _this$props.currentSlide; var dotCount = getDotCount({ slideCount: slideCount, slidesToScroll: slidesToScroll, slidesToShow: slidesToShow, infinite: infinite }); var mouseEvents = { onMouseEnter: onMouseEnter, onMouseOver: onMouseOver, onMouseLeave: onMouseLeave }; var dots = []; for (var i = 0; i < dotCount; i++) { var _rightBound = (i + 1) * slidesToScroll - 1; var rightBound = infinite ? _rightBound : clamp(_rightBound, 0, slideCount - 1); var _leftBound = rightBound - (slidesToScroll - 1); var leftBound = infinite ? _leftBound : clamp(_leftBound, 0, slideCount - 1); var className = classnames({ "slick-active": infinite ? currentSlide >= leftBound && currentSlide <= rightBound : currentSlide === leftBound }); var dotOptions = { message: "dots", index: i, slidesToScroll: slidesToScroll, currentSlide: currentSlide }; var onClick = this.clickHandler.bind(this, dotOptions); dots = dots.concat( /*#__PURE__*/React.createElement("li", { key: i, className: className }, /*#__PURE__*/React.cloneElement(this.props.customPaging(i), { onClick: onClick }))); } return /*#__PURE__*/React.cloneElement(this.props.appendDots(dots), _objectSpread({ className: this.props.dotsClass }, mouseEvents)); } }]); return Dots; }(React.PureComponent);