Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.

3 лет назад
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
  3. import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
  4. import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
  5. import React, { Component } from 'react';
  6. import PropTypes from 'prop-types';
  7. import Carousel from './Carousel';
  8. import CarouselItem from './CarouselItem';
  9. import CarouselControl from './CarouselControl';
  10. import CarouselIndicators from './CarouselIndicators';
  11. import CarouselCaption from './CarouselCaption';
  12. var propTypes = {
  13. items: PropTypes.array.isRequired,
  14. indicators: PropTypes.bool,
  15. controls: PropTypes.bool,
  16. autoPlay: PropTypes.bool,
  17. defaultActiveIndex: PropTypes.number,
  18. activeIndex: PropTypes.number,
  19. next: PropTypes.func,
  20. previous: PropTypes.func,
  21. goToIndex: PropTypes.func
  22. };
  23. var UncontrolledCarousel =
  24. /*#__PURE__*/
  25. function (_Component) {
  26. _inheritsLoose(UncontrolledCarousel, _Component);
  27. function UncontrolledCarousel(props) {
  28. var _this;
  29. _this = _Component.call(this, props) || this;
  30. _this.animating = false;
  31. _this.state = {
  32. activeIndex: props.defaultActiveIndex || 0
  33. };
  34. _this.next = _this.next.bind(_assertThisInitialized(_assertThisInitialized(_this)));
  35. _this.previous = _this.previous.bind(_assertThisInitialized(_assertThisInitialized(_this)));
  36. _this.goToIndex = _this.goToIndex.bind(_assertThisInitialized(_assertThisInitialized(_this)));
  37. _this.onExiting = _this.onExiting.bind(_assertThisInitialized(_assertThisInitialized(_this)));
  38. _this.onExited = _this.onExited.bind(_assertThisInitialized(_assertThisInitialized(_this)));
  39. return _this;
  40. }
  41. var _proto = UncontrolledCarousel.prototype;
  42. _proto.onExiting = function onExiting() {
  43. this.animating = true;
  44. };
  45. _proto.onExited = function onExited() {
  46. this.animating = false;
  47. };
  48. _proto.next = function next() {
  49. if (this.animating) return;
  50. var nextIndex = this.state.activeIndex === this.props.items.length - 1 ? 0 : this.state.activeIndex + 1;
  51. this.setState({
  52. activeIndex: nextIndex
  53. });
  54. };
  55. _proto.previous = function previous() {
  56. if (this.animating) return;
  57. var nextIndex = this.state.activeIndex === 0 ? this.props.items.length - 1 : this.state.activeIndex - 1;
  58. this.setState({
  59. activeIndex: nextIndex
  60. });
  61. };
  62. _proto.goToIndex = function goToIndex(newIndex) {
  63. if (this.animating) return;
  64. this.setState({
  65. activeIndex: newIndex
  66. });
  67. };
  68. _proto.render = function render() {
  69. var _this2 = this;
  70. var _this$props = this.props,
  71. defaultActiveIndex = _this$props.defaultActiveIndex,
  72. autoPlay = _this$props.autoPlay,
  73. indicators = _this$props.indicators,
  74. controls = _this$props.controls,
  75. items = _this$props.items,
  76. goToIndex = _this$props.goToIndex,
  77. props = _objectWithoutPropertiesLoose(_this$props, ["defaultActiveIndex", "autoPlay", "indicators", "controls", "items", "goToIndex"]);
  78. var activeIndex = this.state.activeIndex;
  79. var slides = items.map(function (item) {
  80. return React.createElement(CarouselItem, {
  81. onExiting: _this2.onExiting,
  82. onExited: _this2.onExited,
  83. key: item.src
  84. }, React.createElement("img", {
  85. className: "d-block w-100",
  86. src: item.src,
  87. alt: item.altText
  88. }), React.createElement(CarouselCaption, {
  89. captionText: item.caption,
  90. captionHeader: item.header || item.caption
  91. }));
  92. });
  93. return React.createElement(Carousel, _extends({
  94. activeIndex: activeIndex,
  95. next: this.next,
  96. previous: this.previous,
  97. ride: autoPlay ? 'carousel' : undefined
  98. }, props), indicators && React.createElement(CarouselIndicators, {
  99. items: items,
  100. activeIndex: props.activeIndex || activeIndex,
  101. onClickHandler: goToIndex || this.goToIndex
  102. }), slides, controls && React.createElement(CarouselControl, {
  103. direction: "prev",
  104. directionText: "Previous",
  105. onClickHandler: props.previous || this.previous
  106. }), controls && React.createElement(CarouselControl, {
  107. direction: "next",
  108. directionText: "Next",
  109. onClickHandler: props.next || this.next
  110. }));
  111. };
  112. return UncontrolledCarousel;
  113. }(Component);
  114. UncontrolledCarousel.propTypes = propTypes;
  115. UncontrolledCarousel.defaultProps = {
  116. controls: true,
  117. indicators: true,
  118. autoPlay: true
  119. };
  120. export default UncontrolledCarousel;