I am facing a problem with my formik fields and need to use FastFields in some situations and Fields in others. Therefor my FormikControl, a class for building formik inputs needs to switch between and as wrappers. I am not sure how to do this. Here is part of the class:

const FormikControl = (props) => {
  const {
    name,
    type,
    label,
    disabled,
    fullWidth,
    isDynamic, // Field (true) or FastField
  } = props;
  const classes = useStyles();

  const inputProps = {};

  switch (type) {
    case 'text':
      return (
        <>
          <ComplexField name={name} isDynamic={isDynamic} {...props}> // meant to be the wrapper that switches
            {({ field }) => {
              return (
                <TextField
                  {...field}
                  variant="standard"
                  label={label}
                  fullWidth={fullWidth}
                  disabled={disabled}
                  InputLabelProps={{
                    shrink: true,
                  }}
                  InputProps={inputProps}
                  value={field.value || ''}
                />
              );
            }}
          </ComplexField>
          <ErrorMessage error name={name} component={FormHelperText} />
        </>
      ); 

ComplexField is meant to be the flexable wrapper and needs be able to switch between Field and FastField based on "isDynamic". My best try was this:

const ComplexField = ({ name, children, isDynamic, ...props }) => {
  return isDynamic ? (
    <Field name={name} props={props}>{({ field }) => children({ ...props, field })}</Field>
  ) : (
    <FastField name={name} props={props}>{({ field }) => children({ ...props, field })}</FastField>
  );
};

Didn't work :(