Nested dependencies for useComputedValue()

[xcoderreal]

I recently played around with useCanvas(), and here's a sample code snippet I wrote:

  const { size } = useCanvas();
  const trackWidth = useComputedValue(
    () => size.current.width / numTracks,
    [size]
  );
  const p1 = useComputedValue(() => vec(trackWidth.current, 0), [trackWidth]);

As the documentation shows, we need a useComputedValue() otherwise the trackWidth will not use the correct width of the Canvas.

The tricky thing here is that, I wish to have p1 to depend on trackWidth (which will be passed to create a <Line>) which depends on the Canvas width. However, it looks like p1 will not use the correct value of size, unless I register the dependencies explicitly:

const p1 = useComputedValue(() => vec(trackWidth.current, 0), [trackWidth, size]);

My question: Am I missing anything (some other API I can use), and if this is the intended behavior? (Maybe just a bug in my code?)

More generally, do I have to register nested dependencies (useComputedValue() which depends on another useComputedValue()) explicitly?

[xcoderreal]

Apparently it's a bug on my end, and I do see nested dependencies are registered.