text: import React from 'react'
  import PropTypes from 'prop-types'
  
  import SvgContainer from './SvgContainer'
  
  const Toggle = props => {
    return (
      <SvgContainer
        height={props.height}
        width={props.width}
        color={props.color}
        onClick={props.onClick}
        rotate={props.rotate ? 1 : 0}
        shake={props.shake ? 1 : 0}
        beat={props.beat ? 1 : 0}
        className={props.className}
      >
        <svg style={props.style} className={props.cssClasses} xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 512 512">{props.title ? <title>{props.title}</title> : ''}<path d="M368 112H144C64.6 112 0 176.6 0 256s64.6 144 144 144h224c79.4 0 144-64.6 144-144s-64.6-144-144-144zm0 256a112 112 0 11112-112 112.12 112.12 0 01-112 112z"/></svg>
      </SvgContainer>
    )
  }
  
  
  Toggle.defaultProps = {
    // style
    style: {},
    color: '#000000',
    height: '22px',
    width: '22px',
    cssClasses: '',
    title: '',
  
    // animation
    shake: false,
    beat: false,
    rotate: false,
  }
  
  
  Toggle.propTypes = {
    // style
    style: PropTypes.object,
    color: PropTypes.string,
    height: PropTypes.string,
    width: PropTypes.string,
    cssClasses: PropTypes.string,
    title: PropTypes.string,
  
    // animation
    shake: PropTypes.bool,
    beat: PropTypes.bool,
    rotate: PropTypes.bool,
  
    // functions
    onClick: PropTypes.func
  }
  
  
  export default Toggle