Maximum Update Depth on setState

### Are you submitting a **bug report** or a **feature request**?

Possilbe bug. Or I'm missing something obvious.

### What is the current behavior?

Building a Field as a function component inside a function component causes the component to keep setting setState until it dies.

For some reason `!shallowEqual(s, stateRef.current)` keeps returning false which tries to set a new new form state. But locally I can't see where the differences are.

### What is the expected behavior?

Render the component without error.

### Sandbox Link

I've adapted one of the official examples to reflect this behavior:
https://codesandbox.io/s/max-depth-exceeded-reusable-field-groups-p33os

And here is the same with returning Field as top level of that component, working as expected:
https://codesandbox.io/s/max-depth-exceeded-working-reusable-field-groups-pxc97

### What's your environment?

"react": "^16.9.0"
"react-final-form": "^6.3.0"
"final-form": "^4.18.3"

### Other information

I might be missing something in how I use Final Form (do Fields need to always be top level return values?)

Here is an attempt to log what is happening inside the subscription useEffect:

```
console.log node_modules/react-final-form/dist/react-final-form.cjs.js:185
------ shallowEqual false

console.log node_modules/react-final-form/dist/react-final-form.cjs.js:183
------ stateRef.current { active: undefined,
dirty: false,
dirtyFields: {},
dirtySinceLastSubmit: false,
error: undefined,
errors: {},
hasSubmitErrors: false,
hasValidationErrors: false,
initialValues: undefined,
invalid: false,
modified: { firstName: false },
pristine: true,
submitting: false,
submitError: undefined,
submitErrors: undefined,
submitFailed: false,
submitSucceeded: false,
touched: { firstName: false },
valid: true,
validating: false,
values: {},
visited: { firstName: false } }

console.log node_modules/react-final-form/dist/react-final-form.cjs.js:184
------ subscription { active: undefined,
dirty: false,
dirtyFields: {},
dirtySinceLastSubmit: false,
error: undefined,
errors: {},
hasSubmitErrors: false,
hasValidationErrors: false,
initialValues: undefined,
invalid: false,
modified: {},
pristine: true,
submitting: false,
submitError: undefined,
submitErrors: undefined,
submitFailed: false,
submitSucceeded: false,
touched: {},
valid: true,
validating: false,
values: {},
visited: {} }

console.log node_modules/react-final-form/dist/react-final-form.cjs.js:185
------ shallowEqual false

console.log node_modules/react-final-form/dist/react-final-form.cjs.js:183
------ stateRef.current { active: undefined,
dirty: false,
dirtyFields: {},
dirtySinceLastSubmit: false,
error: undefined,
errors: {},
hasSubmitErrors: false,
hasValidationErrors: false,
initialValues: undefined,
invalid: false,
modified: { firstName: false },
pristine: true,
submitting: false,
submitError: undefined,
submitErrors: undefined,
submitFailed: false,
submitSucceeded: false,
touched: { firstName: false },
valid: true,
validating: false,
values: {},
visited: { firstName: false } }

console.log node_modules/react-final-form/dist/react-final-form.cjs.js:184
------ subscription { active: undefined,
dirty: false,
dirtyFields: {},
dirtySinceLastSubmit: false,
error: undefined,
errors: {},
hasSubmitErrors: false,
hasValidationErrors: false,
initialValues: undefined,
invalid: false,
modified: { firstName: false },
pristine: true,
submitting: false,
submitError: undefined,
submitErrors: undefined,
submitFailed: false,
submitSucceeded: false,
touched: { firstName: false },
valid: true,
validating: false,
values: {},
visited: { firstName: false } }
```