refactor(form): migrate to react hook form

[johnrazeur]

Summary

Type

• Migration
• Refactor

Summarise concisely:

What is expected?

Migrate final-form to react-hook-form.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 9208270

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions]

size-limit report 📦

Path	Size
packages/form/dist/constants.js, packages/form/dist/index.js, packages/icons/dist/index.js, packages/themes/dist/index.js, packages/form/dist/helpers/pickValidators.js, packages/form/dist/hooks/useField.js, packages/form/dist/hooks/useFieldArray.js, packages/form/dist/hooks/useForm.js, packages/form/dist/hooks/useFormField.js, packages/form/dist/hooks/useFormState.js, packages/form/dist/hooks/useOnFieldChange.js, packages/form/dist/hooks/useValidation.js, packages/form/dist/validators/index.js, packages/form/dist/validators/max.js, packages/form/dist/validators/maxDate.js, packages/form/dist/validators/maxLength.js, packages/form/dist/validators/min.js, packages/form/dist/validators/minDate.js, packages/form/dist/validators/minLength.js, packages/form/dist/validators/regex.js, packages/form/dist/validators/required.js, packages/icons/dist/utils/capitalize.js, packages/plus/dist/src/index.js, packages/ui/dist/src/index.js, packages/form/dist/components/CheckboxField/index.js, packages/form/dist/components/CheckboxGroupField/index.js, packages/form/dist/components/DateField/index.js, packages/form/dist/components/Form/defaultErrors.js, packages/form/dist/components/Form/index.js, packages/form/dist/components/FormSpy/index.js, packages/form/dist/components/NumberInputField/index.js, packages/form/dist/components/RadioField/index.js, packages/form/dist/components/RadioGroupField/index.js, packages/form/dist/components/SelectInputField/index.js, packages/form/dist/components/SelectableCardField/index.js, packages/form/dist/components/Submit/index.js, packages/form/dist/components/SubmitErrorAlert/index.js, packages/form/dist/components/TagInputField/index.js, packages/form/dist/components/TextInputField/index.js, packages/form/dist/components/TimeField/index.js, packages/form/dist/components/ToggleField/index.js, packages/form/dist/providers/ErrorContext/index.js, packages/icons/dist/components/CategoryIcon/Icons.js, packages/icons/dist/components/CategoryIcon/index.js, packages/icons/dist/components/Icon/index.js, packages/icons/dist/components/ProductIcon/Icons.js, packages/icons/dist/components/ProductIcon/index.js, packages/themes/dist/themes/console/dark.js, packages/themes/dist/themes/console/darker.js, packages/themes/dist/themes/console/index.js, packages/themes/dist/themes/console/light.js, packages/ui/dist/react-datepicker/dist/react-datepicker.min.css.js, packages/ui/dist/react-toastify/dist/ReactToastify.min.css.js, packages/ui/dist/src/helpers/isJSON.js, packages/ui/dist/src/helpers/legend.js, packages/ui/dist/src/helpers/recursivelyGetChildrenString.js, packages/ui/dist/src/theme/index.js, packages/ui/dist/src/utils/animations.js, packages/ui/dist/src/utils/capitalize.js, packages/ui/dist/src/utils/ids.js, packages/ui/dist/src/utils/normalize.js, packages/plus/dist/src/components/CodeEditor/CodeEditor.js, packages/plus/dist/src/components/ContentCard/Skeleton.js, packages/plus/dist/src/components/ContentCard/index.js, packages/plus/dist/src/components/ContentCardGroup/Card.js, packages/plus/dist/src/components/ContentCardGroup/SkeletonCard.js, packages/plus/dist/src/components/ContentCardGroup/index.js, packages/themes/dist/themes/console/deprecated/dark.js, packages/themes/dist/themes/console/deprecated/darker.js, packages/themes/dist/themes/console/deprecated/light.js, packages/ui/dist/src/components/ActionBar/index.js, packages/ui/dist/src/components/Alert/index.js, packages/ui/dist/src/components/Avatar/index.js, packages/ui/dist/src/components/Badge/index.js, packages/ui/dist/src/components/Banner/index.js, packages/ui/dist/src/components/BarChart/Tooltip.js, packages/ui/dist/src/components/BarChart/index.js, packages/ui/dist/src/components/BarStack/index.js, packages/ui/dist/src/components/Breadcrumbs/index.js, packages/ui/dist/src/components/Bullet/index.js, packages/ui/dist/src/components/Button/index.js, packages/ui/dist/src/components/Card/index.js, packages/ui/dist/src/components/Carousel/index.js, packages/ui/dist/src/components/Checkbox/index.js, packages/ui/dist/src/components/CheckboxGroup/index.js, packages/ui/dist/src/components/CopyButton/index.js, packages/ui/dist/src/components/DateInput/index.js, packages/ui/dist/src/components/EmptyState/index.js, packages/ui/dist/src/components/Expandable/index.js, packages/ui/dist/src/components/LineChart/CustomLegend.js, packages/ui/dist/src/components/LineChart/Tooltip.js, packages/ui/dist/src/components/LineChart/helpers.js, packages/ui/dist/src/components/LineChart/index.js, packages/ui/dist/src/components/Link/index.js, packages/ui/dist/src/components/List/Body.js, packages/ui/dist/src/components/List/Cell.js, packages/ui/dist/src/components/List/HeaderCell.js, packages/ui/dist/src/components/List/HeaderRow.js, packages/ui/dist/src/components/List/ListContext.js, packages/ui/dist/src/components/List/Row.js, packages/ui/dist/src/components/List/SelectBar.js, packages/ui/dist/src/components/List/SkeletonRows.js, packages/ui/dist/src/components/List/constants.js, packages/ui/dist/src/components/List/index.js, packages/ui/dist/src/components/Loader/index.js, packages/ui/dist/src/components/Menu/Item.js, packages/ui/dist/src/components/Menu/index.js, packages/ui/dist/src/components/MenuV2/Item.js, packages/ui/dist/src/components/MenuV2/index.js, packages/ui/dist/src/components/Meter/index.js, packages/ui/dist/src/components/Modal/Dialog.js, packages/ui/dist/src/components/Modal/Disclosure.js, packages/ui/dist/src/components/Modal/constants.js, packages/ui/dist/src/components/Modal/index.js, packages/ui/dist/src/components/Notice/index.js, packages/ui/dist/src/components/NumberInput/helpers.js, packages/ui/dist/src/components/NumberInput/index.js, packages/ui/dist/src/components/Pagination/getPageNumbers.js, packages/ui/dist/src/components/Pagination/index.js, packages/ui/dist/src/components/PasswordCheck/index.js, packages/ui/dist/src/components/PasswordStrengthMeter/index.js, packages/ui/dist/src/components/PieChart/Legends.js, packages/ui/dist/src/components/PieChart/Tooltip.js, packages/ui/dist/src/components/PieChart/index.js, packages/ui/dist/src/components/Popover/index.js, packages/ui/dist/src/components/Popup/helpers.js, packages/ui/dist/src/components/Popup/index.js, packages/ui/dist/src/components/ProgressBar/index.js, packages/ui/dist/src/components/Radio/index.js, packages/ui/dist/src/components/RadioGroup/index.js, packages/ui/dist/src/components/Row/index.js, packages/ui/dist/src/components/SelectInput/index.js, packages/ui/dist/src/components/SelectableCard/index.js, packages/ui/dist/src/components/Separator/index.js, packages/ui/dist/src/components/Skeleton/Block.js, packages/ui/dist/src/components/Skeleton/Blocks.js, packages/ui/dist/src/components/Skeleton/BoxWithIcon.js, packages/ui/dist/src/components/Skeleton/Donut.js, packages/ui/dist/src/components/Skeleton/IconSkeleton.js, packages/ui/dist/src/components/Skeleton/Line.js, packages/ui/dist/src/components/Skeleton/List.js, packages/ui/dist/src/components/Skeleton/Slider.js, packages/ui/dist/src/components/Skeleton/Square.js, packages/ui/dist/src/components/Skeleton/index.js, packages/ui/dist/src/components/Snippet/index.js, packages/ui/dist/src/components/Stack/index.js, packages/ui/dist/src/components/Status/index.js, packages/ui/dist/src/components/StepList/index.js, packages/ui/dist/src/components/Stepper/index.js, packages/ui/dist/src/components/SwitchButton/FocusOverlay.js, packages/ui/dist/src/components/SwitchButton/index.js, packages/ui/dist/src/components/Table/Body.js, packages/ui/dist/src/components/Table/Cell.js, packages/ui/dist/src/components/Table/Header.js, packages/ui/dist/src/components/Table/HeaderCell.js, packages/ui/dist/src/components/Table/HeaderRow.js, packages/ui/dist/src/components/Table/Row.js, packages/ui/dist/src/components/Table/SelectBar.js, packages/ui/dist/src/components/Table/SkeletonRows.js, packages/ui/dist/src/components/Table/TableContext.js, packages/ui/dist/src/components/Table/index.js, packages/ui/dist/src/components/Tabs/Tab.js, packages/ui/dist/src/components/Tabs/TabMenu.js, packages/ui/dist/src/components/Tabs/TabMenuItem.js, packages/ui/dist/src/components/Tabs/TabsContext.js, packages/ui/dist/src/components/Tabs/index.js, packages/ui/dist/src/components/Tag/index.js, packages/ui/dist/src/components/TagInput/index.js, packages/ui/dist/src/components/TagList/index.js, packages/ui/dist/src/components/Text/index.js, packages/ui/dist/src/components/TextInput/index.js, packages/ui/dist/src/components/TimeInput/index.js, packages/ui/dist/src/components/Toaster/index.js, packages/ui/dist/src/components/Toggle/index.js, packages/ui/dist/src/components/ToggleGroup/index.js, packages/ui/dist/src/components/Tooltip/index.js, packages/ui/dist/src/components/VerificationCode/index.js, packages/ui/dist/src/utils/responsive/Breakpoint.js, packages/ui/dist/src/utils/responsive/utilities.js, packages/plus/dist/@ultraviolet/icons/dist/utils/capitalize.js, packages/ui/dist/src/components/Banner/assets/default-image-small.svg.js, packages/ui/dist/src/components/Banner/assets/default-image.svg.js, packages/ui/dist/src/components/Banner/assets/intro-compact-left-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/intro-compact-right-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/intro-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/promotion-compact-left-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/promotion-compact-right-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/promotion-pattern.svg.js, packages/plus/dist/@ultraviolet/icons/dist/components/Icon/index.js	0 B (-100% 🔽)
packages/form/dist/constants.js, packages/form/dist/index.js, packages/icons/dist/index.js, packages/themes/dist/index.js, packages/form/dist/hooks/useField.js, packages/form/dist/hooks/useFieldArray.js, packages/form/dist/hooks/useForm.js, packages/form/dist/hooks/useFormState.js, packages/form/dist/hooks/useOnFieldChange.js, packages/form/dist/validators/maxDate.js, packages/form/dist/validators/minDate.js, packages/icons/dist/utils/capitalize.js, packages/plus/dist/src/index.js, packages/ui/dist/src/index.js, packages/form/dist/components/CheckboxField/index.js, packages/form/dist/components/CheckboxGroupField/index.js, packages/form/dist/components/DateField/index.js, packages/form/dist/components/Form/defaultErrors.js, packages/form/dist/components/Form/index.js, packages/form/dist/components/FormSpy/index.js, packages/form/dist/components/NumberInputField/index.js, packages/form/dist/components/RadioField/index.js, packages/form/dist/components/RadioGroupField/index.js, packages/form/dist/components/SelectInputField/index.js, packages/form/dist/components/SelectableCardField/index.js, packages/form/dist/components/Submit/index.js, packages/form/dist/components/SubmitErrorAlert/index.js, packages/form/dist/components/TagInputField/index.js, packages/form/dist/components/TextInputField/index.js, packages/form/dist/components/TimeField/index.js, packages/form/dist/components/ToggleField/index.js, packages/form/dist/providers/ErrorContext/index.js, packages/icons/dist/components/CategoryIcon/Icons.js, packages/icons/dist/components/CategoryIcon/index.js, packages/icons/dist/components/Icon/index.js, packages/icons/dist/components/ProductIcon/Icons.js, packages/icons/dist/components/ProductIcon/index.js, packages/themes/dist/themes/console/dark.js, packages/themes/dist/themes/console/darker.js, packages/themes/dist/themes/console/index.js, packages/themes/dist/themes/console/light.js, packages/ui/dist/react-datepicker/dist/react-datepicker.min.css.js, packages/ui/dist/react-toastify/dist/ReactToastify.min.css.js, packages/ui/dist/src/helpers/isJSON.js, packages/ui/dist/src/helpers/legend.js, packages/ui/dist/src/helpers/recursivelyGetChildrenString.js, packages/ui/dist/src/theme/index.js, packages/ui/dist/src/utils/animations.js, packages/ui/dist/src/utils/capitalize.js, packages/ui/dist/src/utils/ids.js, packages/ui/dist/src/utils/normalize.js, packages/plus/dist/src/components/CodeEditor/CodeEditor.js, packages/plus/dist/src/components/ContentCard/Skeleton.js, packages/plus/dist/src/components/ContentCard/index.js, packages/plus/dist/src/components/ContentCardGroup/Card.js, packages/plus/dist/src/components/ContentCardGroup/SkeletonCard.js, packages/plus/dist/src/components/ContentCardGroup/index.js, packages/themes/dist/themes/console/deprecated/dark.js, packages/themes/dist/themes/console/deprecated/darker.js, packages/themes/dist/themes/console/deprecated/light.js, packages/ui/dist/src/components/ActionBar/index.js, packages/ui/dist/src/components/Alert/index.js, packages/ui/dist/src/components/Avatar/index.js, packages/ui/dist/src/components/Badge/index.js, packages/ui/dist/src/components/Banner/index.js, packages/ui/dist/src/components/BarChart/Tooltip.js, packages/ui/dist/src/components/BarChart/index.js, packages/ui/dist/src/components/BarStack/index.js, packages/ui/dist/src/components/Breadcrumbs/index.js, packages/ui/dist/src/components/Bullet/index.js, packages/ui/dist/src/components/Button/index.js, packages/ui/dist/src/components/Card/index.js, packages/ui/dist/src/components/Carousel/index.js, packages/ui/dist/src/components/Checkbox/index.js, packages/ui/dist/src/components/CheckboxGroup/index.js, packages/ui/dist/src/components/CopyButton/index.js, packages/ui/dist/src/components/DateInput/index.js, packages/ui/dist/src/components/EmptyState/index.js, packages/ui/dist/src/components/Expandable/index.js, packages/ui/dist/src/components/LineChart/CustomLegend.js, packages/ui/dist/src/components/LineChart/Tooltip.js, packages/ui/dist/src/components/LineChart/helpers.js, packages/ui/dist/src/components/LineChart/index.js, packages/ui/dist/src/components/Link/index.js, packages/ui/dist/src/components/List/Body.js, packages/ui/dist/src/components/List/Cell.js, packages/ui/dist/src/components/List/HeaderCell.js, packages/ui/dist/src/components/List/HeaderRow.js, packages/ui/dist/src/components/List/ListContext.js, packages/ui/dist/src/components/List/Row.js, packages/ui/dist/src/components/List/SelectBar.js, packages/ui/dist/src/components/List/SkeletonRows.js, packages/ui/dist/src/components/List/constants.js, packages/ui/dist/src/components/List/index.js, packages/ui/dist/src/components/Loader/index.js, packages/ui/dist/src/components/Menu/Item.js, packages/ui/dist/src/components/Menu/index.js, packages/ui/dist/src/components/MenuV2/Item.js, packages/ui/dist/src/components/MenuV2/index.js, packages/ui/dist/src/components/Meter/index.js, packages/ui/dist/src/components/Modal/Dialog.js, packages/ui/dist/src/components/Modal/Disclosure.js, packages/ui/dist/src/components/Modal/constants.js, packages/ui/dist/src/components/Modal/index.js, packages/ui/dist/src/components/Notice/index.js, packages/ui/dist/src/components/NumberInput/helpers.js, packages/ui/dist/src/components/NumberInput/index.js, packages/ui/dist/src/components/Pagination/getPageNumbers.js, packages/ui/dist/src/components/Pagination/index.js, packages/ui/dist/src/components/PasswordCheck/index.js, packages/ui/dist/src/components/PasswordStrengthMeter/index.js, packages/ui/dist/src/components/PieChart/Legends.js, packages/ui/dist/src/components/PieChart/Tooltip.js, packages/ui/dist/src/components/PieChart/index.js, packages/ui/dist/src/components/Popover/index.js, packages/ui/dist/src/components/Popup/helpers.js, packages/ui/dist/src/components/Popup/index.js, packages/ui/dist/src/components/ProgressBar/index.js, packages/ui/dist/src/components/Radio/index.js, packages/ui/dist/src/components/RadioGroup/index.js, packages/ui/dist/src/components/Row/index.js, packages/ui/dist/src/components/SelectInput/index.js, packages/ui/dist/src/components/SelectableCard/index.js, packages/ui/dist/src/components/Separator/index.js, packages/ui/dist/src/components/Skeleton/Block.js, packages/ui/dist/src/components/Skeleton/Blocks.js, packages/ui/dist/src/components/Skeleton/BoxWithIcon.js, packages/ui/dist/src/components/Skeleton/Donut.js, packages/ui/dist/src/components/Skeleton/IconSkeleton.js, packages/ui/dist/src/components/Skeleton/Line.js, packages/ui/dist/src/components/Skeleton/List.js, packages/ui/dist/src/components/Skeleton/Slider.js, packages/ui/dist/src/components/Skeleton/Square.js, packages/ui/dist/src/components/Skeleton/index.js, packages/ui/dist/src/components/Snippet/index.js, packages/ui/dist/src/components/Stack/index.js, packages/ui/dist/src/components/Status/index.js, packages/ui/dist/src/components/StepList/index.js, packages/ui/dist/src/components/Stepper/index.js, packages/ui/dist/src/components/SwitchButton/FocusOverlay.js, packages/ui/dist/src/components/SwitchButton/index.js, packages/ui/dist/src/components/Table/Body.js, packages/ui/dist/src/components/Table/Cell.js, packages/ui/dist/src/components/Table/Header.js, packages/ui/dist/src/components/Table/HeaderCell.js, packages/ui/dist/src/components/Table/HeaderRow.js, packages/ui/dist/src/components/Table/Row.js, packages/ui/dist/src/components/Table/SelectBar.js, packages/ui/dist/src/components/Table/SkeletonRows.js, packages/ui/dist/src/components/Table/TableContext.js, packages/ui/dist/src/components/Table/index.js, packages/ui/dist/src/components/Tabs/Tab.js, packages/ui/dist/src/components/Tabs/TabMenu.js, packages/ui/dist/src/components/Tabs/TabMenuItem.js, packages/ui/dist/src/components/Tabs/TabsContext.js, packages/ui/dist/src/components/Tabs/index.js, packages/ui/dist/src/components/Tag/index.js, packages/ui/dist/src/components/TagInput/index.js, packages/ui/dist/src/components/TagList/index.js, packages/ui/dist/src/components/Text/index.js, packages/ui/dist/src/components/TextInput/index.js, packages/ui/dist/src/components/TimeInput/index.js, packages/ui/dist/src/components/Toaster/index.js, packages/ui/dist/src/components/Toggle/index.js, packages/ui/dist/src/components/ToggleGroup/index.js, packages/ui/dist/src/components/Tooltip/index.js, packages/ui/dist/src/components/VerificationCode/index.js, packages/ui/dist/src/utils/responsive/Breakpoint.js, packages/ui/dist/src/utils/responsive/utilities.js, packages/plus/dist/@ultraviolet/icons/dist/utils/capitalize.js, packages/ui/dist/src/components/Banner/assets/default-image-small.svg.js, packages/ui/dist/src/components/Banner/assets/default-image.svg.js, packages/ui/dist/src/components/Banner/assets/intro-compact-left-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/intro-compact-right-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/intro-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/promotion-compact-left-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/promotion-compact-right-pattern.svg.js, packages/ui/dist/src/components/Banner/assets/promotion-pattern.svg.js, packages/plus/dist/@ultraviolet/icons/dist/components/Icon/index.js	220.35 KB (+100% 🔺)

[codecov]

Codecov Report

Merging #2994 (9208270) into main (9047104) will decrease coverage by 0.96%.
Report is 1 commits behind head on main.
The diff coverage is 73.84%.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #2994      +/-   ##
==========================================
- Coverage   94.24%   93.28%   -0.96%     
==========================================
  Files         162      160       -2     
  Lines        3421     3412       -9     
  Branches      444      431      -13     
==========================================
- Hits         3224     3183      -41     
- Misses        128      161      +33     
+ Partials       69       68       -1     

Files	Coverage Δ
...ckages/form/src/components/CheckboxField/index.tsx	100.00% <100.00%> (ø)
...s/form/src/components/CheckboxGroupField/index.tsx	100.00% <100.00%> (ø)
...ges/form/src/components/NumberInputField/index.tsx	100.00% <100.00%> (ø)
packages/form/src/components/RadioField/index.tsx	100.00% <100.00%> (ø)
...ages/form/src/components/RadioGroupField/index.tsx	100.00% <100.00%> (ø)
...ges/form/src/components/SelectInputField/index.tsx	92.10% <100.00%> (-0.58%)	⬇️
.../form/src/components/SelectableCardField/index.tsx	100.00% <100.00%> (ø)
packages/form/src/components/Submit/index.tsx	100.00% <100.00%> (ø)
...ges/form/src/components/SubmitErrorAlert/index.tsx	100.00% <100.00%> (ø)
...ckages/form/src/components/TagInputField/index.tsx	100.00% <100.00%> (ø)
... and 19 more

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 9047104...9208270. Read the comment docs.