fix(forms): check if value is null before rendering input controls

Author: assisrafael

demo/FormExamples.jsx

@@ -21,6 +21,7 @@ export function FormExamples() {
         switchField2: true,
         checkboxField2: true,
         radioField2: 'b',
+        numberField: null,
         dateField: new Date().toISOString(),
       }}
       onChange={console.info}

src/forms/helpers/useFormControl.js

@@ -1,6 +1,7 @@
 import { useContext } from 'react';
 import { FormContext } from './form-helpers';
 import { toDatetimeLocal, fromDatetimeLocal } from '../../utils/formatters';
+import { isNull } from '../../utils/types';
 
 export function useFormControl(name, type) {
   const formState = useContext(FormContext);
@@ -40,7 +41,7 @@ function getEmptyValue(type) {
 }
 
 function encode(value, type) {
-  if (typeof value === 'undefined') {
+  if (typeof value === 'undefined' || isNull(value)) {
     return getEmptyValue(type);
   }
 

src/utils/types.js

@@ -17,3 +17,7 @@ export function isString(value) {
 export function isDate(value) {
   return Object.prototype.toString.call(value) === '[object Date]';
 }
+
+export function isNull(value) {
+  return value === null;
+}