useFieldSubscription

[theKashey]

Are you submitting a bug report or a feature request?

Feature request

What is the current behavior?

The current expectation, not a behaviour, is that Field or useField would be used with some "real" DOM element.

• onFocus accepts FocusEvent
• onBlur accepts BlurEvent
• onChange accepts ChangeEvent

That's working for the majority of cases, but not for all. For example, I could have a "composite" input without a fully "DOM-compatible" on change event:

• a credit card from - that's many inputs, which act as one (for the form)
• a "pin input", where every digit is a separate input, but that's no more than a "design" decision, and for the Form it still could be one.
• smart file pickers, which are not able to properly fire onChange event, as long as are controlled by themselves.

What is the expected behavior?

A good solution would be a useFieldSubscription hook (which useField could use underneath), to provide a real "low level" API to the final-form, without all the React and DOM sugar added by this package, but still with a proper initialization.

👉 useFieldSubscription is already written, here it is - https://github.com/final-form/react-final-form/blob/master/src/useField.js#L53-L131 It just has to be extracted to a separate hook.

[erikras]

Surely it would be called useFieldSubscription, right?

What is the shape of what it returns?

[theKashey]

😅 sure it's about field, and the shape is the same as useField, just without "react taste"

export type FieldSubscriptionProps<T=string> = {
  name: string,
  onBlur: () => void,
  onChange: (?T) => void,
  onFocus: () => void,
  value: any,
  type?: string,
  checked?: boolean,
  multiple?: boolean
}
export type FieldSubscriptionRenderProps = {
  input: FieldSubscriptionProps,
  meta: {
    /* is the same */
  }
}

In this case useField could utilise useFieldSubscription and just shadow onChange with the own "event payload unwrapper".