fix(carbon-react): update to usePrefix (#9728)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

packages/carbon-react/src/components/Layer/index.js

@@ -8,14 +8,16 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
+import { usePrefix } from '../../internal/usePrefix';
 
 export function Layer({
   as: BaseComponent = 'div',
   className: customClassName,
   children,
   ...rest
 }) {
-  const className = cx('bx--layer', customClassName);
+  const prefix = usePrefix();
+  const className = cx(`${prefix}--layer`, customClassName);
   return (
     <BaseComponent {...rest} className={className}>
       {children}

packages/carbon-react/src/components/Theme/index.js

@@ -8,6 +8,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
+import { usePrefix } from '../../internal/usePrefix';
 
 const ThemeContext = React.createContext({
   theme: 'white',
@@ -23,11 +24,12 @@ export function Theme({
   theme,
   ...rest
 }) {
+  const prefix = usePrefix();
   const className = cx(customClassName, {
-    'bx--white': theme === 'white',
-    'bx--g10': theme === 'g10',
-    'bx--g90': theme === 'g90',
-    'bx--g100': theme === 'g100',
+    [`${prefix}--white`]: theme === 'white',
+    [`${prefix}--g10`]: theme === 'g10',
+    [`${prefix}--g90`]: theme === 'g90',
+    [`${prefix}--g100`]: theme === 'g100',
   });
   const value = React.useMemo(() => {
     return {

packages/carbon-react/src/internal/usePrefix.js

@@ -0,0 +1,10 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * 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 { unstable_usePrefix } from 'carbon-components-react';
+
+export const usePrefix = unstable_usePrefix;

packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap

@@ -8863,5 +8863,6 @@ Map {
       },
     },
   },
+  "unstable_usePrefix" => Object {},
 }
 `;

packages/react/src/__tests__/index-test.js

@@ -215,6 +215,7 @@ Array [
   "unstable_useContextMenu",
   "unstable_useFeatureFlag",
   "unstable_useFeatureFlags",
+  "unstable_usePrefix",
 ]
 `);
   });

packages/react/src/index.js

@@ -230,3 +230,4 @@ export {
   Section as unstable_Section,
 } from './components/Heading';
 export { default as unstable_ProgressBar } from './components/ProgressBar';
+export { usePrefix as unstable_usePrefix } from './internal/usePrefix';