Using react-semantic-ui-datepicker with formik-semantic-ui-react

[phurichpusapanich]

Hello,

I am working on a form project using react-semantic-date-picker with formik-semantic-ui-react + yup validation.

I notice that, when i use the Form component from formik-semantic-ui-react to wrap SemanticDatePicker, the error style for SemanticDatePicker is not fully shown. From this sandbox, I learn that I can use html form to solve this problem but I will be losing the styles I get from Form

You can have a look here for my implementation.

In there, you can see that the error only apply to the font but not the entire Input.

Would there be any alternatives to this?

Thanks,

[github-actions]

🎉 This issue has been resolved in version 2.15.1 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[arthurdenner]

Hi @phurichpusapanich-itsmy! 👋🏽

Thank you very much for reporting this!
There's nothing wrong with your code.

I did some debugging here and noticed that the error must be passed to Form.Field when Form is used.
This applies to semantic-ui-react as well, it's something I missed 😢

It has been fixed in #708 and released on 2.15.1.
I forked your sandbox and updated to 2.15.1.

It works as expected now: link
Thank you very much again!

[phurichpusapanich]

Hi @arthurdenner

Thank you for the fast response and fix.

I have upgraded semantic-ui-react-datepickers to the most recent one (2.15.2) and have confirmed that the problem has been fixed.

Thanks!