text: import React, {Component} from 'react';
  import { Sparklines, SparklinesBars, SparklinesLine, SparklinesNormalBand, SparklinesReferenceLine, SparklinesSpots } from 'react-sparklines';
  import styles from './sparkline.css';
  
  export default class Sparkline extends Component {
    static PropTypes = {
      height: React.PropTypes.number,
      width: React.PropTypes.number,
      limit: React.PropTypes.number,
      margin: React.PropTypes.number,
      chartName: React.PropTypes.string,
      lineStyle: React.PropTypes.object,
      barStyle: React.PropTypes.object,
      referenceLine: React.PropTypes.string
    }
  
    static defaultProps = {
      height: 150,
      margin: 5,
      chartName: "My Chart",
      referenceLine: "avg",
    };
  
    render() {
  
      return (
        <div className={styles.wrapper} >
          <h4>{this.props.chartName}</h4>
          <Sparklines data={this.props.data}
                      limit={this.props.limit}
                      width={this.props.width}
                      height={this.props.height}
                      margin={this.props.margin}
                      style={this.props.chartStyle}>
            <SparklinesLine style={this.props.lineStyle} />
            <SparklinesBars style={this.props.barStyle} height={this.props.height} />
            <SparklinesReferenceLine type={this.props.referenceLine} style={this.props.referenceLineStyle} />
          </Sparklines>
        </div>
      );
    }
  }
  