You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

CarouselControl.js 1.3 KiB

3 jaren geleden
1234567891011121314151617181920212223242526272829303132333435363738
  1. import React from 'react';
  2. import PropTypes from 'prop-types';
  3. import classNames from 'classnames';
  4. import { mapToCssModules } from './utils';
  5. var CarouselControl = function CarouselControl(props) {
  6. var direction = props.direction,
  7. onClickHandler = props.onClickHandler,
  8. cssModule = props.cssModule,
  9. directionText = props.directionText,
  10. className = props.className;
  11. var anchorClasses = mapToCssModules(classNames(className, "carousel-control-" + direction), cssModule);
  12. var iconClasses = mapToCssModules(classNames("carousel-control-" + direction + "-icon"), cssModule);
  13. var screenReaderClasses = mapToCssModules(classNames('sr-only'), cssModule);
  14. return React.createElement("a", {
  15. className: anchorClasses,
  16. role: "button",
  17. tabIndex: "0",
  18. onClick: function onClick(e) {
  19. e.preventDefault();
  20. onClickHandler();
  21. }
  22. }, React.createElement("span", {
  23. className: iconClasses,
  24. "aria-hidden": "true"
  25. }), React.createElement("span", {
  26. className: screenReaderClasses
  27. }, directionText || direction));
  28. };
  29. CarouselControl.propTypes = {
  30. direction: PropTypes.oneOf(['prev', 'next']).isRequired,
  31. onClickHandler: PropTypes.func.isRequired,
  32. cssModule: PropTypes.object,
  33. directionText: PropTypes.string,
  34. className: PropTypes.string
  35. };
  36. export default CarouselControl;