"use strict"; 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 _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized"; import _inherits from "@babel/runtime/helpers/esm/inherits"; import _createSuper from "@babel/runtime/helpers/esm/createSuper"; import _defineProperty from "@babel/runtime/helpers/esm/defineProperty"; import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2"; import React from "react"; import classnames from "classnames"; import { lazyStartIndex, lazyEndIndex, getPreClones } from "./utils/innerSliderUtils"; // given specifications/props for a slide, fetch all the classes that need to be applied to the slide var getSlideClasses = function getSlideClasses(spec) { var slickActive, slickCenter, slickCloned; var centerOffset, index; if (spec.rtl) { index = spec.slideCount - 1 - spec.index; } else { index = spec.index; } slickCloned = index < 0 || index >= spec.slideCount; if (spec.centerMode) { centerOffset = Math.floor(spec.slidesToShow / 2); slickCenter = (index - spec.currentSlide) % spec.slideCount === 0; if (index > spec.currentSlide - centerOffset - 1 && index <= spec.currentSlide + centerOffset) { slickActive = true; } } else { slickActive = spec.currentSlide <= index && index < spec.currentSlide + spec.slidesToShow; } var focusedSlide; if (spec.targetSlide < 0) { focusedSlide = spec.targetSlide + spec.slideCount; } else if (spec.targetSlide >= spec.slideCount) { focusedSlide = spec.targetSlide - spec.slideCount; } else { focusedSlide = spec.targetSlide; } var slickCurrent = index === focusedSlide; return { "slick-slide": true, "slick-active": slickActive, "slick-center": slickCenter, "slick-cloned": slickCloned, "slick-current": slickCurrent // dubious in case of RTL }; }; var getSlideStyle = function getSlideStyle(spec) { var style = {}; if (spec.variableWidth === undefined || spec.variableWidth === false) { style.width = spec.slideWidth; } if (spec.fade) { style.position = "relative"; if (spec.vertical && spec.slideHeight) { style.top = -spec.index * parseInt(spec.slideHeight); } else { style.left = -spec.index * parseInt(spec.slideWidth); } style.opacity = spec.currentSlide === spec.index ? 1 : 0; if (spec.useCSS) { style.transition = "opacity " + spec.speed + "ms " + spec.cssEase + ", " + "visibility " + spec.speed + "ms " + spec.cssEase; } } return style; }; var getKey = function getKey(child, fallbackKey) { return child.key + "-" + fallbackKey; }; var renderSlides = function renderSlides(spec) { var key; var slides = []; var preCloneSlides = []; var postCloneSlides = []; var childrenCount = React.Children.count(spec.children); var startIndex = lazyStartIndex(spec); var endIndex = lazyEndIndex(spec); React.Children.forEach(spec.children, function (elem, index) { var child; var childOnClickOptions = { message: "children", index: index, slidesToScroll: spec.slidesToScroll, currentSlide: spec.currentSlide }; // in case of lazyLoad, whether or not we want to fetch the slide if (!spec.lazyLoad || spec.lazyLoad && spec.lazyLoadedList.indexOf(index) >= 0) { child = elem; } else { child = /*#__PURE__*/React.createElement("div", null); } var childStyle = getSlideStyle(_objectSpread(_objectSpread({}, spec), {}, { index: index })); var slideClass = child.props.className || ""; var slideClasses = getSlideClasses(_objectSpread(_objectSpread({}, spec), {}, { index: index })); // push a cloned element of the desired slide slides.push( /*#__PURE__*/React.cloneElement(child, { key: "original" + getKey(child, index), "data-index": index, className: classnames(slideClasses, slideClass), tabIndex: "-1", "aria-hidden": !slideClasses["slick-active"], style: _objectSpread(_objectSpread({ outline: "none" }, child.props.style || {}), childStyle), onClick: function onClick(e) { child.props && child.props.onClick && child.props.onClick(e); if (spec.focusOnSelect) { spec.focusOnSelect(childOnClickOptions); } } })); // if slide needs to be precloned or postcloned if (spec.infinite && spec.fade === false) { var preCloneNo = childrenCount - index; if (preCloneNo <= getPreClones(spec) && childrenCount !== spec.slidesToShow) { key = -preCloneNo; if (key >= startIndex) { child = elem; } slideClasses = getSlideClasses(_objectSpread(_objectSpread({}, spec), {}, { index: key })); preCloneSlides.push( /*#__PURE__*/React.cloneElement(child, { key: "precloned" + getKey(child, key), "data-index": key, tabIndex: "-1", className: classnames(slideClasses, slideClass), "aria-hidden": !slideClasses["slick-active"], style: _objectSpread(_objectSpread({}, child.props.style || {}), childStyle), onClick: function onClick(e) { child.props && child.props.onClick && child.props.onClick(e); if (spec.focusOnSelect) { spec.focusOnSelect(childOnClickOptions); } } })); } if (childrenCount !== spec.slidesToShow) { key = childrenCount + index; if (key < endIndex) { child = elem; } slideClasses = getSlideClasses(_objectSpread(_objectSpread({}, spec), {}, { index: key })); postCloneSlides.push( /*#__PURE__*/React.cloneElement(child, { key: "postcloned" + getKey(child, key), "data-index": key, tabIndex: "-1", className: classnames(slideClasses, slideClass), "aria-hidden": !slideClasses["slick-active"], style: _objectSpread(_objectSpread({}, child.props.style || {}), childStyle), onClick: function onClick(e) { child.props && child.props.onClick && child.props.onClick(e); if (spec.focusOnSelect) { spec.focusOnSelect(childOnClickOptions); } } })); } } }); if (spec.rtl) { return preCloneSlides.concat(slides, postCloneSlides).reverse(); } else { return preCloneSlides.concat(slides, postCloneSlides); } }; export var Track = /*#__PURE__*/function (_React$PureComponent) { _inherits(Track, _React$PureComponent); var _super = _createSuper(Track); function Track() { var _this; _classCallCheck(this, Track); for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } _this = _super.call.apply(_super, [this].concat(args)); _defineProperty(_assertThisInitialized(_this), "node", null); _defineProperty(_assertThisInitialized(_this), "handleRef", function (ref) { _this.node = ref; }); return _this; } _createClass(Track, [{ key: "render", value: function render() { var slides = renderSlides(this.props); var _this$props = this.props, onMouseEnter = _this$props.onMouseEnter, onMouseOver = _this$props.onMouseOver, onMouseLeave = _this$props.onMouseLeave; var mouseEvents = { onMouseEnter: onMouseEnter, onMouseOver: onMouseOver, onMouseLeave: onMouseLeave }; return /*#__PURE__*/React.createElement("div", _extends({ ref: this.handleRef, className: "slick-track", style: this.props.trackStyle }, mouseEvents), slides); } }]); return Track; }(React.PureComponent);