fix: regression in #6813

[stipsan]

The change in #6813 caused some regressions.

For example previously this would log HTMLDivElement on the first render:

function MyComponent() {
  const ref = React.useRef(null)
  React.useEffect(() => {
    console.log(ref?.current)
  }, [])

  return <Pane ref={ref} />
}

But in #6813 it's null, forcing you to use this pattern for it to be safe:

function MyComponent() {
  const [el, setEl] = React.useState(null)
  React.useEffect(() => {
    console.log(el) // eventually logs `HTMLDivElement`
  }, [el])

  return <Pane ref={setEl} />
}

In this PR we regain the behaviour that it's HTMLDivElement on the first render, while preserving the ability for React Compiler to compile <Pane /> since it still uses useImperativeHandle instead of useForwardedRef 🙌

It also preserves the behaviour that rootElement has a value on the first render of useEffect hooks inside Pane.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
page-building-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 31, 2024 10:51am
performance-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 31, 2024 10:51am
test-compiled-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 31, 2024 10:51am
test-next-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 31, 2024 10:51am
test-studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 31, 2024 10:51am

1 Ignored Deployment

Name	Status	Preview	Comments	Updated (UTC)
studio-workshop	⬜️ Ignored (Inspect)			May 31, 2024 10:51am

[github-actions]

No changes to documentation

[github-actions]

Component Testing Report Updated May 31, 2024 10:58 AM (UTC)

File	Status	Duration	Passed	Skipped	Failed
comments/CommentInput.spec.tsx	✅ Passed (Inspect)	35s	15	0	0
formBuilder/ArrayInput.spec.tsx	✅ Passed (Inspect)	6s	3	0	0
formBuilder/inputs/PortableText/Annotations.spec.tsx	✅ Passed (Inspect)	26s	6	0	0
formBuilder/inputs/PortableText/copyPaste/CopyPaste.spec.tsx	✅ Passed (Inspect)	31s	11	7	0
formBuilder/inputs/PortableText/Decorators.spec.tsx	✅ Passed (Inspect)	14s	6	0	0
formBuilder/inputs/PortableText/DisableFocusAndUnset.spec.tsx	✅ Passed (Inspect)	8s	3	0	0
formBuilder/inputs/PortableText/FocusTracking.spec.tsx	✅ Passed (Inspect)	36s	15	0	0
formBuilder/inputs/PortableText/Input.spec.tsx	✅ Passed (Inspect)	1m 15s	21	0	0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx	✅ Passed (Inspect)	1m 2s	18	0	0
formBuilder/inputs/PortableText/PresenceCursors.spec.tsx	✅ Passed (Inspect)	7s	3	9	0
formBuilder/inputs/PortableText/RangeDecoration.spec.tsx	✅ Passed (Inspect)	20s	9	0	0
formBuilder/inputs/PortableText/Styles.spec.tsx	✅ Passed (Inspect)	14s	6	0	0
formBuilder/inputs/PortableText/Toolbar.spec.tsx	✅ Passed (Inspect)	30s	12	0	0