Forms

[jackcmeyer]

🚀 Feature Proposal

Add forms to the component library.

Forms should have:

• [ ] form builder: outputs a jsonschema, including validation and field types
• [ ] auto building forms from a jsonschema
• [ ] auto validating on predefined input types; function on custom input types

Motivation

Forms are used to enter information.

Example

Creating a new patient.

Relevant Links

• (formik)[https://bundlephobia.com/result?p=formik@1.5.8]

[ben-m-j-taylor]

Hi, I'd be interested in picking this issue up!

I'm just wondering if it might be worth separating the Form and FormBuilder components into their respective issues? As they seem like two very distinct components and chunks of work :)

If not I’m perfectly happy to do both as part of this issue :)

[matteovivona]

@irvelervel what do you think?

[irvelervel]

Hello everyone. I already did a pretty significant amount of work tooling a form generator system in the past, complete with autobuilding-from-schema features; the only problem is that I built it upon redux-form (https://github.com/redux-form/redux-form) which now seems to be much less relevant than it was at the time. Me and the rest of the core team agree that formik (https://github.com/jaredpalmer/formik) is a strong base to build upon right now. @B-Taylor123 I didn't intended those (the form and the formbuilder) as two separate components :) once the form-generator system is build up, you can pass a configuration to it a that renders a form which outputs the values selected as a valid json schema; then, this json schema could be passed again to our form-generation system to create the desired form.

[ben-m-j-taylor]

Ahhh, thanks for clearing that up @irvelervel :) I’d still like to pick this task up if that’s cool with everyone?

[irvelervel]

@B-Taylor123 really sorry for the late response. I apologize but I realized I want to take some time to inspect my old code and check all the features implemented at the time in order to have a clearer picture of the code portions we need to write from scratch. We are probably going to have an open talk about this: we'll be glad if you can be a part of it. Stay tuned ;)

[ocBruno]

Not sure if this has already been discussed and decided upon but if not I am also interested in helping out with this form builder if any help is needed. I was taking a look at react-final-form as a substitute for formik as its smaller, only has the final-form dependency which itself has zero dependencies. It might have all the needed functionalities and serve as a better substitute for the form component but i'm not certain. If anyone with a better grasp wants to check it out and give there opinion here is the project link! https://github.com/final-form/react-final-form I am more than willing to read into final-form and react-final-form if needed for the form constructor and even begin the boilerplate code to help start it up.

[fox1t]

Hi @ocBruno, we analyze almost everyone form component and we decided to go with Formik. We like its philosophy and flexibility. We will try to use it as first choice and if it won't work for our needs we can re-evaluate react-final-form. As usual, every contribution is welcomed! Thanks :)

[satishbabariya]

Hello @fox1t, these three libraries will be helpful for the reference implementation.

Drag and Drop UI for Form Which Generates JSON at the end https://github.com/surveyjs/survey-creator

Form Library that consumes JSON and display form https://github.com/surveyjs/survey-library

and this one doesn't for creation UI but has JSON to Form implementation. https://github.com/rjsf-team/react-jsonschema-form

[toniton]

Hi guys, I'm a bit late to the party, but I think https://react-hook-form.com/ is a much better library than Formik IMO. It was built on react hooks concept, and pretty intuitive to implement. Does anyone know how much work has been done? As I would like to contribute to this issue.

[cpondoc]

Hi, @blestab @fox1t @tehKapa @jackcmeyer -- would love to take this on if no one is working on it!