useMutationObserver() — ui Function Reference

Architecture documentation for the useMutationObserver() function in use-mutation-observer.ts from the ui codebase.

Function typescript ComponentRegistry Styles

Entity Profile

ComponentRegistry→ Styles→ useMutationObserver() — ui Function Reference

Dependency Diagram

graph TD
  6e54894c_cadd_5128_6936_972133a19cda["useMutationObserver()"]
  075d94eb_73b5_f20f_0019_f75db3bc14dd["use-mutation-observer.ts"]
  6e54894c_cadd_5128_6936_972133a19cda -->|defined in| 075d94eb_73b5_f20f_0019_f75db3bc14dd
  style 6e54894c_cadd_5128_6936_972133a19cda fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

deprecated/www/hooks/use-mutation-observer.ts lines 3–20

export const useMutationObserver = (
  ref: React.MutableRefObject<HTMLElement | null>,
  callback: MutationCallback,
  options = {
    attributes: true,
    characterData: true,
    childList: true,
    subtree: true,
  }
) => {
  React.useEffect(() => {
    if (ref.current) {
      const observer = new MutationObserver(callback)
      observer.observe(ref.current, options)
      return () => observer.disconnect()
    }
  }, [ref, callback, options])
}