feat(react): export FeatureFlags as stable (#18942)

Author: tay1orjones

.github/workflows/version.yml

@@ -45,6 +45,8 @@ jobs:
           key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
       - name: Install dependencies
         run: yarn install --immutable --immutable-cache --check-cache
+      - name: Update telemetry.yml
+        run: yarn run telemetry:config
       - name: Create preminor release
         if: ${{ github.event.inputs.type == 'preminor' }}
         run: |

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

@@ -3308,6 +3308,35 @@ Map {
     },
     "render": [Function],
   },
+  "FeatureFlags" => Object {
+    "propTypes": Object {
+      "children": Object {
+        "type": "node",
+      },
+      "enableDialogElement": Object {
+        "type": "bool",
+      },
+      "enableExperimentalFocusWrapWithoutSentinels": Object {
+        "type": "bool",
+      },
+      "enableTreeviewControllable": Object {
+        "type": "bool",
+      },
+      "enableV12DynamicFloatingStyles": Object {
+        "type": "bool",
+      },
+      "enableV12Overflowmenu": Object {
+        "type": "bool",
+      },
+      "enableV12TileDefaultIcons": Object {
+        "type": "bool",
+      },
+      "enableV12TileRadioIcons": Object {
+        "type": "bool",
+      },
+      "flags": [Function],
+    },
+  },
   "FileUploader" => Object {
     "$$typeof": Symbol(react.forward_ref),
     "propTypes": Object {
@@ -11027,6 +11056,8 @@ Map {
   "unstable_useFeatureFlags" => Object {},
   "unstable_useLayoutDirection" => Object {},
   "useContextMenu" => Object {},
+  "useFeatureFlag" => Object {},
+  "useFeatureFlags" => Object {},
   "useIdPrefix" => Object {},
   "useLayer" => Object {},
   "usePrefersDarkScheme" => Object {},

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

@@ -70,6 +70,7 @@ describe('Carbon Components React', () => {
         "ErrorBoundaryContext",
         "ExpandableSearch",
         "ExpandableTile",
+        "FeatureFlags",
         "FileUploader",
         "FileUploaderButton",
         "FileUploaderDropContainer",
@@ -294,6 +295,8 @@ describe('Carbon Components React', () => {
         "unstable_useFeatureFlags",
         "unstable_useLayoutDirection",
         "useContextMenu",
+        "useFeatureFlag",
+        "useFeatureFlags",
         "useIdPrefix",
         "useLayer",
         "usePrefersDarkScheme",

packages/react/src/components/FeatureFlags/overview.mdx

@@ -63,7 +63,7 @@ application's react tree. Multiple feature flags can be configured at the same
 time.
 
 ```jsx
-import { unstable_FeatureFlags as FeatureFlags } from '@carbon/react';
+import { FeatureFlags } from '@carbon/react';
 
 <FeatureFlags enableV12TileDefaultIcons="true" enableASecondFeatureFlag="true">
   <Tile />
@@ -77,7 +77,7 @@ entire app, or only certain pages/routes/sections of your application.
 ```jsx
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
-import { unstable_FeatureFlags as FeatureFlags } from '@carbon/react';
+import { FeatureFlags } from '@carbon/react';
 import App from './App';
 
 const root = createRoot(document.getElementById('root'));

packages/react/src/index.js

@@ -62,6 +62,14 @@ export {
   ErrorBoundary,
   ErrorBoundaryContext,
 } from './components/ErrorBoundary';
+export {
+  FeatureFlags,
+  useFeatureFlag,
+  useFeatureFlags,
+  FeatureFlags as unstable_FeatureFlags, // this export can be removed in v12
+  useFeatureFlag as unstable_useFeatureFlag, // this export can be removed in v12
+  useFeatureFlags as unstable_useFeatureFlags, // this export can be removed in v12
+} from './components/FeatureFlags';
 export {
   FileUploader,
   Filename,
@@ -235,11 +243,6 @@ export {
 } from './components/UIShell';
 
 // Experimental
-export {
-  FeatureFlags as unstable_FeatureFlags,
-  useFeatureFlag as unstable_useFeatureFlag,
-  useFeatureFlags as unstable_useFeatureFlags,
-} from './components/FeatureFlags';
 export {
   FluidComboBox as unstable__FluidComboBox,
   FluidComboBoxSkeleton as unstable__FluidComboBoxSkeleton,

packages/react/src/index.ts

@@ -33,6 +33,14 @@ export * from './components/DatePickerInput';
 export * from './components/Dropdown';
 export * from './components/ErrorBoundary';
 export * from './components/ExpandableSearch';
+export {
+  FeatureFlags,
+  useFeatureFlag,
+  useFeatureFlags,
+  FeatureFlags as unstable_FeatureFlags, // this export can be removed in v12
+  useFeatureFlag as unstable_useFeatureFlag, // this export can be removed in v12
+  useFeatureFlags as unstable_useFeatureFlags, // this export can be removed in v12
+} from './components/FeatureFlags';
 export * from './components/FileUploader';
 export * from './components/FilterableMultiSelect';
 export * from './components/FluidForm';
@@ -98,13 +106,7 @@ export * from './components/Toggletip';
 export * from './components/TreeView';
 export * from './components/UIShell';
 export * from './components/UnorderedList';
-
 // Experimental
-export {
-  FeatureFlags as unstable_FeatureFlags,
-  useFeatureFlag as unstable_useFeatureFlag,
-  useFeatureFlags as unstable_useFeatureFlags,
-} from './components/FeatureFlags';
 export {
   FluidComboBox as unstable__FluidComboBox,
   FluidComboBoxSkeleton as unstable__FluidComboBoxSkeleton,