diff --git a/src/FormSpy.js b/src/FormSpy.js index e13a7ac9..9d74ccbb 100644 --- a/src/FormSpy.js +++ b/src/FormSpy.js @@ -4,21 +4,15 @@ import renderComponent from './renderComponent' import type { FormSpyPropsWithForm as Props, FormSpyRenderProps } from './types' import type { FormApi, FormValuesShape } from 'final-form' import isSyntheticEvent from './isSyntheticEvent' +import useForm from './useForm' import useFormState from './useFormState' -import getContext from './getContext' function FormSpy({ onChange, subscription, ...rest }: Props) { - const ReactFinalFormContext = getContext() - const reactFinalForm: ?FormApi = React.useContext( - ReactFinalFormContext - ) - if (!reactFinalForm) { - throw new Error('FormSpy must be used inside of a ReactFinalForm component') - } + const reactFinalForm = useForm('FormSpy') const state = useFormState({ onChange, subscription }) if (onChange) { return null diff --git a/src/FormSpy.test.js b/src/FormSpy.test.js index aa3ed3d7..2eeba9c6 100644 --- a/src/FormSpy.test.js +++ b/src/FormSpy.test.js @@ -31,7 +31,7 @@ describe('FormSpy', () => { expect(errorSpy).toHaveBeenCalled() expect(errorSpy).toHaveBeenCalledTimes(1) expect(errorSpy.mock.calls[0][0].message).toBe( - 'FormSpy must be used inside of a ReactFinalForm component' + 'FormSpy must be used inside of a
component' ) console.error.mockRestore() }) diff --git a/src/ReactFinalForm.js b/src/ReactFinalForm.js index e68fb4ef..55c70ac4 100644 --- a/src/ReactFinalForm.js +++ b/src/ReactFinalForm.js @@ -20,7 +20,7 @@ import useConstant from './useConstant' import shallowEqual from './shallowEqual' import isSyntheticEvent from './isSyntheticEvent' import type { FormRenderProps } from './types.js.flow' -import getContext from './getContext' +import ReactFinalFormContext from './context' import useLatest from './useLatest' export const version = '6.1.0' @@ -53,7 +53,6 @@ function ReactFinalForm({ validateOnBlur, ...rest }: Props) { - const ReactFinalFormContext = getContext() const config: Config = { debug, destroyOnUnregister, diff --git a/src/context.js b/src/context.js new file mode 100644 index 00000000..896f5733 --- /dev/null +++ b/src/context.js @@ -0,0 +1,5 @@ +// @flow +import * as React from 'react' +import type { FormApi } from 'final-form' + +export default React.createContext>() diff --git a/src/getContext.js b/src/getContext.js deleted file mode 100644 index fb43d161..00000000 --- a/src/getContext.js +++ /dev/null @@ -1,14 +0,0 @@ -// @flow -import * as React from 'react' -import type { FormApi, FormValuesShape } from 'final-form' - -let instance: React.Context> - -export default function getContext< - FormValues: FormValuesShape ->(): React.Context> { - if (!instance) { - instance = React.createContext>() - } - return ((instance: any): React.Context>) -} diff --git a/src/useForm.js b/src/useForm.js index 63e21aef..6a1251df 100644 --- a/src/useForm.js +++ b/src/useForm.js @@ -1,12 +1,11 @@ // @flow import * as React from 'react' import type { FormApi, FormValuesShape } from 'final-form' -import getContext from './getContext' +import ReactFinalFormContext from './context' function useForm( componentName?: string ): FormApi { - const ReactFinalFormContext = getContext() const form: ?FormApi = React.useContext(ReactFinalFormContext) if (!form) { throw new Error(