import { EffectCallback , useEffect , useMemo , useRef } from 'react' ; import { useImmediatelyEffect } from '../../utils/effects' ; import { useContainer } from '../../components/container' ; import { useEventProxy } from '../../components/eventProxy' ; import { EventChannel } from '../../utils/eventChannel' ; /**
 * This hook runs not only the component rendered but also the `setData` callback is done.
 * It's the earliest time to get instance of component's `ref`.
 */ export const useRenderedEffect = ( callback , deps ? ) => { const container = useContainer ( ) ; const eventProxyContext = useEventProxy ( ) ; const cleanupEventChannel = useMemo ( ( ) => new EventChannel ( ) , [ ] ) ; const currentRenderId = container . getRenderId ( ) ; const unmountedRef = useRef ( false ) ; useImmediatelyEffect ( ( ) => { eventProxyContext . internalChannels . rendered . filteredOnce ( renderId => renderId === Number ( currentRenderId ) , ( ) => { cleanupEventChannel . emit ( ) ; const cleanup = callback ( ) ; if ( unmountedRef . current ) { cleanup ?. ( ) ; } else { cleanupEventChannel . once ( ( ) => cleanup ?. ( ) ) ; } } ) ; } , deps ) ; useEffect ( ( ) => ( ) => { unmountedRef . current = true ; cleanupEventChannel . emit ( ) ; } , [ cleanupEventChannel ] ) ; } ;