<commit_before>"use strict";

var React = require("react");
var _ = require("underscore");

module.exports = React.createClass({

	// elements, i.e.[ { name: "<NAME>", key: "dog" }, ...]
	// onSelect called with activeElementKey as only argument
	getDefaultProps: function () {

		return {
			elements: [],
			initialActiveElementKey: null,
			onSelect: null,
		};
	},

	getInitialState: function () {
		return {
			activeElementKey: this.props.initialActiveElementKey
		};
	},

	componentDidUpdate: function () {
		if (this.props.onSelect) {
			this.props.onSelect(this.state.activeElementKey)
		}
	},

	shouldComponentUpdate: function(nextProps, nextState) {
		return !(this.state.activeElementKey === nextState.activeElementKey);
	},

	render: function () {
		var inputs = _.map(this.props.elements, (d) => {
			var _onClick = (e) => {
				e.preventDefault();
				this.setState({
					activeElementKey: d.key
				});
			};
			var _checked = d.key === this.state.activeElementKey;

			// make the width as wide as possible
			var widthPercent = `${1 / this.props.elements.length * 100}%`;

			return (
				<div className="radio-element-container" style={{ display: "inline-block", width: widthPercent }}>
					<input type="radio" onClick={_onClick} name={d.key} value={d.key} checked={_checked}>
						<label>{d.name}</label>
					</input>
				</div>
			);
			
		});
		return (
			<form className="radio-selector" action="">
				{inputs}
			</form>
		);
	}

});<commit_msg>fix some radio selector strangeness<commit_after>"use strict";

var React = require("react");
var _ = require("underscore");

module.exports = React.createClass({
	// elements, i.e.[ { name: "<NAME>", key: "dog" }, ...]
	// onSelect(activeElementKey)
	propTypes: {
		elements: React.PropTypes.array.isRequired,
		initialActiveElementKey: React.PropTypes.string,
		onSelect: React.PropTypes.func
	},

	getInitialState: function () {
		return {
			activeElementKey: this.props.initialActiveElementKey
		};
	},

	componentDidUpdate: function () {
		if (this.props.onSelect) {
			this.props.onSelect(this.state.activeElementKey)
		}
	},

	shouldComponentUpdate: function(nextProps, nextState) {
		return !(this.state.activeElementKey === nextState.activeElementKey);
	},

	render: function () {
		var inputs = _.map(this.props.elements, (d, i) => {
			var _onClick = (e) => {
				this.setState({
					activeElementKey: d.key
				});
			};
			var _checked = d.key === this.state.activeElementKey;

			// make the width as wide as possible
			var widthPercent = `${1 / this.props.elements.length * 100}%`;

			return (
				<div className="radio-element-container" style={{ display: "inline-block", width: widthPercent }} key={"radioElement" + i}>
					<input type="radio" onChange={_onClick} name={d.key} value={d.key} checked={_checked}>
						<label onClick={_onClick}>{d.name}</label>
					</input>
				</div>
			);
			
		});
		return (
			<form className="radio-selector" action="">
				{inputs}
			</form>
		);
	}

});
{'fraction_non_alphanumeric': 0.16744652406417113, 'fraction_numerical': 0.00267379679144385, 'mean_word_length': 3.5555555555555554, 'pattern_counts': {'":': 0, '<': 21, '<?xml version=': 0, '>': 25, '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': '927472', 'n_tokens_mistral': 1130, 'n_tokens_neox': 968, 'n_words': 196}