Is impure to update "other component's" useRef within useEffect?

I saw the article "Keeping Components Pure" on react.dev and have a question.
Is there any problem with "updating refs of other components received via props in useEffect" as shown below?

function ChildComponent({ r: MutableRefObject<{ foo: string }> }) {
  useEffect(() => {
    r.current.foo = "update-from-children";
  });
}

function ChildComponent({ r: MutableRefObject<{ foo: string }> }) {
  useEffect(() => {
    r.current.foo = "update-from-children";
  });
}

This is used like:

const r = useRef({ foo: "default-value" });
<ChildComponent r={r} />

const r = useRef({ foo: "default-value" });
<ChildComponent r={r} />

Although not very practical, I made one sample application that just adds two inputs.
Of course, I know there are more React-like ways to do this, but I am now simply wondering if this is acceptable in principle for React components.
I would be happy to receive an answer!

Is impure to update "other component's" useRef within useEffect?

Similar Threads