[Bug]: useId giving warning as it's not supported by react <18

[sean-anderson-ibm]

Package

@carbon/react

Browser

No response

Package version

v1.63.0

React version

16.14.0

Description

A recent PR - #16988, which was part of the v1.63.0 release of @carbon/react has moved to using useId in more places. There is handling for the correct version here

carbon/packages/react/src/internal/useId.js

Line 26 in f22da5a

// React 18 introduced a new hook called `useId` that takes care of hydration

but this seems to not be working since that PR.

When running a storybook-smoke-test (npm run storybook-smoke-test) we are seeing:

WARN export 'useId' (imported as 'useId') was not found in 'react' (possible exports: Children, Component, Fragment, Profiler, PureComponent, StrictMode, Suspense, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, cloneElement, createContext, createElement, createFactory, createRef, forwardRef, isValidElement, lazy, memo, useCallback, useContext, useDebugValue, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useReducer, useRef, useState, version)

I believe the initial PR to fix this was #14153, and I can't see that file being changed since so it's not immediately obvious why it's no longer working.

Reproduction/example

[email protected], @carbon/[email protected]

Steps to reproduce

• Create an environment with react 16.14.0, @carbon/[email protected] and a storybook set up.
• Run npm run storybook-smoke-test and observe warning about useId

Suggested Severity

Severity 1 = Must be fixed ASAP. The response must be swift. Someone from the team must drop all current work and be immediately reassigned to address the issue.

Application/PAL

Cloud Pak For Integration (Platform UI)

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems

[guidari]

We can guard the useId hook for React versions lower than 18 by using a smiliar approach that we applied here:

carbon/packages/react/src/internal/useId.js

Lines 68 to 71 in d594e9b

	if (typeof React['useId'] === 'function') {
	const id = nativeReactUseId(_prefix, prefix);
	return id;
	}

[tom-youd]

Can this be reopened?
We are still seeing this warning with @carbon/react:1.63.1