flipbyte / formik-json-schema

Easily create react forms using JSON / Javascript Object
MIT License
152 stars 40 forks source link

Pass more props to FieldTemplate? #37

Closed compojoom closed 5 years ago

compojoom commented 5 years ago

I wanted to add an error class to the outputted label in order to style it red when the validation fails, but it turns out that it is not that trivial.

in src/Renderer.js we do: type === FIELD ? <Field name={ name } render={({ field: { value }}) => ( <Template disabled={ !match(enabledWhen, values) } { ...config }> { renderElement({ config, formik, value, error }) } )} /> : renderElement({ config, formik })

we pass value and error to the renderElement, but we don't pass those to the template? So the fieldTemplate is not able to to pass an error to the label.

We could change the Label renderer component to be more similar to the errorMessage renderer, but I think that maybe it would be easier if we just pass value and error to fieldTemplate and let it decide what it wants to pass to the components down the tree.

Thoughts?

easeq commented 5 years ago

Passing those values to the Template is a good idea, but the FieldTemplate also needs to be modified to include 2 sets of label classes (one without error and one with). This might be a good thing to add to the template instead of having to create a custom field template to handle labels with error.

Can you create a PR for this?