Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix: watch and useWatch without parameters return type #11359

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
12 changes: 9 additions & 3 deletions reports/api-extractor.md
Original file line number Diff line number Diff line change
Expand Up @@ -438,6 +438,9 @@ export type NonUndefined<T> = T extends undefined ? never : T;
// @public (undocumented)
export type Noop = () => void;

// @public (undocumented)
export type PartialFormValues<TFieldValues extends FieldValues> = DeepPartialSkipArrayKey<TFieldValues>;

// Warning: (ae-forgotten-export) The symbol "PathInternal" needs to be exported by the entry point index.d.ts
//
// @public
Expand Down Expand Up @@ -776,7 +779,7 @@ export type UseFormUnregister<TFieldValues extends FieldValues> = (name?: FieldP

// @public (undocumented)
export type UseFormWatch<TFieldValues extends FieldValues> = {
(): TFieldValues;
(): WatchedForm<TFieldValues>;
<TFieldNames extends readonly FieldPath<TFieldValues>[]>(names: readonly [...TFieldNames], defaultValue?: DeepPartial<TFieldValues>): FieldPathValues<TFieldValues, TFieldNames>;
<TFieldName extends FieldPath<TFieldValues>>(name: TFieldName, defaultValue?: FieldPathValue<TFieldValues, TFieldName>): FieldPathValue<TFieldValues, TFieldName>;
(callback: WatchObserver<TFieldValues>, defaultValues?: DeepPartial<TFieldValues>): Subscription;
Expand All @@ -788,7 +791,7 @@ export function useWatch<TFieldValues extends FieldValues = FieldValues>(props:
control?: Control<TFieldValues>;
disabled?: boolean;
exact?: boolean;
}): DeepPartialSkipArrayKey<TFieldValues>;
}): WatchedForm<TFieldValues>;

// @public
export function useWatch<TFieldValues extends FieldValues = FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(props: {
Expand Down Expand Up @@ -852,6 +855,9 @@ export type ValidationValueMessage<TValidationValue extends ValidationValue = Va
message: Message;
};

// @public (undocumented)
export type WatchedForm<TFieldValues extends FieldValues> = PartialFormValues<TFieldValues>;

// @public (undocumented)
export type WatchInternal<TFieldValues> = (fieldNames?: InternalFieldName | InternalFieldName[], defaultValue?: DeepPartial<TFieldValues>, isMounted?: boolean, isGlobal?: boolean) => FieldPathValue<FieldValues, InternalFieldName> | FieldPathValues<FieldValues, InternalFieldName[]>;

Expand All @@ -863,7 +869,7 @@ export type WatchObserver<TFieldValues extends FieldValues> = (value: DeepPartia

// Warnings were encountered during analysis:
//
// src/types/form.ts:440:3 - (ae-forgotten-export) The symbol "Subscription" needs to be exported by the entry point index.d.ts
// src/types/form.ts:446:3 - (ae-forgotten-export) The symbol "Subscription" needs to be exported by the entry point index.d.ts

// (No @packageDocumentation comment for this package)

Expand Down
4 changes: 2 additions & 2 deletions src/__tests__/controller.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import {
} from '@testing-library/react';

import { Controller } from '../controller';
import { ControllerRenderProps, FieldValues } from '../types';
import { ControllerRenderProps, FieldValues, WatchedForm } from '../types';
import { useFieldArray } from '../useFieldArray';
import { useForm } from '../useForm';
import { FormProvider } from '../useFormContext';
Expand Down Expand Up @@ -982,7 +982,7 @@ describe('Controller', () => {
type FormValue = {
test: string;
};
const watchedValue: FormValue[] = [];
const watchedValue: WatchedForm<FormValue>[] = [];
const Component = () => {
const { control, watch } = useForm<FormValue>({
defaultValues: {
Expand Down
3 changes: 2 additions & 1 deletion src/__tests__/useFieldArray.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import {
SubmitHandler,
UseFormRegister,
UseFormReturn,
WatchedForm,
} from '../types';
import { useFieldArray } from '../useFieldArray';
import { useForm } from '../useForm';
Expand Down Expand Up @@ -2694,7 +2695,7 @@ describe('useFieldArray', () => {
}[];
};

const watchedValues: FormValues[] = [];
const watchedValues: WatchedForm<FormValues>[] = [];

const Child = ({
control,
Expand Down
4 changes: 2 additions & 2 deletions src/__tests__/useForm/register.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import { act, renderHook } from '@testing-library/react-hooks';

import { VALIDATION_MODE } from '../../constants';
import { Controller } from '../../controller';
import { UseFormRegister } from '../../types';
import { UseFormRegister, WatchedForm } from '../../types';
import { useForm } from '../../useForm';
import { FormProvider, useFormContext } from '../../useFormContext';
import isFunction from '../../utils/isFunction';
Expand Down Expand Up @@ -478,7 +478,7 @@ describe('register', () => {
type FormValue = {
test: string;
};
const watchedValue: FormValue[] = [];
const watchedValue: WatchedForm<FormValue>[] = [];
const Component = () => {
const { register, watch } = useForm<FormValue>({
defaultValues: {
Expand Down
10 changes: 8 additions & 2 deletions src/types/form.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import {
FieldPathValues,
} from './path';
import { Resolver } from './resolvers';
import { DeepMap, DeepPartial, Noop } from './utils';
import { DeepMap, DeepPartial, DeepPartialSkipArrayKey, Noop } from './utils';
import { RegisterOptions } from './validator';

declare const $NestedValue: unique symbol;
Expand All @@ -44,6 +44,12 @@ export type UnpackNestedValue<T> = T extends NestedValue<infer U>
? { [K in keyof T]: UnpackNestedValue<T[K]> }
: T;

export type PartialFormValues<TFieldValues extends FieldValues> =
DeepPartialSkipArrayKey<TFieldValues>;

export type WatchedForm<TFieldValues extends FieldValues> =
PartialFormValues<TFieldValues>;

export type DefaultValues<TFieldValues> =
TFieldValues extends AsyncDefaultValues<TFieldValues>
? DeepPartial<Awaited<TFieldValues>>
Expand Down Expand Up @@ -375,7 +381,7 @@ export type UseFormWatch<TFieldValues extends FieldValues> = {
* const formValues = watch();
* ```
*/
(): TFieldValues;
(): WatchedForm<TFieldValues>;
/**
* Watch and subscribe to an array of fields used outside of render.
*
Expand Down
3 changes: 2 additions & 1 deletion src/useWatch.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
FieldValues,
InternalFieldName,
UseWatchProps,
WatchedForm,
} from './types';
import { useFormContext } from './useFormContext';
import { useSubscribe } from './useSubscribe';
Expand Down Expand Up @@ -44,7 +45,7 @@ export function useWatch<
control?: Control<TFieldValues>;
disabled?: boolean;
exact?: boolean;
}): DeepPartialSkipArrayKey<TFieldValues>;
}): WatchedForm<TFieldValues>;
/**
* Custom hook to subscribe to field change and isolate re-rendering at the component level.
*
Expand Down