Contents

/* @flow */

import React from 'react'
import classnames from 'classnames'

import { globalProps } from '../utilities/globalProps.js'
import pbChart from '../plugins/pb_chart'

type LineGraphProps = {
  axisTitle?: string,
  dark?: Boolean,
  xAxisCategories: array,
  yAxisMin: number,
  yAxisMax: number,
  className?: string,
  chartData: array<{
      name: string,
      data: array<number>,
  }>,
  gradient?: boolean,
  id: string,
  pointStart: number,
  subTitle?: string,
  title: string,
  type?: string,
  legend?: boolean,
  toggleLegendClick?: boolean,
  height?: string,
  colors: array,
  }

export default class LineGraph extends React.Component<LineGraphProps> {
  static defaultProps = {
    className: 'pb_bar_graph',
    dark: false,
    gradient: false,
    type: 'line',
    legend: false,
    toggleLegendClick: true,
  }

  componentDidMount() {
    const {
      axisTitle,
      dark,
      xAxisCategories,
      yAxisMin,
      yAxisMax,
      className,
      chartData,
      id,
      pointStart,
      subTitle,
      title,
      type,
      legend,
      toggleLegendClick,
      height,
      colors = [],
    } = this.props

    new pbChart(`.${className}`, {
      axisTitle: axisTitle,
      chartData: chartData,
      colors: colors,
      dark,
      id: id,
      pointStart: pointStart,
      subtitle: subTitle,
      type,
      title: title,
      xAxisCategories: xAxisCategories,
      yAxisMin: yAxisMin,
      yAxisMax: yAxisMax,
      legend: legend,
      toggleLegendClick: toggleLegendClick,
      height: height,
    })
  }

  props: LineGraphProps

  render() {
    const { className, id } = this.props

    return (
      <div
          className={classnames(globalProps(this.props), className)}
          id={id}
      />
    )
  }
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
playbook_ui-10.21.0.pre.alpha.lightbox.2	app/pb_kits/playbook/pb_line_graph/_line_graph.jsx
playbook_ui-10.21.0.pre.alpha.lightbox	app/pb_kits/playbook/pb_line_graph/_line_graph.jsx