@conduction/components 2.0.21 → 2.0.22

package/README.md

@@ -4,6 +4,7 @@
 
 - **Version 2**
 
+  - 2.0.22: Refactor InputNumber and InputFloat to return number type.
   - 2.0.21: Add InputDateTime component.
   - 2.0.20: Bugfix Textarea component to include correct field validation.
   - 2.0.19: Add disabled state to Textarea and InputCheckbox components.

package/lib/components/formFields/input.js

@@ -10,6 +10,6 @@ export const InputText = ({ disabled, name, defaultValue, validation, register,
 export const InputEmail = ({ disabled, name, defaultValue, validation, register, icon, placeholder, errors, }) => (_jsx(TextField, { type: "email", ...{ defaultValue, disabled, placeholder, icon }, ...register(name, { ...validation }), invalid: errors[name] }));
 export const InputDate = ({ disabled, name, defaultValue, validation, register, errors, }) => (_jsx(TextField, { type: "date", ...{ defaultValue, disabled }, ...register(name, { ...validation }), invalid: errors[name] }));
 export const InputDateTime = ({ disabled, name, defaultValue, validation, register, errors, }) => (_jsx(TextField, { type: "datetime-local", ...{ defaultValue, disabled }, ...register(name, { ...validation }), invalid: errors[name] }));
-export const InputNumber = ({ disabled, name, defaultValue, validation, register, icon, placeholder, errors, }) => (_jsx(TextField, { type: "number", ...{ defaultValue, disabled, placeholder, icon }, ...register(name, { ...validation }), invalid: errors[name] }));
-export const InputFloat = ({ disabled, name, defaultValue, validation, register, icon, placeholder, errors, }) => (_jsx(TextField, { type: "number", step: ".01", ...{ disabled, placeholder, icon, defaultValue }, ...register(name, { ...validation }), invalid: errors[name] }));
+export const InputNumber = ({ disabled, name, defaultValue, validation, register, icon, placeholder, errors, }) => (_jsx(TextField, { type: "number", ...{ defaultValue, disabled, placeholder, icon }, ...register(name, { ...validation, valueAsNumber: true }), invalid: errors[name] }));
+export const InputFloat = ({ disabled, name, defaultValue, validation, register, icon, placeholder, errors, }) => (_jsx(TextField, { type: "number", step: ".01", ...{ disabled, placeholder, icon, defaultValue }, ...register(name, { ...validation, valueAsNumber: true }), invalid: errors[name] }));
 export const InputFile = ({ disabled, name, accept, defaultValue, validation, register, }) => (_jsx("input", { className: "denhaag-textfield__input", type: "file", ...{ defaultValue, disabled, accept }, ...register(name, { ...validation }) }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conduction/components",
-  "version": "2.0.21",
+  "version": "2.0.22",
   "description": "React (Gatsby) components used within the Conduction Skeleton Application (and its implementations)",
   "main": "lib/index.js",
   "scripts": {

package/src/components/formFields/input.tsx

@@ -113,7 +113,7 @@ export const InputNumber: React.FC<IInputProps & IReactHookFormProps> = ({
   <TextField
     type="number"
     {...{ defaultValue, disabled, placeholder, icon }}
-    {...register(name, { ...validation })}
+    {...register(name, { ...validation, valueAsNumber: true })}
     invalid={errors[name]}
   />
 );
@@ -132,7 +132,7 @@ export const InputFloat: React.FC<IInputProps & IReactHookFormProps> = ({
     type="number"
     step=".01"
     {...{ disabled, placeholder, icon, defaultValue }}
-    {...register(name, { ...validation })}
+    {...register(name, { ...validation, valueAsNumber: true })}
     invalid={errors[name]}
   />
 );