FormCol.js

import React from 'react';
import PropTypes from 'prop-types';
import {FlexCol} from 'pivotal-ui/react/flex-grids';
import {FormUnit} from 'pivotal-ui/react/forms';
import classnames from 'classnames';

export class FormCol extends React.Component {
  static propTypes = {
    state: PropTypes.object,
    canSubmit: PropTypes.func,
    onSubmit: PropTypes.func,
    canReset: PropTypes.func,
    reset: PropTypes.func,
    hidden: PropTypes.bool,
    fixed: PropTypes.bool,
    colProps: PropTypes.object,
    setValues: PropTypes.func
  };

  static defaultProps = {state: {}, colProps: {}};

  render() {
    const {state, canSubmit, onSubmit, canReset, reset, fixed, children, hidden, className, id, setValues, colProps} = this.props;
    let child = typeof children === 'function'
      ? children({canSubmit, canReset, setValues, reset, onSubmit, submitting: state.submitting, state})
      : children;

    if (!colProps.name) {
      // eslint-disable-next-line no-unused-vars
      const {className: _, ...rest} = colProps;
      child = (
        <FormUnit {...{
          // retainLabelHeight,
          hasError: state.errors && !!state.errors[colProps.name],
          // labelFor: htmlFor,
          state,
          ...rest,
          children: child
          // help: (state.errors && state.errors[name]) || help
        }}/>
      );
    }

    return (
      <FlexCol {...{className: classnames(className, 'form-col', {'col-fixed': fixed}), id, hidden}}>
        {child}
      </FlexCol>
    );
  }
}