<commit_before>// (C) Copyright 2016 Hewlett Packard Enterprise Development LP

import React, { Component, Children, PropTypes } from 'react';
import classnames from 'classnames';
import CSSClassnames from '../../utils/CSSClassnames';
import Intl from '../../utils/Intl';
import { padding, debounceDelay } from './utils';

import Meter from '../Meter';

import Axis from './Axis';
import Layers from './Layers';
import Base from './Base';
import Grid from './Grid';
import Area from './Area';
import Line from './Line';
import Bar from './Bar';
import Marker from './Marker';
import MarkerLabel from './MarkerLabel';
import HotSpots from './HotSpots';
import Range from './Range';

const CLASS_ROOT = CSSClassnames.CHART;
const CHART_BASE = CSSClassnames.CHART_BASE;

function traverseAndUpdateChildren (children) {
  return Children.map(children, child => {
    if (!child || !child.type) {
      return child;
    }

    // remove tabIndex from child elements to avoid
    // multiple tabs inside a chart
    if (child.type === Meter || child.type.name === 'Meter' ||
      child.type === Chart || child.type.name === 'Chart') {
      return React.cloneElement(child, {
        tabIndex: '-1'
      });
    }

    if (child.props.children) {
      const childrenNoTabIndex = traverseAndUpdateChildren(
        child.props.children
      );

      return React.cloneElement(child, {
        children: childrenNoTabIndex
      });
    }
    return child;
  });
}

export default class Chart extends Component {

  constructor(props, context) {
    super(props, context);
    this._onResize = this._onResize.bind(this);
    this._layout = this._layout.bind(this);
    this.state = { alignTop: 0, alignLeft: 0, alignHeight: 0, alignWidth: 0 };
  }

  componentDidMount () {
    window.addEventListener('resize', this._onResize);
    // Give sometime for the ui to render. Why is this needed though?
    setTimeout(this._layout, 150);
  }

  componentWillReceiveProps (nextProps) {
    if (this.props.vertical !== nextProps.vertical) {
      this.setState({ layoutNeeded: true });
    }
  }

  componentDidUpdate () {
    if (this.state.layoutNeeded) {
      this._layout();
      this.setState({ layoutNeeded: false });
    }
  }

  componentWillUnmount () {
    window.removeEventListener('resize', this._onResize);
  }

  _onResize () {<commit_msg>Changed Chart to re-layout on any change in properties.<commit_after>// (C) Copyright 2016 Hewlett Packard Enterprise Development LP

import React, { Component, Children, PropTypes } from 'react';
import classnames from 'classnames';
import CSSClassnames from '../../utils/CSSClassnames';
import Intl from '../../utils/Intl';
import { padding, debounceDelay } from './utils';

import Meter from '../Meter';

import Axis from './Axis';
import Layers from './Layers';
import Base from './Base';
import Grid from './Grid';
import Area from './Area';
import Line from './Line';
import Bar from './Bar';
import Marker from './Marker';
import MarkerLabel from './MarkerLabel';
import HotSpots from './HotSpots';
import Range from './Range';

const CLASS_ROOT = CSSClassnames.CHART;
const CHART_BASE = CSSClassnames.CHART_BASE;

function traverseAndUpdateChildren (children) {
  return Children.map(children, child => {
    if (!child || !child.type) {
      return child;
    }

    // remove tabIndex from child elements to avoid
    // multiple tabs inside a chart
    if (child.type === Meter || child.type.name === 'Meter' ||
      child.type === Chart || child.type.name === 'Chart') {
      return React.cloneElement(child, {
        tabIndex: '-1'
      });
    }

    if (child.props.children) {
      const childrenNoTabIndex = traverseAndUpdateChildren(
        child.props.children
      );

      return React.cloneElement(child, {
        children: childrenNoTabIndex
      });
    }
    return child;
  });
}

export default class Chart extends Component {

  constructor(props, context) {
    super(props, context);
    this._onResize = this._onResize.bind(this);
    this._layout = this._layout.bind(this);
    this.state = { alignTop: 0, alignLeft: 0, alignHeight: 0, alignWidth: 0 };
  }

  componentDidMount () {
    window.addEventListener('resize', this._onResize);
    // Give sometime for the ui to render. Why is this needed though?
    setTimeout(this._layout, 150);
  }

  componentWillReceiveProps (nextProps) {
    // Always layout when new props come. This takes care of a contained
    // Base having children that change.
    this.setState({ layoutNeeded: true });
  }

  componentDidUpdate () {
    if (this.state.layoutNeeded) {
      this._layout();
      this.setState({ layoutNeeded: false });
    }
  }

  componentWillUnmount () {
    window.removeEventListener('resize', this._onResize);
  }

  _onResize () {
{'fraction_non_alphanumeric': 0.1323590814196242, 'fraction_numerical': 0.005010438413361169, 'mean_word_length': 3.2063213345039507, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2954636', 'n_tokens_mistral': 1393, 'n_tokens_neox': 1368, 'n_words': 410}