react-hook-form - npm Package Compare versions

Comparing version 1.1.0 to 2.0.0-beta.1

dist/index.d.ts

@@ -59,3 +59,3 @@ declare type Validate = (data: string | number) => boolean | string | number | Date;
 export default function useForm({ mode, validationSchema }?: Props): {
-    register: (data: RegisterInput) => void;
+    register: (data: RegisterInput | HTMLInputElement | HTMLSelectElement) => (ref: any) => void;
     handleSubmit: (callback: (Object: any, e: any) => void) => (e: any) => Promise<void>;
@@ -62,0 +62,0 @@ errors: ErrorMessages;

dist/index.es.js

@@ -328,11 +328,10 @@ import { useRef, useState, useEffect } from 'react';
     }
-    function register(data) {
-        if (!data || !data.ref)
+    function registerIntoAllFields(elementRef, data = {}) {
+        if (elementRef && !elementRef.name) {
+            console.warn('Oops missing the name for field:', elementRef);
             return;
-        if (!data.ref.name) {
-            console.warn('Oops missing the name for field:', data.ref);
-            return;
         }
+        const inputData = Object.assign({}, data, { required: undefined, validate: undefined, ref: elementRef });
         let radioOptionIndex;
-        const { ref, required, validate, ref: { name, type, value }, } = data;
+        const { ref, required, validate, ref: { name, type, value }, } = inputData;
         const allFields = fields.current;
@@ -349,6 +348,6 @@ if (isRadioInput(type)) {
             if (radioOptionIndex > -1) {
-                options[radioOptionIndex] = Object.assign({}, options[radioOptionIndex], data);
+                options[radioOptionIndex] = Object.assign({}, options[radioOptionIndex], inputData);
             }
             else {
-                options.push(Object.assign({}, data, { mutationWatcher: onDomRemove(ref, () => removeReferenceAndEventListeners(data, true)) }));
+                options.push(Object.assign({}, inputData, { mutationWatcher: onDomRemove(ref, () => removeReferenceAndEventListeners(inputData, true)) }));
                 radioOptionIndex = options.length - 1;
@@ -358,9 +357,24 @@ }
         else {
-            allFields[name] = Object.assign({}, allFields[name], data);
+            allFields[name] = Object.assign({}, allFields[name], inputData);
             if (!allFields[name]) {
-                allFields[name].mutationWatcher = onDomRemove(ref, () => removeReferenceAndEventListeners(data, true));
+                allFields[name].mutationWatcher = onDomRemove(ref, () => removeReferenceAndEventListeners(inputData, true));
             }
         }
-        attachEventListeners({ allFields, watchFields, ref, type, radioOptionIndex, name, mode, validateWithStateUpdate });
+        attachEventListeners({
+            allFields,
+            watchFields,
+            ref,
+            type,
+            radioOptionIndex,
+            name,
+            mode,
+            validateWithStateUpdate,
+        });
     }
+    function register(data) {
+        if (data instanceof HTMLElement) {
+            registerIntoAllFields(data);
+        }
+        return ref => registerIntoAllFields(ref, data);
+    }
     function watch(filedNames, defaultValue) {
@@ -428,3 +442,3 @@ if (typeof filedNames === 'string') {
                         option.ref.addEventListener('change', validateWithStateUpdate);
-                        option.eventAttached = [...option.eventAttached || [], 'change'];
+                        option.eventAttached = [...(option.eventAttached || []), 'change'];
                     });
@@ -431,0 +445,0 @@ }

dist/index.js

@@ -330,11 +330,10 @@ 'use strict';
     }
-    function register(data) {
-        if (!data || !data.ref)
+    function registerIntoAllFields(elementRef, data = {}) {
+        if (elementRef && !elementRef.name) {
+            console.warn('Oops missing the name for field:', elementRef);
             return;
-        if (!data.ref.name) {
-            console.warn('Oops missing the name for field:', data.ref);
-            return;
         }
+        const inputData = Object.assign({}, data, { required: undefined, validate: undefined, ref: elementRef });
         let radioOptionIndex;
-        const { ref, required, validate, ref: { name, type, value }, } = data;
+        const { ref, required, validate, ref: { name, type, value }, } = inputData;
         const allFields = fields.current;
@@ -351,6 +350,6 @@ if (isRadioInput(type)) {
             if (radioOptionIndex > -1) {
-                options[radioOptionIndex] = Object.assign({}, options[radioOptionIndex], data);
+                options[radioOptionIndex] = Object.assign({}, options[radioOptionIndex], inputData);
             }
             else {
-                options.push(Object.assign({}, data, { mutationWatcher: onDomRemove(ref, () => removeReferenceAndEventListeners(data, true)) }));
+                options.push(Object.assign({}, inputData, { mutationWatcher: onDomRemove(ref, () => removeReferenceAndEventListeners(inputData, true)) }));
                 radioOptionIndex = options.length - 1;
@@ -360,9 +359,24 @@ }
         else {
-            allFields[name] = Object.assign({}, allFields[name], data);
+            allFields[name] = Object.assign({}, allFields[name], inputData);
             if (!allFields[name]) {
-                allFields[name].mutationWatcher = onDomRemove(ref, () => removeReferenceAndEventListeners(data, true));
+                allFields[name].mutationWatcher = onDomRemove(ref, () => removeReferenceAndEventListeners(inputData, true));
             }
         }
-        attachEventListeners({ allFields, watchFields, ref, type, radioOptionIndex, name, mode, validateWithStateUpdate });
+        attachEventListeners({
+            allFields,
+            watchFields,
+            ref,
+            type,
+            radioOptionIndex,
+            name,
+            mode,
+            validateWithStateUpdate,
+        });
     }
+    function register(data) {
+        if (data instanceof HTMLElement) {
+            registerIntoAllFields(data);
+        }
+        return ref => registerIntoAllFields(ref, data);
+    }
     function watch(filedNames, defaultValue) {
@@ -430,3 +444,3 @@ if (typeof filedNames === 'string') {
                         option.ref.addEventListener('change', validateWithStateUpdate);
-                        option.eventAttached = [...option.eventAttached || [], 'change'];
+                        option.eventAttached = [...(option.eventAttached || []), 'change'];
                     });
@@ -433,0 +447,0 @@ }

package.json

 {
   "name": "react-hook-form",
-  "version": "1.1.0",
+  "version": "2.0.0-beta.1",
   "main": "dist/index.js",
@@ -5,0 +5,0 @@ "module": "dist/index.es.js",

README.md

@@ -39,5 +39,5 @@ <div align="center"><a href="https://react-hook-form.now.sh/"><img src="https://raw.githubusercontent.com/bluebill1049/react-hook-form/master/website/logo.png" alt="React forme Logo - React hook form valiation" width="350px" /></a></div>
   return (
-    <form onSubmit={handleSubmit(onSubmit}>
-      <input name="firstname" ref={(ref) => register({ ref, required: true })} />
-      <input name="lastname" ref={(ref) => register({ ref, pattern: "[a-z]{1,15}" })} />
+    <form onSubmit={handleSubmit(onSubmit)}>
+      <input name="firstname" ref={register} />
+      <input name="lastname" ref={register({ pattern: "[a-z]{1,15}" })} />
       <input type="submit" />
@@ -44,0 +44,0 @@ </form>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

49781

increased by1.86%

Lines of code

1133

increased by2.53%

Worsened metrics

Number of low quality alerts

2

increased by100%

No dependency changes