Merge pull request #16 from react-hook-form/improve-types

import types from core lib

Author: bluebill1049

package.json

@@ -81,7 +81,7 @@
     "prettier": "^2.0.5",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
-    "react-hook-form": "^6.0.0-rc.5",
+    "react-hook-form": "^6.7.0",
     "react-test-renderer": "^16.13.1",
     "rimraf": "^3.0.2",
     "rollup": "^2.17.0",
@@ -96,7 +96,7 @@
   "peerDependencies": {
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
-    "react-hook-form": ">=6.0.0",
+    "react-hook-form": ">=6.6.0",
     "typescript": ">=3.0.1"
   },
   "husky": {

src/__snapshots__/useTypedController.test.tsx.snap

@@ -3,14 +3,17 @@
 exports[`useTypedField should render correctly when as is input and name is string 1`] = `
 <DocumentFragment>
   <input
+    name="flat"
     value="test"
   />
 </DocumentFragment>
 `;
 
 exports[`useTypedField should render correctly when as is textarea and name is array 1`] = `
 <DocumentFragment>
-  <textarea>
+  <textarea
+    name="nested.object.test"
+  >
     test
   </textarea>
 </DocumentFragment>
@@ -19,14 +22,17 @@ exports[`useTypedField should render correctly when as is textarea and name is a
 exports[`useTypedField should render correctly when name is array and render is input 1`] = `
 <DocumentFragment>
   <input
+    name="nested.array[0].test"
     value="test"
   />
 </DocumentFragment>
 `;
 
 exports[`useTypedField should render correctly when name is string and render is textarea 1`] = `
 <DocumentFragment>
-  <textarea>
+  <textarea
+    name="flat"
+  >
     test
   </textarea>
 </DocumentFragment>

src/types.ts

@@ -1,8 +1,14 @@
-import { NestedValue, Control } from 'react-hook-form';
+import {
+  FieldValues,
+  Control,
+  Message,
+  ValidationRule,
+  ValidateResult,
+} from 'react-hook-form';
 
 export type ArrayWithLength<N extends number> = { [K in N]: any };
 
-export interface DeepPathArray<TValues extends Record<string, any>, TPath>
+export interface DeepPathArray<TValues extends FieldValues, TPath>
   extends ReadonlyArray<string | number> {
   ['0']: keyof TValues;
   ['1']?: TPath extends {
@@ -73,7 +79,7 @@ export interface DeepPathArray<TValues extends Record<string, any>, TPath>
 }
 
 export type DeepPathArrayValue<
-  TValues extends Record<string, any>,
+  TValues extends FieldValues,
   TPath extends DeepPathArray<TValues, TPath>
 > = TPath extends ArrayWithLength<0 | 1 | 2 | 3 | 4 | 5 | 6>
   ? any
@@ -91,54 +97,23 @@ export type DeepPathArrayValue<
   ? TValues[TPath[0]]
   : never;
 
-export type DeepPath<TValues extends Record<string, any>, TPath> =
+export type DeepPath<TValues extends FieldValues, TPath> =
   | DeepPathArray<TValues, TPath>
   | keyof TValues;
 
 export type DeepPathValue<
-  TValues extends Record<string, any>,
+  TValues extends FieldValues,
   TPath extends DeepPath<TValues, TPath>
 > = TPath extends DeepPathArray<TValues, TPath>
   ? DeepPathArrayValue<TValues, TPath>
   : TPath extends keyof TValues
   ? TValues[TPath]
   : any;
 
-export type NonUndefined<T> = T extends undefined ? never : T;
-
-export type UnpackNestedValue<T> = NonUndefined<T> extends NestedValue<infer U>
-  ? U
-  : NonUndefined<T> extends Date | FileList
-  ? T
-  : NonUndefined<T> extends object
-  ? { [K in keyof T]: UnpackNestedValue<T[K]> }
-  : T;
-
-export type FieldValuesFromControl<
-  TControl extends Control
-> = TControl extends Control<infer TFieldValues> ? TFieldValues : never;
-
 export type Options<TControl extends Control> = {
   control?: TControl;
 };
 
-export type Message = string;
-
-export type ValidationValue = boolean | number | string | RegExp;
-
-export type ValidationRule<
-  TValidationValue extends ValidationValue = ValidationValue
-> = TValidationValue | ValidationValueMessage<TValidationValue>;
-
-export type ValidationValueMessage<
-  TValidationValue extends ValidationValue = ValidationValue
-> = {
-  value: TValidationValue;
-  message: Message;
-};
-
-export type ValidateResult = Message | Message[] | boolean | undefined;
-
 export type Validate<TFieldValue> = (
   data: TFieldValue,
 ) => ValidateResult | Promise<ValidateResult>;
@@ -157,7 +132,7 @@ export type Assign<TValues extends object, U extends object> = TValues &
   Omit<U, keyof TValues>;
 
 export type ControllerProps<
-  TFieldValues extends Record<string, any>,
+  TFieldValues extends FieldValues,
   TFieldName extends DeepPath<TFieldValues, TFieldName>,
   TAs extends 'input' | 'select' | 'textarea'
 > = Assign<

src/useTypedController.test.tsx

@@ -4,9 +4,12 @@ import { render } from '@testing-library/react';
 import { renderHook } from '@testing-library/react-hooks';
 import { useTypedController } from './useTypedController';
 
-const reconfigureControl = (
+export const reconfigureControl = (
   controlOverrides: Partial<Control> = {},
 ): Control => ({
+  unmountFieldsStateRef: {
+    current: {},
+  },
   defaultValuesRef: {
     current: {},
   },
@@ -25,38 +28,42 @@ const reconfigureControl = (
   watchFieldsRef: {
     current: new Set(),
   },
-  dirtyFieldsRef: {
-    current: {},
-  },
   watchFieldsHookRef: {
     current: {},
   },
   watchFieldsHookRenderRef: {
     current: {},
   },
   watchInternal: jest.fn(),
-  validateSchemaIsValid: jest.fn(),
-  reRender: jest.fn(),
+  validateResolver: jest.fn(),
   setValue: jest.fn(),
+  getValues: jest.fn(),
   register: jest.fn(),
   unregister: jest.fn(),
   trigger: jest.fn(),
   removeFieldEventListener: jest.fn(),
-  errorsRef: { current: {} },
-  touchedFieldsRef: { current: {} },
-  mode: { isOnSubmit: false, isOnBlur: false, isOnChange: false },
+  mode: {
+    isOnSubmit: false,
+    isOnBlur: false,
+    isOnChange: false,
+    isOnTouch: false,
+    isOnAll: false,
+  },
   reValidateMode: {
     isReValidateOnBlur: false,
-    isReValidateOnSubmit: false,
+    isReValidateOnChange: false,
   },
-  formState: {
-    isDirty: false,
-    isSubmitted: false,
-    dirtyFields: {},
-    submitCount: 0,
-    touched: {},
-    isSubmitting: false,
-    isValid: false,
+  formStateRef: {
+    current: {
+      errors: {},
+      isDirty: false,
+      isSubmitted: false,
+      dirtyFields: {},
+      submitCount: 0,
+      touched: {},
+      isSubmitting: false,
+      isValid: false,
+    },
   },
   fieldsRef: {
     current: {},
@@ -67,15 +74,12 @@ const reconfigureControl = (
   fieldArrayNamesRef: {
     current: new Set<string>(),
   },
-  isDirtyRef: {
-    current: false,
-  },
-  isSubmittedRef: {
-    current: false,
-  },
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  updateFormState: () => {},
   readFormStateRef: {
     current: {
       isDirty: true,
+      errors: true,
       isSubmitted: false,
       submitCount: false,
       touched: false,
@@ -86,7 +90,6 @@ const reconfigureControl = (
   },
   // eslint-disable-next-line @typescript-eslint/no-empty-function
   renderWatchedInputs: () => {},
-  unmountFieldsStateRef: { current: {} },
   ...controlOverrides,
 });
 

src/useTypedController.tsx

@@ -1,13 +1,12 @@
 import React from 'react';
-import { Controller, Control } from 'react-hook-form';
-import { formatName } from './logic/formatName';
 import {
-  DeepPath,
+  Controller,
   UnpackNestedValue,
   FieldValuesFromControl,
-  Options,
-  ControllerProps,
-} from './types';
+  Control,
+} from 'react-hook-form';
+import { formatName } from './logic/formatName';
+import { DeepPath, Options, ControllerProps } from './types';
 
 export const useTypedController = <
   TFieldValues extends UnpackNestedValue<FieldValuesFromControl<TControl>>,

yarn.lock

@@ -6742,10 +6742,10 @@ react-dom@^16.13.1:
     prop-types "^15.6.2"
     scheduler "^0.19.1"
 
-react-hook-form@^6.0.0-rc.5:
-  version "6.0.0-rc.5"
-  resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-6.0.0-rc.5.tgz#f3965f66a3160fa37fcd44a88c54d8d7c65106d0"
-  integrity sha512-u+9po9D2gV6LjzCAdLsIHghG2mpE3+g49HZMWEl222NKqZ50b9g76f0rmw9jkBwRnS3cqxWcrmqlBD6YptPw5g==
+react-hook-form@^6.7.0:
+  version "6.7.0"
+  resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-6.7.0.tgz#84702b6a56c6c81d7c43cbfbd343e4884dd1e6be"
+  integrity sha512-2ySZ/lyp8xinKUMv/yoSo3NcNknfrHGlJ1pIV2U80H0WlFSGaGZ0wvAHmgfl1L5ZhoQND6mawcv09wuM8OGVPw==
 
 react-is@^16.12.0, react-is@^16.8.1, react-is@^16.8.6:
   version "16.13.1"