diff --git a/packages/ibm-products/src/components/EmptyStates/assets/ErrorIllustration.js b/packages/ibm-products/src/components/EmptyStates/assets/ErrorIllustration.js
index ebe58b6587..099556deec 100644
--- a/packages/ibm-products/src/components/EmptyStates/assets/ErrorIllustration.js
+++ b/packages/ibm-products/src/components/EmptyStates/assets/ErrorIllustration.js
@@ -6,12 +6,13 @@
  */
 
 // Import portions of React that are needed.
-import React, { useId } from 'react';
+import React from 'react';
 
 // Other standard imports.
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { pkg } from '../../../settings';
+import { useId } from '../../../global/js/utils/useId';
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 const blockClass = `${pkg.prefix}--empty-state`;
diff --git a/packages/ibm-products/src/components/EmptyStates/assets/NoDataIllustration.js b/packages/ibm-products/src/components/EmptyStates/assets/NoDataIllustration.js
index fa736070b2..af6da233ab 100644
--- a/packages/ibm-products/src/components/EmptyStates/assets/NoDataIllustration.js
+++ b/packages/ibm-products/src/components/EmptyStates/assets/NoDataIllustration.js
@@ -6,12 +6,13 @@
  */
 
 // Import portions of React that are needed.
-import React, { useId } from 'react';
+import React from 'react';
 
 // Other standard imports.
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { pkg } from '../../../settings';
+import { useId } from '../../../global/js/utils/useId';
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 const blockClass = `${pkg.prefix}--empty-state`;
diff --git a/packages/ibm-products/src/components/EmptyStates/assets/NoTagsIllustration.js b/packages/ibm-products/src/components/EmptyStates/assets/NoTagsIllustration.js
index 65aede2eca..f88b77e2c2 100644
--- a/packages/ibm-products/src/components/EmptyStates/assets/NoTagsIllustration.js
+++ b/packages/ibm-products/src/components/EmptyStates/assets/NoTagsIllustration.js
@@ -6,12 +6,13 @@
  */
 
 // Import portions of React that are needed.
-import React, { useId } from 'react';
+import React from 'react';
 
 // Other standard imports.
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { pkg } from '../../../settings';
+import { useId } from '../../../global/js/utils/useId';
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 const blockClass = `${pkg.prefix}--empty-state`;
diff --git a/packages/ibm-products/src/components/EmptyStates/assets/NotFoundIllustration.js b/packages/ibm-products/src/components/EmptyStates/assets/NotFoundIllustration.js
index a12f64ef98..00b7106e56 100644
--- a/packages/ibm-products/src/components/EmptyStates/assets/NotFoundIllustration.js
+++ b/packages/ibm-products/src/components/EmptyStates/assets/NotFoundIllustration.js
@@ -6,12 +6,13 @@
  */
 
 // Import portions of React that are needed.
-import React, { useId } from 'react';
+import React from 'react';
 
 // Other standard imports.
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { pkg } from '../../../settings';
+import { useId } from '../../../global/js/utils/useId';
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 const blockClass = `${pkg.prefix}--empty-state`;
diff --git a/packages/ibm-products/src/components/EmptyStates/assets/NotificationsIllustration.js b/packages/ibm-products/src/components/EmptyStates/assets/NotificationsIllustration.js
index b7284f5cf4..a8f2c0b44a 100644
--- a/packages/ibm-products/src/components/EmptyStates/assets/NotificationsIllustration.js
+++ b/packages/ibm-products/src/components/EmptyStates/assets/NotificationsIllustration.js
@@ -6,12 +6,13 @@
  */
 
 // Import portions of React that are needed.
-import React, { useId } from 'react';
+import React from 'react';
 
 // Other standard imports.
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { pkg } from '../../../settings';
+import { useId } from '../../../global/js/utils/useId';
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 const blockClass = `${pkg.prefix}--empty-state`;
diff --git a/packages/ibm-products/src/components/EmptyStates/assets/UnauthorizedIllustration.js b/packages/ibm-products/src/components/EmptyStates/assets/UnauthorizedIllustration.js
index 67a3d407a2..ea8945180a 100644
--- a/packages/ibm-products/src/components/EmptyStates/assets/UnauthorizedIllustration.js
+++ b/packages/ibm-products/src/components/EmptyStates/assets/UnauthorizedIllustration.js
@@ -6,12 +6,13 @@
  */
 
 // Import portions of React that are needed.
-import React, { useId } from 'react';
+import React from 'react';
 
 // Other standard imports.
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { pkg } from '../../../settings';
+import { useId } from '../../../global/js/utils/useId';
 
 // The block part of our conventional BEM class names (blockClass__E--M).
 const blockClass = `${pkg.prefix}--empty-state`;
diff --git a/packages/ibm-products/src/global/js/utils/useId.js b/packages/ibm-products/src/global/js/utils/useId.js
new file mode 100644
index 0000000000..5d60e9b7af
--- /dev/null
+++ b/packages/ibm-products/src/global/js/utils/useId.js
@@ -0,0 +1,21 @@
+//
+// Copyright IBM Corp. 2021, 2024
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+import React from 'react';
+import uuidv4 from './uuidv4';
+
+// This tricks bundlers so they can't statically analyze this and produce
+// compilation warnings/errors.
+// https://github.com/webpack/webpack/issues/14814
+// https://github.com/mui/material-ui/issues/41190
+const _React = { ...React };
+
+/**
+ * Uses React 18's built-in `useId()` when available, or falls back to
+ * using uuidv4 otherwise
+ */
+export const useId = _React.useId ? _React.useId : uuidv4;