import React from 'react'

export default ({ isDisabled, direction, onClickHandler }) => {
  return (
    <div
      className={`narrative-adjust ${direction}`}
      onClick={!isDisabled ? onClickHandler : null}
    >
      <i
        className={`material-icons ${isDisabled ? 'disabled' : ''}`}
      >
        {`chevron_${direction}`}
      </i>
    </div>
  )
}