Replace components with renderer package #798
Conversation
Bundle ReportChanges will increase total bundle size by 24.22kB (0.25%) ⬆️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: @open-formulieren/sdk-esmAssets Changed:
Files in
Files in
view changes for bundle: @open-formulieren/sdk-OpenForms-umdAssets Changed:
Files in
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #798 +/- ##
==========================================
- Coverage 83.99% 83.37% -0.63%
==========================================
Files 246 233 -13
Lines 4817 4607 -210
Branches 1275 1187 -88
==========================================
- Hits 4046 3841 -205
+ Misses 742 736 -6
- Partials 29 30 +1
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Sentry. |
Individual component CSS and tweaks have been ported to the stylesheet shipped with the formio-renderer package. These should be identical.
sergei-maertens
force-pushed
the
experiment/replace-formio-in-appointments
branch
from
80bccf0 to
22268a8
Compare
This is being replaced with our own renderer.
This way we can catch visual regressions on existing stories. Eventually, the stories can be removed.
Because we now rely on subpackages installed via npm which also include translations strings, message compilation is now a shell script taking those locations into account. This setup is identical to to open-forms backend + formio-builder package.
This now uses the FormioForm component from the library, simplifying the code required here. Some bits and pieces are still missing: * existing values are not passed in as submission values/data * date errors and touched state is not going right * phone number has an invalite pattern for validation (HTML error) * the initial errors prop is now not passed to be able to display backend errors
And remove our own implementation.
It has been replaced with the component from @open-formulieren/formio-renderer
This addressed some shortcomings that we need for the appointments flow.
sergei-maertens
force-pushed
the
experiment/replace-formio-in-appointments
branch
from
97230bf to
6363668
Compare
…mponents This code would otherwise be duplicated. The raw React components still require migrating to the formio-renderer package, so those usages will also disappear over time.
The datepicker/calendar variant is not ported yet and will follow later, but the input group code can be removed since it has been implemented in the renderer package already.
sergei-maertens
force-pushed
the
experiment/replace-formio-in-appointments
branch
from
57feb54 to
c2b5722
Compare
Part of #445
Trying out @open-formulieren/formio-renderer, checking for visual regressions.
EmailFieldcomponent withTextField type="email"TextFieldfrom package instead of our ownRadioFieldfrom package instead of our ownTODO:
DateFieldusage where the inputgroup widget is usedLabel,LabelContent,HelpText,ValidationErrors...)To decide:
validate on blur has the annoying side effect that backend validation errors dissapear once the field gets focused, so it's probably wise to only validate on submit 🤔