import React from 'react'
import { ProgressBarProps } from './typings'
import {
  renderFillBar as defaultRenderFillBar,
  renderWrapper as defaultRenderWrapper,
} from './renderProps'

class ProgressBar extends React.PureComponent<ProgressBarProps> {
  static defaultProps = {
    className: '',
    currentValue: 0,
    totalValue: 0,
    // fill color ? backgroundColor? border color? needs standard yo
    barColor: '#ccc',
    renderFillBar: defaultRenderFillBar,
    renderWrapper: defaultRenderWrapper,
  }

  render() {
    const fillBar = this.props.renderFillBar(this.props)
    const children = <React.Fragment>{fillBar}</React.Fragment>
    const view = this.props.renderWrapper({ ...this.props, children })
    return view
  }
}

export { ProgressBar }
export default ProgressBar