Create Form library

[realityforge]

React4j does not have a form library and as a result the forms written are complex, error-prone and generate significant amounts of javascript. A better approach is to build a comprehensive form library. This would ultimately result in smaller faster, smaller, more correct code.

Before starting on this library we should review existing react projects such as formik and mobx-react-form. However the best inspiration that I am aware of comes form Angular's form library. We could probably take the design elements and features from this library and use it as the basis of a new react4j lib.

The most likely design is to include arez based model classes and pair each model component with an associated react4j component.

The view components either create and own the model elements and will dispose the model elements when they are unmounted or have elements handed to them and will just use them. If the component owns the model then it will try to register with parent which it will either determine via a prop or via Context/TreeLocal variable

Model elements would include:

• AbstractControl - A base class for other elements.
• FormControl - An individual input. Usually with local name.
• FormGroup - A container for AbstractControl instances.
• FormArray - A list of controls. Creates a new namespace but has all the same type of controls.

We could also include features from other form libraries like the "active" property from react-redux-form that indicates whether control currently is currently focused (or group has control currently focused)

Validations are also modelled the same way with view/model split so can easily render errors from react components but they are backed by model.

Autogenerate forms from DSL

Auto-generating forms from a descriptor. This is super useful and could pretty much be the way we do it for a metadata machine. The descriptor could be a json object or compiled binary format (See embers view engine for inspiration).

A comprehensive library for this is mson:

• https://medium.freecodecamp.org/how-to-autogenerate-forms-in-react-and-material-ui-with-mson-5771b1b7e739
• https://hackernoon.com/creating-a-new-programming-language-that-will-allow-anyone-to-make-software-7a8c73238dc2

This would likely be built on the above abstractions.

[realityforge]

Another really interesting library is react-hook-form

[realityforge]

Another perhaps more interesting and more applicable library is final-form

[realityforge]

A good overview of modern (2020) form libraries; The ultimate roundup of React form validation solutions