Console: export 'useId' was not found in 'react'

[jodyheavener]

Bug report

Packages affected

• [ ] sandpack-client
• [x] sandpack-react

Description of the problem

In development, usage of React < v18 results in noisy console logging because we are accessing React.useId when it doesn't exist.

It's obfuscated, but I'm guessing it comes from this line: https://github.com/codesandbox/sandpack/blob/main/sandpack-react/src/components/CodeEditor/useGeneratedId.ts

Oddly enough, it's not actually being imported there, but the generated ESM converts it to that:

import{useId as rs,useRef as Vr}from"react";var ss=e=>typeof e=="string"?e:typeof rs=="function"?rs():Vr(ue()).current;

Not sure what the solution is... maybe replacing the line with something like "useId" in React would solve it? But I'm guessing it would still always convert to that import syntax.

What steps can we take to reproduce the problem?

• Install @codesandbox/sandpack-react in a project with React 17.x
• Render one of the package components
• Open your developer console, observe output

Your Environment

Software	Name/Version
Sandpack-react version	1.8.0