diff options
Diffstat (limited to 'src/utils/hooks/use-mutation-observer.tsx')
| -rw-r--r-- | src/utils/hooks/use-mutation-observer.tsx | 28 |
1 files changed, 28 insertions, 0 deletions
diff --git a/src/utils/hooks/use-mutation-observer.tsx b/src/utils/hooks/use-mutation-observer.tsx new file mode 100644 index 0000000..c56f7aa --- /dev/null +++ b/src/utils/hooks/use-mutation-observer.tsx @@ -0,0 +1,28 @@ +import { useEffect } from 'react'; + +type UseMutationObserverProps = { + callback: () => void; + options: MutationObserverInit; + nodeOrSelector: string | HTMLElement; +}; + +export const useMutationObserver = ({ + callback, + options, + nodeOrSelector, +}: UseMutationObserverProps) => { + useEffect(() => { + const targetNode = + typeof nodeOrSelector === 'string' + ? document.querySelector(nodeOrSelector)! + : nodeOrSelector; + + const observer = new MutationObserver(callback); + + observer.observe(targetNode, options); + + return () => { + observer.disconnect(); + }; + }, [nodeOrSelector, options, callback]); +}; |
