FormControl.tsx 1.09 KB
Newer Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
import * as React from 'react';
import { withStyles } from 'material-ui/styles';

import InputLabel from 'material-ui/Input/InputLabel';
import MuiFormControl from 'material-ui/Form/FormControl';

interface IProps {
  classes?: any;
  fullWidth?: boolean;
  required?: boolean;
  label?: string;
  children: any;
  meta?: any;
}

const styles = (theme) => {
  console.log(theme);
  return ({
Matija Obreza's avatar
Matija Obreza committed
19
20
    helper: {
      paddingTop: '0.5rem',
21
22
23
24
25
26
27
      color: theme.palette.error.A400,
    },
  });
};

const FormControl = ({ fullWidth = false, required = false, label = null, children, meta = {}, classes }: IProps) => {
  // console.log('Meta', meta);
Matija Obreza's avatar
Matija Obreza committed
28
  const { error, warning } = meta;
29
30
31

  return (
    <MuiFormControl fullWidth={ fullWidth }>
Matija Obreza's avatar
Matija Obreza committed
32
        { label && <InputLabel error={ error && true } required={ required }>{ label }</InputLabel> }
33
34
        { children }
        {
Matija Obreza's avatar
Matija Obreza committed
35
36
37
          ((error && <div className={ classes.helper }>{ error }</div>)
          ||
          (warning && <div className={ classes.helper }>{ warning }</div>))
38
39
40
41
42
43
        }
    </MuiFormControl>
  );
};

export default withStyles(styles)(FormControl);