<commit_before>/**
 * UCSC Xena Client
 * http://xena.ucsc.edu
 *
 * Structural component, giving each column a sibling "add column" component.
 */

'use strict';

// Core dependencies, components
var React = require('react');
var {deepPureRenderMixin} = require('../react-utils');
var classNames = require('classnames');
var ColumnAdd = require('../views/ColumnAdd');

// Styles
var compStyles = require('./addColumnAdd.module.css');

var hoverClass = (index, hover) =>
	index === hover ? compStyles.hoverLeft :
		(index - 1 === hover ? compStyles.hoverRight : undefined);

// XXX move layout to a view, after we know what the final layout will be.
function addColumnAdd(Component) {
	return React.createClass({
		displayName: 'SpreadsheetColumnAdd',
		mixins: [deepPureRenderMixin],
		getInitialState() {
			return {hover: null};
		},
		onClick(index) {
			this.props.onAddColumn(index);
			this.setState({hover: null});
		},
		onHover(index, hovering) {
			var {hover} = this.state;
			// I don't trust in/out events to arrive in order, so only
			// reset state if it matches the current index.
			if (hovering) {
				this.setState({hover: index});
			} else if (hover === index) {
				this.setState({hover: null});
			}
		},
		render() {
			var {children, ...otherProps} = this.props,
				{appState: {wizardMode}, interactive} = otherProps,
				{hover} = this.state,
				lastIndex = children.length - 1,
				columns = React.Children.map(children, (child, i) => (
					<div
						className={classNames(compStyles.visualizationOrWizardMode, hoverClass(i, hover), {[compStyles.wizardModeMargins]: wizardMode})}
						actionKey={child.props.actionKey}>

						{child}
						<ColumnAdd
							show={interactive}<commit_msg>Avoid add-column hover being stuck on.<commit_after>/**
 * UCSC Xena Client
 * http://xena.ucsc.edu
 *
 * Structural component, giving each column a sibling "add column" component.
 */

'use strict';

// Core dependencies, components
var React = require('react');
var {deepPureRenderMixin} = require('../react-utils');
var classNames = require('classnames');
var ColumnAdd = require('../views/ColumnAdd');

// Styles
var compStyles = require('./addColumnAdd.module.css');

var hoverClass = (index, hover) =>
	index === hover ? compStyles.hoverLeft :
		(index - 1 === hover ? compStyles.hoverRight : undefined);

// XXX move layout to a view, after we know what the final layout will be.
function addColumnAdd(Component) {
	return React.createClass({
		displayName: 'SpreadsheetColumnAdd',
		mixins: [deepPureRenderMixin],
		getInitialState() {
			return {hover: null};
		},
		onClick(index) {
			this.props.onAddColumn(index);
			this.setState({hover: null});
		},
		onHover(index, hovering) {
			this.setState({hover: hovering ? index : null});
		},
		render() {
			var {children, ...otherProps} = this.props,
				{appState: {wizardMode}, interactive} = otherProps,
				{hover} = this.state,
				lastIndex = children.length - 1,
				columns = React.Children.map(children, (child, i) => (
					<div
						className={classNames(compStyles.visualizationOrWizardMode, hoverClass(i, hover), {[compStyles.wizardModeMargins]: wizardMode})}
						actionKey={child.props.actionKey}>

						{child}
						<ColumnAdd
							show={interactive}
{'fraction_non_alphanumeric': 0.14715821812596006, 'fraction_numerical': 0.001228878648233487, 'mean_word_length': 3.8524590163934427, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 9, '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': '3686551', 'n_tokens_mistral': 1158, 'n_tokens_neox': 1011, 'n_words': 258}