fix(useContextBridge): return a stable context bridge

[CodyJasonBennett]

Prevents React from remounting roots whenever context updates from scratch, emulating StrictMode.

import * as React from 'react'
import * as ReactDOM from 'react-dom/client'
import { render } from 'react-nil'
import { useContextBridge, FiberProvider } from 'its-fine'

const Context = React.createContext(null)

// would log mount, unmount, mount; should log mount
function Inner() {
  React.useEffect(() => (console.log('mount'), () => console.log('unmount')), [])
  return null
}

function Canvas(props) {
  const Bridge = useContextBridge()
  render(<Bridge>{props.children}</Bridge>)
}

// skip 2 browser paints
const flush = (cb, raf = requestAnimationFrame) => raf(() => raf(() => raf(() => raf(() => cb()))))

function Outer(props) {
  const [value, setValue] = React.useState(() => true)
  React.useEffect(() => void flush(() => (setValue(false), flush(() => setValue(true)))), [])
  return <Context.Provider value={value}>{props.children}</Context.Provider>
}

ReactDOM.createRoot(window.root).render(
  <FiberProvider>
    <Outer>
      <Canvas>
        <Inner />
      </Canvas>
    </Outer>
  </FiberProvider>,
)