@6thquake/react-material/es/Carousel/CarouselArrow.js

React components that implement Google's Material Design.

/**
 * @ignore - internal component.
 */
import React from 'react';
import withStyles from '../styles/withStyles';
import { ChevronRight, ChevronLeft } from '@material-ui/icons';
const styles = {
  root: {
    width: '100%',
    height: '0',
    top: '50%',
    position: 'absolute',
    transform: 'translateY(-50%)'
  },
  arrow: {
    position: 'relative',
    top: '-15px',
    height: '30px',
    width: '30px',
    cursor: 'pointer',
    color: 'rgba(0,0,0,0.5)',
    '@global svg': {
      width: '100%',
      height: 'auto'
    }
  },
  pre: {
    float: 'left'
  },
  next: {
    float: 'right'
  }
};

var _ref = React.createElement(ChevronLeft, null);

var _ref2 = React.createElement(ChevronRight, null);

class CarouselArrow extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {}

  render() {
    const {
      pre,
      next,
      classes
    } = this.props;
    return React.createElement("div", {
      className: classes.root
    }, React.createElement("div", {
      className: `${classes.pre} ${classes.arrow}`,
      onClick: pre
    }, _ref), React.createElement("div", {
      className: `${classes.next} ${classes.arrow}`,
      onClick: next
    }, _ref2));
  }

}

process.env.NODE_ENV !== "production" ? CarouselArrow.propTypes = {} : void 0;
export default withStyles(styles, {
  name: 'RMCarouselArrow'
})(CarouselArrow);