# all files / src/ editors.jsx

100% Statements 55/55
100% Branches 20/20
100% Functions 14/14
100% Lines 23/23
2 branches Ignored

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    7×

    7×
    4×

    1×

    1×

    4×

    4×

    7×

    4×
    4×
    1×

    4×

    8×

    4×

    4×

    7×
    4×
    4×
    1×

    4×

    4×

    4×

     /* eslint-disable no-shadow */
    import React from 'react';

    const boolean = ({ props } = {}) => {
      const Boolean = ({ value, onValue }) => (
        <div {...props}>
          <button
            disabled={value}
            onClick={() => onValue(true)}
          >&#10003;
          </button>
          <button
            disabled={!value}
            onClick={() => onValue(false)}
          >&#10007;
          </button>
        </div>
      );
      Boolean.propTypes = {
        value: React.PropTypes.any,
        onClick: React.PropTypes.func,
        onValue: React.PropTypes.func
      };

      return Boolean;
    };

    const dropdown = ({
      options,
      fields = {
        name: 'name',
        value: 'value'
      },
      props
    }) => {
      const Dropdown = ({ value, onValue }) => {
        const edit = ({ target: { value } }) => onValue(value); // eslint-disable-line max-len, no-shadow, react/prop-types

        return (
          <select onBlur={edit} onChange={edit} value={value} {...props}>
            {options.map((option, i) =>
              <option key={i} value={option[fields.value]}>
                {option[fields.name]}
              </option>
            )}
          </select>
        );
      };
      Dropdown.propTypes = {
        value: React.PropTypes.string.isRequired,
        onValue: React.PropTypes.func.isRequired
      };

      return Dropdown;
    };

    const input = ({ props } = {}) => {
      const Input = ({ value, onValue }) => {
        const onKeyUp = ({ key, target: { value } }) => key === 'Enter' && onValue(value);
        const onBlur = ({ target }) => onValue(target.value); // eslint-disable-line react/prop-types

        return <input defaultValue={value} onKeyUp={onKeyUp} onBlur={onBlur} {...props} />;
      };
      Input.propTypes = {
        value: React.PropTypes.string,
        onValue: React.PropTypes.func
      };

      return Input;
    };

    export default {
      boolean,
      dropdown,
      input
    };