{"size": 1284, "ext": "js", "max_stars_repo_path": "src/components/FormControl/FormControlMultiSelect.js", "max_stars_repo_name": "tuanna1601/ap-frontend", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/FormControl/FormControlMultiSelect.js", "max_issues_repo_name": "tuanna1601/ap-frontend", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/FormControl/FormControlMultiSelect.js", "max_forks_repo_name": "tuanna1601/ap-frontend", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 30.5714285714, "max_line_length": 103, "alphanum_fraction": 0.6191588785}
import React from 'react';
import Select from 'react-select';

const FormControlMultiSelect = (props) => {
  const { id, label, input, hasLabel, meta: { touched, error }, onSelect, allowEmptyArray } = props;
  const formGroupClass = !touched ? 'form-group' : `form-group ${error ? 'has-error' : 'has-success'}`;

  return (
    <div className={formGroupClass}>
      {hasLabel && <label htmlFor={id} className="control-label">{label}</label>}
      <Select
        id={id} {...input} {...props}
        backspaceRemoves={false}
        placeholder={label}
        onChange={(value) => {
          input.onChange(value ? value.map((item) => item.value) : []);
          if (onSelect) {
            onSelect(value);
          }
        }}
        onBlur={() => {
          input.onBlur(input.value.value);
        }}
        multi
      />
      {touched && error && <span className="help-block">{error}</span>}
    </div>
  );
};

FormControlMultiSelect.propTypes = {
  meta: React.PropTypes.object.isRequired,
  id: React.PropTypes.string,
  label: React.PropTypes.string.isRequired,
  input: React.PropTypes.object.isRequired,
  onSelect: React.PropTypes.func,
  options: React.PropTypes.array.isRequired,
  hasLabel: React.PropTypes.bool,
};

export default FormControlMultiSelect;
