You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Wrapper hell — composing multiple HOCs creates deeply nested component trees in React DevTools
Class component internals — withFormsy is implemented as a class component, which is an increasingly rare pattern to maintain
The modern React idiom for sharing stateful logic is a hook. Formsy already exposes FormsyContext internally and all the logic in the HOC could be expressed as a useFormsy hook.
The component is a plain function — no HOC wrapping, no prop injection, full type inference.
Design notes
useFormsy would consume FormsyContext (already exists) to register/deregister the field, sync value, and run validations — mirroring exactly what WithFormsyWrapper does today in the class component
name is passed directly inside the options object, not injected
withFormsy would not be removed — it stays for backward compatibility. useFormsy is an additive, opt-in API
The hook reuses the same validation logic already extracted in utils and validationRules
Motivation
withFormsyis a class-component HOC that predates React hooks. It works, but comes with the friction typical of HOCs:WrapperProps) that is not portably nameable in declaration files (see Export WrapperProps from main entry to fix TS2883 in projects with declaration emit #759)withFormsyis implemented as a class component, which is an increasingly rare pattern to maintainThe modern React idiom for sharing stateful logic is a hook. Formsy already exposes
FormsyContextinternally and all the logic in the HOC could be expressed as auseFormsyhook.Proposed API
The component is a plain function — no HOC wrapping, no prop injection, full type inference.
Design notes
useFormsywould consumeFormsyContext(already exists) to register/deregister the field, sync value, and run validations — mirroring exactly whatWithFormsyWrapperdoes today in the class componentnameis passed directly inside the options object, not injectedwithFormsywould not be removed — it stays for backward compatibility.useFormsyis an additive, opt-in APIutilsandvalidationRulesBackward compatibility
withFormsyis unchangeduseFormsyis a new export — no breaking change