<commit_before>'use strict';

var React = require('react');
var ColorPicker = require('../');

// Output fill that's outside of the react app.
var outputFill = document.getElementById('output-fill');

var App = React.createClass({
  isDark: function(color) {
    return ((color.r * 0.299) + (color.g * 0.587) + (color.b * 0.114) > 186 ||
            color.a < 0.50) ?
            false :
            true;
  },

  outputFormat: function(c) {
    return 'rgba(' + c.r + ',' + c.g + ',' + c.b + ',' + c.a + ')';
  },

  onChange: function(color) {
    console.log('onChange: ', color);

    var output = this.outputFormat(color);
    outputFill.style.backgroundColor = output;

    if (this.isDark(color)) {
      outputFill.classList.add('dark');
    } else {
      outputFill.classList.remove('dark');
    }
  },

  render: function() {
    return (
      <div>
        <ColorPicker
          value={'rgba(0,255,255,0.5)'}
          onChange={this.onChange} />
      </div>
    );
  }

});

React.render(<App/>, document.getElementById('app'));<commit_msg>Simplify the example more.<commit_after>'use strict';

var React = require('react');
var ColorPicker = require('../');

// Output fill that's outside of the react app.
var outputFill = document.getElementById('output-fill');

var App = React.createClass({
  isDark: function(color) {
    return ((color.r * 0.299) + (color.g * 0.587) + (color.b * 0.114) > 186 ||
            color.a < 0.50) ?
            false :
            true;
  },

  outputFormat: function(c) {
    return 'rgba(' + c.r + ',' + c.g + ',' + c.b + ',' + c.a + ')';
  },

  onChange: function(color) {
    var output = this.outputFormat(color);
    outputFill.style.backgroundColor = output;

    if (this.isDark(color)) {
      outputFill.classList.add('dark');
    } else {
      outputFill.classList.remove('dark');
    }
  },

  render: function() {
    return (
      <div>
        <ColorPicker onChange={this.onChange} />
      </div>
    );
  }

});

React.render(<App/>, document.getElementById('app'));
{'fraction_non_alphanumeric': 0.1856581532416503, 'fraction_numerical': 0.022102161100196464, 'mean_word_length': 2.5, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 13, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1151368', 'n_tokens_mistral': 715, 'n_tokens_neox': 678, 'n_words': 135}