import * as React from 'react' ; import { ReactNode , useEffect } from 'react' ; import { FormGroupContext } from './FormGroupContext' ; import { useFormContext } from './useFormContext' ; example param props param { ReactNode } props . children param { String } props . name export const FormGroupContextProvider = ( { children , name , } ) => { const formContext = useFormContext ( ) ; useEffect ( ( ) => { if ( ! formContext || ! formContext . registerGroup || ! formContext . unregisterGroup ) { console . warn ( `The FormGroupContextProvider can only be used inside a FormContext such as provided by the SimpleForm and TabbedForm components` ) ; return ; } formContext . registerGroup ( name ) ; return ( ) => { formContext . unregisterGroup ( name ) ; } ; } , [ formContext , name ] ) ; return ( < FormGroupContext . Provider value = { name } > { children } < /FormGroupContext.Provider>); } ;