<commit_before>import React from 'react'
import TransitionGroup from 'react-addons-transition-group'
import classnames from 'classnames'
import { InputForm } from './'

export default class Input extends React.Component {
  constructor(props, context) {
    super(props, context)
    this.state = {
      hasMouseOver: false,
      editing: this.props.initializeEditing
    }
  }

  handleMouseOver() {
    this.setState({hasMouseOver: true})
  }

  handleMouseOut() {
    this.setState({hasMouseOver: false})
  }

  handleClick() {
    if (this.props.configurable) {
      this.setState({editing: true})
    }
  }

  handleCloseForm() {
    this.setState({editing: false})
  }

  renderForm() {
    const { uid } = this.props
    return (
      <TransitionGroup>
        <InputForm {...this.props} onClose={::this.handleCloseForm} key={'form-' + uid} />
      </TransitionGroup>
    )
  }

  renderInstructions() {
    const { configurable } = this.props
    if (configurable && this.state.hasMouseOver) {
      return (
        <div className="right">
          <i className="fa fa-pencil-square-o mr1" />
          Clique para editar
        </div>
      )
    }
  }

  renderFieldKind() {
    const { field, uid, editable, configurable } = this.props

    if (field.kind === 'dropdown') {
      return (<select
        id={'input-' + uid}
        className="select block border border-gray94"
        style={{
          cursor: editable || configurable ? 'pointer' : null,
          borderRadius: '2px',
          padding: '1rem',
          display: 'inline-block',
          height: 'inherit'
        }}
      >
        <option value="">Selecione...</option>
        {
          field.placeholder.split(',').map(function(v, index) {
            return <option key={`dropdown-option-${index}`}>{v}</option>
          })
        }
      </select>)
    } else if (field.kind === 'greetings') {
      return (
        editable || configurable ? (
          <p className="block full-width">
            <strong>Mensagem de sucesso alterada para:</strong><br />
            {field.placeholder}
          </p>
        )
        : null
      )
    } else {
      return (
        <input
          id={`input-${uid}`}
          className="input block border border-gray94"
          style={{
            cursor: editable || configurable ? 'pointer' : null,
            borderRadius: '2px',
            padding: '1.5rem 1rem'
          }}
          placeholder={field.placeholder}
          type='text'
        />
      )
    }
  }

  renderInput() {
    const {
      field,
      editable,
      configurable,
      mobilization: {
        body_font: bodyFont
      }
    } = this.props

    return (
      <div
        className="mb2"
        onMouseEnter={::this.handleMouseOver}
        onMouseLeave={::this.handleMouseOut}
        style={{
          cursor: editable || configurable ? 'pointer' : null,
          fontFamily: bodyFont
        }}
        onClick={::this.handleClick}>
        <label
          className={classnames(
            'caps bold mb1 inline-block white',
            configurable ? 'darkengray' : null
          )}
          style={{
            cursor: editable || configurable ? 'pointer' : null,
            fontSize: '.75rem',
            fontWeight: 600,
            marginBottom: '1rem'<commit_msg>Fix FormWidget field input label color. #212<commit_after>import React from 'react'
import TransitionGroup from 'react-addons-transition-group'
import classnames from 'classnames'
import { InputForm } from './'

export default class Input extends React.Component {
  constructor(props, context) {
    super(props, context)
    this.state = {
      hasMouseOver: false,
      editing: this.props.initializeEditing
    }
  }

  handleMouseOver() {
    this.setState({hasMouseOver: true})
  }

  handleMouseOut() {
    this.setState({hasMouseOver: false})
  }

  handleClick() {
    if (this.props.configurable) {
      this.setState({editing: true})
    }
  }

  handleCloseForm() {
    this.setState({editing: false})
  }

  renderForm() {
    const { uid } = this.props
    return (
      <TransitionGroup>
        <InputForm {...this.props} onClose={::this.handleCloseForm} key={'form-' + uid} />
      </TransitionGroup>
    )
  }

  renderInstructions() {
    const { configurable } = this.props
    if (configurable && this.state.hasMouseOver) {
      return (
        <div className="right">
          <i className="fa fa-pencil-square-o mr1" />
          Clique para editar
        </div>
      )
    }
  }

  renderFieldKind() {
    const { field, uid, editable, configurable } = this.props

    if (field.kind === 'dropdown') {
      return (<select
        id={'input-' + uid}
        className="select block border border-gray94"
        style={{
          cursor: editable || configurable ? 'pointer' : null,
          borderRadius: '2px',
          padding: '1rem',
          display: 'inline-block',
          height: 'inherit'
        }}
      >
        <option value="">Selecione...</option>
        {
          field.placeholder.split(',').map(function(v, index) {
            return <option key={`dropdown-option-${index}`}>{v}</option>
          })
        }
      </select>)
    } else if (field.kind === 'greetings') {
      return (
        editable || configurable ? (
          <p className="block full-width">
            <strong>Mensagem de sucesso alterada para:</strong><br />
            {field.placeholder}
          </p>
        )
        : null
      )
    } else {
      return (
        <input
          id={`input-${uid}`}
          className="input block border border-gray94"
          style={{
            cursor: editable || configurable ? 'pointer' : null,
            borderRadius: '2px',
            padding: '1.5rem 1rem'
          }}
          placeholder={field.placeholder}
          type='text'
        />
      )
    }
  }

  renderInput() {
    const {
      field,
      editable,
      configurable,
      mobilization: {
        body_font: bodyFont
      }
    } = this.props

    return (
      <div
        className="mb2"
        onMouseEnter={::this.handleMouseOver}
        onMouseLeave={::this.handleMouseOut}
        style={{
          cursor: editable || configurable ? 'pointer' : null,
          fontFamily: bodyFont
        }}
        onClick={::this.handleClick}>
        <label
          className={classnames(
            'caps bold mb1 inline-block',
            configurable ? 'darkengray' : 'white'
          )}
          style={{
            cursor: editable || configurable ? 'pointer' : null,
            fontSize: '.75rem',
            fontWeight: 600,
            marginBottom: '1rem'
{'fraction_non_alphanumeric': 0.13281483697277893, 'fraction_numerical': 0.00613221657194137, 'mean_word_length': 1.8810857389056441, 'pattern_counts': {'":': 0, '<': 43, '<?xml version=': 0, '>': 41, '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': '5557680', 'n_tokens_mistral': 1959, 'n_tokens_neox': 1940, 'n_words': 400}