<commit_before>/*
 * react-tinyscrollbar
 *
 * https://github.com/jostw/react-tinyscrollbar
 *
 * Copyright (c) 2015 jos
 * Licensed under the MIT license.
 */

"use strict";

var React = require("react");
var ReactTinyscrollbar = require("../../src/ReactTinyscrollbar.jsx");

class Example extends React.Component {
    constructor(props) {
        super(props);

        this.state = { count: 10 };

        this.onSubmit = this.onSubmit.bind(this);
    }

    render() {
        var lines = [];

        for (let i = 0; i < this.state.count; i++) {
            lines.push(
                <div key={ i } style={{ margin: "1em 0", padding: ".5em", opacity: "0.5", backgroundColor: "white" }}>{ i + 1 }</div>
            );
        }

        return (
            <div>
                <form onSubmit={ this.onSubmit }>
                    <label htmlFor="input">Number of lines: </label>
                    <input type="text" id="input" ref="input" defaultValue={ this.state.count } />
                    <button>update</button>
                </form>
                <div style={{ marginTop: "1em", backgroundColor: "red" }}>
                    <ReactTinyscrollbar height={ 300 }>{ lines }</ReactTinyscrollbar>
                </div>
            </div>
        );
    }

    onSubmit(e) {
        e.preventDefault();

        this.setState({ count: React.findDOMNode(this.refs.input).value });
    }
}


React.render(<Example />, document.getElementById("app"));<commit_msg>update example.jsx with es6 syntax<commit_after>/*
 * react-tinyscrollbar
 *
 * https://github.com/jostw/react-tinyscrollbar
 *
 * Copyright (c) 2015 jos
 * Licensed under the MIT license.
 */

"use strict";

import React from "react";
import ReactTinyscrollbar from "../../src/ReactTinyscrollbar.jsx";

class Example extends React.Component {
    constructor(props) {
        super(props);

        this.state = { count: 10 };

        this.onSubmit = this.onSubmit.bind(this);
    }

    render() {
        let lines = [];

        for (let i = 0; i < this.state.count; i++) {
            lines.push(<div key={ i } style={{ margin: "1em 0", padding: ".5em", opacity: "0.5", backgroundColor: "white" }}>{ i + 1 }</div>);
        }

        return (
            <div>
                <form onSubmit={ this.onSubmit }>
                    <label htmlFor="input">Number of lines: </label>
                    <input type="text" id="input" ref="input" defaultValue={ this.state.count } />
                    <button>update</button>
                </form>
                <div style={{ marginTop: "1em", backgroundColor: "red" }}>
                    <ReactTinyscrollbar height={ 300 }>{ lines }</ReactTinyscrollbar>
                </div>
            </div>
        );
    }

    onSubmit(e) {
        e.preventDefault();

        this.setState({ count: React.findDOMNode(this.refs.input).value });
    }
}

React.render(<Example />, document.getElementById("app"));
{'fraction_non_alphanumeric': 0.15852002715546504, 'fraction_numerical': 0.01188051595383571, 'mean_word_length': 1.938185443668993, 'pattern_counts': {'":': 0, '<': 37, '<?xml version=': 0, '>': 35, 'https://': 2, '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': '2934684', 'n_tokens_mistral': 916, 'n_tokens_neox': 893, 'n_words': 196}