A pretty straightforward pattern here (and one that I actually just implemented ...

A pretty straightforward pattern here (and one that I actually just implemented with no hiccups for a non-React animation library) looks like:

    import { useEffect, useRef } from 'react';
    import { Controller } from 'some-animation-library';

    const SomeWrapperComponent = ({ options }) => {
      const elementRef = useRef(null)
      const controllerRef = useRef(null)

      useEffect(() => {
        if (!elementRef.current) {
          return () => {}
        }

        if (!controllerRef.current) {
          controllerRef.current = new Controller(elementRef.current, options)
        } else {
          controllerRef.current.setOptions(options)
        }

        return () => {
          controllerRef.current.doSomeCleanup()
        }
      }, [options])

      return <div ref={elementRef}></div>
    }