In Forms errorClassName overwrites all existing classes

Get Help and Help Others
1

Using errorClassName in a Form removes all existing className assignments in TextField etc. It would be nice if there was a way to just toggle on/off the classes added via errorClassName.

2

As I was creating that I was thinking "what happens if you want to remove a class defined with className" so I settled on just replacing the whole set of classes when there’s an error.

How would you envision being able to turn some classNames off using just errorClassName?

3

I could see both being useful, but especially with Tailwind I often just want to throw a few red classes onto my existing classes. What about another attribute called errorToggleClassName or some similar concept?

1 Like
4

To me, the case for removing a class seems less frequent. And can be dealt with a class override if necessary.

Also, removing all classes prevent integration with Chakra from working properly, as all Chakra classes are removed on error.

  <Input
    as={TextField}
    name="name"
    validation={{ required: true }}
    errorClassName="error"
  />