dots.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.Dots = void 0;
  7. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  8. var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
  9. var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
  10. var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
  11. var _isNativeReflectConstruct2 = _interopRequireDefault(require("@babel/runtime/helpers/isNativeReflectConstruct"));
  12. var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
  13. var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
  14. var _react = _interopRequireDefault(require("react"));
  15. var _classnames = _interopRequireDefault(require("classnames"));
  16. var _innerSliderUtils = require("./utils/innerSliderUtils");
  17. function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, (0, _isNativeReflectConstruct2["default"])() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
  18. var getDotCount = function getDotCount(spec) {
  19. var dots;
  20. if (spec.infinite) {
  21. dots = Math.ceil(spec.slideCount / spec.slidesToScroll);
  22. } else {
  23. dots = Math.ceil((spec.slideCount - spec.slidesToShow) / spec.slidesToScroll) + 1;
  24. }
  25. return dots;
  26. };
  27. var Dots = exports.Dots = /*#__PURE__*/function (_React$PureComponent) {
  28. function Dots() {
  29. (0, _classCallCheck2["default"])(this, Dots);
  30. return _callSuper(this, Dots, arguments);
  31. }
  32. (0, _inherits2["default"])(Dots, _React$PureComponent);
  33. return (0, _createClass2["default"])(Dots, [{
  34. key: "clickHandler",
  35. value: function clickHandler(options, e) {
  36. // In Autoplay the focus stays on clicked button even after transition
  37. // to next slide. That only goes away by click somewhere outside
  38. e.preventDefault();
  39. this.props.clickHandler(options);
  40. }
  41. }, {
  42. key: "render",
  43. value: function render() {
  44. var _this$props = this.props,
  45. onMouseEnter = _this$props.onMouseEnter,
  46. onMouseOver = _this$props.onMouseOver,
  47. onMouseLeave = _this$props.onMouseLeave,
  48. infinite = _this$props.infinite,
  49. slidesToScroll = _this$props.slidesToScroll,
  50. slidesToShow = _this$props.slidesToShow,
  51. slideCount = _this$props.slideCount,
  52. currentSlide = _this$props.currentSlide;
  53. var dotCount = getDotCount({
  54. slideCount: slideCount,
  55. slidesToScroll: slidesToScroll,
  56. slidesToShow: slidesToShow,
  57. infinite: infinite
  58. });
  59. var mouseEvents = {
  60. onMouseEnter: onMouseEnter,
  61. onMouseOver: onMouseOver,
  62. onMouseLeave: onMouseLeave
  63. };
  64. var dots = [];
  65. for (var i = 0; i < dotCount; i++) {
  66. var _rightBound = (i + 1) * slidesToScroll - 1;
  67. var rightBound = infinite ? _rightBound : (0, _innerSliderUtils.clamp)(_rightBound, 0, slideCount - 1);
  68. var _leftBound = rightBound - (slidesToScroll - 1);
  69. var leftBound = infinite ? _leftBound : (0, _innerSliderUtils.clamp)(_leftBound, 0, slideCount - 1);
  70. var className = (0, _classnames["default"])({
  71. "slick-active": infinite ? currentSlide >= leftBound && currentSlide <= rightBound : currentSlide === leftBound
  72. });
  73. var dotOptions = {
  74. message: "dots",
  75. index: i,
  76. slidesToScroll: slidesToScroll,
  77. currentSlide: currentSlide
  78. };
  79. var onClick = this.clickHandler.bind(this, dotOptions);
  80. dots = dots.concat( /*#__PURE__*/_react["default"].createElement("li", {
  81. key: i,
  82. className: className
  83. }, /*#__PURE__*/_react["default"].cloneElement(this.props.customPaging(i), {
  84. onClick: onClick
  85. })));
  86. }
  87. return /*#__PURE__*/_react["default"].cloneElement(this.props.appendDots(dots), (0, _objectSpread2["default"])({
  88. className: this.props.dotsClass
  89. }, mouseEvents));
  90. }
  91. }]);
  92. }(_react["default"].PureComponent);