<commit_before>/* eslint react/no-multi-comp:0, no-console:0 */

import {createForm} from 'rc-form';
import React, {Component, PropTypes} from 'react';
import ReactDOM from 'react-dom';
import Select, {Option} from 'antd/lib/select';
import DatePicker from 'antd/lib/date-picker';
import 'antd/lib/index.css';
import {regionStyle, errorStyle} from './styles';

function Email(props) {
  const {getFieldProps, getFieldError, isFieldValidating} = props.form;
  const errors = getFieldError('email');
  return (<div style={regionStyle}>
    <p>email sync validate</p>
    <p><input {...getFieldProps('email', {
      rules: [
        {required: true},
        {type: 'email', message: '错误的 email 格式'},
      ],
    })}/></p>
    <p style={errorStyle}>
      {errors ? errors.join(',') : null}
    </p>
    <p style={errorStyle}>
      {isFieldValidating('email') ? 'validating' : null}
    </p>
  </div>);
}

Email.propTypes = {
  form: PropTypes.object,
};

const User = React.createClass({
  propTypes: {
    form: PropTypes.object,
  },

  userExists(rule, value, callback) {
    setTimeout(() => {
      if (value === '1') {
        callback([new Error('are you kidding?')]);
      } else if (value === 'yiminghe') {
        callback([new Error('forbid yiminghe')]);
      } else {
        callback();
      }
    }, 300);
  },

  render() {
    const {getFieldProps, getFieldError, isFieldValidating} = this.props.form;
    const errors = getFieldError('user');
    return (<div style={regionStyle}>
      <p>user async validate</p>
      <p><input {...getFieldProps('user', {
        initialValue: 'x',
        rules: [
          {required: true},
          {validator: this.userExists},
        ],
      })}/></p>
      <p style={errorStyle}>
        {(errors) ? errors.join(',') : null}
      </p>
      <p style={errorStyle}>
        {isFieldValidating('user') ? 'validating' : null}
      </p>
    </div>);
  },
});


function CustomInput(props) {
  const {getFieldProps, getFieldError, isFieldValidating} = props.form;
  const errors = getFieldError('select');
  return (<div style={regionStyle}>
    <p>custom select sync validate</p>
    <p><Select placeholder="please select" style={{width: 200}} {...getFieldProps('select', {
      rules: [
        {required: true},
      ],
    })}>
      <Option value="1">1</Option>
      <Option value="2">2</Option>
    </Select></p>
    <p style={errorStyle}>
      {(errors) ? errors.join(',') : null}
    </p>
    <p style={errorStyle}>
      {isFieldValidating('select') ? 'validating' : null}
    </p>
  </div>);
}

CustomInput.propTypes = {
  form: PropTypes.object,
};

function DateInput(props) {
  const {getFieldProps, getFieldError} = props.form;
  const errors = getFieldError('date');
  return (<div style={regionStyle}>
    <p>DateInput sync validate</p>
    <p style={{width: 200}}>
      <DatePicker placeholder="please select" {...getFieldProps('date', {
        rules: [
          {required: true, type: 'date'},
        ],
      })} /></p>
    <p style={errorStyle}>
      {(errors) ? errors.join(',') : null}
    </p>
  </div>);
}

DateInput.propTypes = {
  form: PropTypes.object,
};

function toNumber(v) {
  if (v === '') {
    return undefined;
  }
  if (v.trim() === '') {
    return NaN;
  }
  return Number(v);
}

function NumberInput(props) {
  const {getFieldProps, getFieldError} = props.form;
  const errors = getFieldError('number');
  return (<div style={regionStyle}>
    <p>number input</p>
    <p>
      <input {...getFieldProps('number', {
        rules: [{transform: toNumber, type: 'number', required: false}],
      })}/>
    </p>
    <p style={errorStyle}>
      {(errors) ? errors.join(',') : null}
    </p>
  </div>);
}

NumberInput.propTypes = {
  form: PropTypes.object,
};

@createForm()
class Form extends Component {
  static propTypes = {
    form: PropTypes.object,
  };

  onSubmit = (e) => {
    console.log('submit');
    e.preventDefault();
    this.props.form.validateFields((error, values)=> {
      if (!error) {
        console.log('ok', values);
      } else {
        console.log('error', error, values);
      }
    });
  };

  reset = (e) => {
    e.preventDefault();
    this.props.form.resetFields();
  };

  render() {
    const {form} = this.props;
    const {getFieldProps} = form;
    return (<div style={{margin: 20}}>
      <h2>overview</h2>
      <form onSubmit={this.onSubmit}>
        <div style={regionStyle}>
          <p>normal input, no validate</p>
          <p>
            <input {...getFieldProps('normal')}/>
          </p>
        </div>

        <NumberInput form={form}/>

        <User form={form}/>

        <Email form={form}/>

        <CustomInput form={form}/>

        <DateInput form={form}/>

        <div style={regionStyle}>
          <button onClick={this.reset}>reset</button>
          &nbsp;
          <input type="submit" value="submit"/>
        </div>
      </form>
    </div>);
  }
}

ReactDOM.render(<Form />, document.getElementById('__react-content'));
<commit_msg>fix toNumber transform<commit_after>/* eslint react/no-multi-comp:0, no-console:0 */

import {createForm} from 'rc-form';
import React, {Component, PropTypes} from 'react';
import ReactDOM from 'react-dom';
import Select, {Option} from 'antd/lib/select';
import DatePicker from 'antd/lib/date-picker';
import 'antd/lib/index.css';
import {regionStyle, errorStyle} from './styles';

function Email(props) {
  const {getFieldProps, getFieldError, isFieldValidating} = props.form;
  const errors = getFieldError('email');
  return (<div style={regionStyle}>
    <p>email sync validate</p>
    <p><input {...getFieldProps('email', {
      rules: [
        {type: 'email', message: '错误的 email 格式'},
      ],
    })}/></p>
    <p style={errorStyle}>
      {errors ? errors.join(',') : null}
    </p>
    <p style={errorStyle}>
      {isFieldValidating('email') ? 'validating' : null}
    </p>
  </div>);
}

Email.propTypes = {
  form: PropTypes.object,
};

const User = React.createClass({
  propTypes: {
    form: PropTypes.object,
  },

  userExists(rule, value, callback) {
    setTimeout(() => {
      if (value === '1') {
        callback([new Error('are you kidding?')]);
      } else if (value === 'yiminghe') {
        callback([new Error('forbid yiminghe')]);
      } else {
        callback();
      }
    }, 300);
  },

  render() {
    const {getFieldProps, getFieldError, isFieldValidating} = this.props.form;
    const errors = getFieldError('user');
    return (<div style={regionStyle}>
      <p>user async validate</p>
      <p><input {...getFieldProps('user', {
        initialValue: 'x',
        rules: [
          {required: true},
          {validator: this.userExists},
        ],
      })}/></p>
      <p style={errorStyle}>
        {(errors) ? errors.join(',') : null}
      </p>
      <p style={errorStyle}>
        {isFieldValidating('user') ? 'validating' : null}
      </p>
    </div>);
  },
});


function CustomInput(props) {
  const {getFieldProps, getFieldError, isFieldValidating} = props.form;
  const errors = getFieldError('select');
  return (<div style={regionStyle}>
    <p>custom select sync validate</p>
    <p><Select placeholder="please select" style={{width: 200}} {...getFieldProps('select', {
      rules: [
        {required: true},
      ],
    })}>
      <Option value="1">1</Option>
      <Option value="2">2</Option>
    </Select></p>
    <p style={errorStyle}>
      {(errors) ? errors.join(',') : null}
    </p>
    <p style={errorStyle}>
      {isFieldValidating('select') ? 'validating' : null}
    </p>
  </div>);
}

CustomInput.propTypes = {
  form: PropTypes.object,
};

function DateInput(props) {
  const {getFieldProps, getFieldError} = props.form;
  const errors = getFieldError('date');
  return (<div style={regionStyle}>
    <p>DateInput sync validate</p>
    <p style={{width: 200}}>
      <DatePicker placeholder="please select" {...getFieldProps('date', {
        rules: [
          {required: true, type: 'date'},
        ],
      })} /></p>
    <p style={errorStyle}>
      {(errors) ? errors.join(',') : null}
    </p>
  </div>);
}

DateInput.propTypes = {
  form: PropTypes.object,
};

function toNumber(v) {
  if (v === '') {
    return undefined;
  }
  if (v && v.trim() === '') {
    return NaN;
  }
  return Number(v);
}

function NumberInput(props) {
  const {getFieldProps, getFieldError} = props.form;
  const errors = getFieldError('number');
  return (<div style={regionStyle}>
    <p>number input</p>
    <p>
      <input {...getFieldProps('number', {
        rules: [{transform: toNumber, type: 'number', required: false}],
      })}/>
    </p>
    <p style={errorStyle}>
      {(errors) ? errors.join(',') : null}
    </p>
  </div>);
}

NumberInput.propTypes = {
  form: PropTypes.object,
};

@createForm()
class Form extends Component {
  static propTypes = {
    form: PropTypes.object,
  };

  onSubmit = (e) => {
    console.log('submit');
    e.preventDefault();
    this.props.form.validateFields((error, values)=> {
      if (!error) {
        console.log('ok', values);
      } else {
        console.log('error', error, values);
      }
    });
  };

  reset = (e) => {
    e.preventDefault();
    this.props.form.resetFields();
  };

  render() {
    const {form} = this.props;
    const {getFieldProps} = form;
    return (<div style={{margin: 20}}>
      <h2>overview</h2>
      <form onSubmit={this.onSubmit}>
        <div style={regionStyle}>
          <p>normal input, no validate</p>
          <p>
            <input {...getFieldProps('normal')}/>
          </p>
        </div>

        <NumberInput form={form}/>

        <User form={form}/>

        <Email form={form}/>

        <CustomInput form={form}/>

        <DateInput form={form}/>

        <div style={regionStyle}>
          <button onClick={this.reset}>reset</button>
          &nbsp;
          <input type="submit" value="submit"/>
        </div>
      </form>
    </div>);
  }
}

ReactDOM.render(<Form />, document.getElementById('__react-content'));

{'fraction_non_alphanumeric': 0.18756228822005183, 'fraction_numerical': 0.003986446083316724, 'mean_word_length': 2.6744782131087512, 'pattern_counts': {'":': 0, '<': 163, '<?xml version=': 0, '>': 171, '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': '1315651', 'n_tokens_mistral': 3341, 'n_tokens_neox': 3284, 'n_words': 701}