One potential issue with what I describe here is that it leaves the decision on when to show an error message up to the UI library:

<ValidationWrapper>
    {touched && warning &&
      <div>
        {warning}
      </div>}
    {touched && error &&
      <div>
        {error}
      </div>}
  </ValidationWrapper>

penx/pcp-form-example

This is arguably a functional choice that you may want to leave up to the parent application to decide.

e.g. govuk guidelines contain the following, which conflicts with the normal behaviour of final-form:

Only display an error when someone tries to move to the next part of the service. Do not show error messages…when they move away from a field

https://design-system.service.gov.uk/components/error-message/