react-life-design
Version:
Life Design UI components
61 lines • 2.87 kB
JavaScript
;
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var index_1 = require("../index");
var Slider_styled_1 = require("./Slider.styled");
var Slider = (function (_super) {
__extends(Slider, _super);
function Slider() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.state = {
currentIndex: 0,
translateValue: 0,
};
_this.goToNextSlide = function () {
var currentIndex = _this.state.currentIndex;
var children = _this.props.children;
if (currentIndex === (children.length)) {
return _this.setState({ currentIndex: 0, translateValue: 0 });
}
_this.setState(function (prevState) { return ({
currentIndex: prevState.currentIndex + 1,
translateValue: prevState.translateValue + -(_this.slideWidth()),
}); });
};
_this.goToPrevSlide = function () {
_this.setState(function (prevState) { return ({
currentIndex: prevState.currentIndex - 1,
translateValue: prevState.translateValue - -(_this.slideWidth()),
}); });
};
_this.slideWidth = function () { return document.querySelector('.slide').clientWidth; };
return _this;
}
Slider.prototype.render = function () {
var _a = this.state, translateValue = _a.translateValue, currentIndex = _a.currentIndex;
return (React.createElement(Slider_styled_1.ParentSlider, null,
React.createElement(Slider_styled_1.Wrapper, { translate: translateValue },
React.createElement(Slider_styled_1.Container, null, this.props.children)),
currentIndex > 0 && React.createElement(Slider_styled_1.ArrowLeft, { onClick: this.goToPrevSlide },
React.createElement(index_1.Icons.Arrow, { degree: 270 })),
React.createElement(Slider_styled_1.ArrowRight, { onClick: this.goToNextSlide },
React.createElement(index_1.Icons.Arrow, { degree: 90 }))));
};
Slider.Slide = Slider_styled_1.Slide;
return Slider;
}(React.PureComponent));
exports.default = Slider;
//# sourceMappingURL=Slider.js.map