import React from 'react'
import { Empty } from 'atoms/Empty'
import { defaultRenderArrows } from './renderProps'
import { CarouselArrowProps } from './typings'

class CarouselArrow extends React.Component<CarouselArrowProps> {
  static defaultProps = {
    className: '',
    hasArrows: true,
    arrowIconColor: '#000',
    arrowIconSize: '24px',
    renderArrows: defaultRenderArrows,
  }
  render() {
    const { renderArrows, state, hasArrows, ...remainingProps } = this.props
    const view =
      hasArrows === true ? renderArrows(remainingProps, state) : <Empty />
    return view
  }
}

export { CarouselArrow }
export default CarouselArrow