Deprecate Flash component in primer/react

.changeset/shy-moments-invent.md

@@ -0,0 +1,5 @@
+---
+"@primer/react": minor
+---
+
+Deprecate the `Flash` component and move to `@primer/react/deprecated`

e2e/components/Axe.test.ts

@@ -11,8 +11,8 @@ import {themes} from '../test-helpers/themes'
 const SKIPPED_TESTS = [
   'components-treeview-features--stress-test',
   'components-treeview-features--contain-intrinsic-size',
-  'components-flash-features--with-icon-action-dismiss', // TODO: Remove once color-contrast issues have been resolved
-  'components-flash-features--with-icon-and-action', // TODO: Remove once color-contrast issues have been resolved
+  'deprecated-components-flash-features--with-icon-action-dismiss', // TODO: Remove once color-contrast issues have been resolved
+  'deprecated-components-flash-features--with-icon-and-action', // TODO: Remove once color-contrast issues have been resolved
   'components-filteredactionlist--default',
   // TODO: Remove these once FilteredActionList feature stories no longer trigger label/nested-interactive axe violations.
   'components-filteredactionlist-features--loading-with-body-skeleton',

e2e/components/Flash.test.ts

@@ -5,23 +5,23 @@ import {themes} from '../test-helpers/themes'
 const stories = [
   {
     title: 'Default',
-    id: 'components-flash--default',
+    id: 'deprecated-components-flash--default',
   },
   {
     title: 'Danger',
-    id: 'components-flash-features--danger',
+    id: 'deprecated-components-flash-features--danger',
   },
   {
     title: 'Full',
-    id: 'components-flash-features--full',
+    id: 'deprecated-components-flash-features--full',
   },
   {
     title: 'Success',
-    id: 'components-flash-features--success',
+    id: 'deprecated-components-flash-features--success',
   },
   {
     title: 'Warning',
-    id: 'components-flash-features--warning',
+    id: 'deprecated-components-flash-features--warning',
   },
 ] as const
 

packages/react/src/Flash/Flash.docs.json

@@ -1,32 +1,32 @@
 {
   "id": "flash",
   "name": "Flash",
-  "status": "alpha",
+  "status": "deprecated",
   "a11yReviewed": "2025-01-08",
   "stories": [
     {
-      "id": "components-flash--default"
+      "id": "deprecated-components-flash--default"
     },
     {
-      "id": "components-flash-features--success"
+      "id": "deprecated-components-flash-features--success"
     },
     {
-      "id": "components-flash-features--danger"
+      "id": "deprecated-components-flash-features--danger"
     },
     {
-      "id": "components-flash-features--warning"
+      "id": "deprecated-components-flash-features--warning"
     },
     {
-      "id": "components-flash-features--full"
+      "id": "deprecated-components-flash-features--full"
     },
     {
-      "id": "components-flash-features--with-icon-and-action"
+      "id": "deprecated-components-flash-features--with-icon-and-action"
     },
     {
-      "id": "components-flash-features--with-icon-action-dismiss"
+      "id": "deprecated-components-flash-features--with-icon-action-dismiss"
     }
   ],
-  "importPath": "@primer/react",
+  "importPath": "@primer/react/deprecated",
   "props": [
     {
       "name": "full",

packages/react/src/Flash/Flash.features.stories.tsx

@@ -6,7 +6,7 @@ import Link from '../Link'
 import classes from './Flash.features.stories.module.css'
 
 export default {
-  title: 'Components/Flash/Features',
+  title: 'Deprecated/Components/Flash/Features',
   component: Flash,
 } as Meta<typeof Flash>
 

packages/react/src/Flash/Flash.stories.tsx

@@ -2,7 +2,7 @@ import type {Meta, StoryFn} from '@storybook/react-vite'
 import Flash from './Flash'
 
 export default {
-  title: 'Components/Flash',
+  title: 'Deprecated/Components/Flash',
   component: Flash,
 } as Meta<typeof Flash>
 

packages/react/src/Flash/Flash.tsx

@@ -3,12 +3,18 @@ import React from 'react'
 import type {ForwardRefComponent as PolymorphicForwardRefComponent} from '../utils/polymorphic'
 import classes from './Flash.module.css'
 
+/**
+ * @deprecated Use `Banner` instead. If migration is not yet possible, import `Flash` from `@primer/react/deprecated`.
+ */
 export type FlashProps = React.ComponentPropsWithoutRef<'div'> & {
   className?: string
   variant?: 'default' | 'warning' | 'success' | 'danger'
   full?: boolean
 }
 
+/**
+ * @deprecated Use `Banner` instead. If migration is not yet possible, import `Flash` from `@primer/react/deprecated`.
+ */
 const Flash = React.forwardRef(function Flash(
   {as: BaseComponent = 'div', className, variant = 'default', full, ...rest},
   ref,

packages/react/src/__tests__/__snapshots__/exports.test.ts.snap

@@ -272,6 +272,8 @@ exports[`@primer/react/deprecated > should not update exports without a semver c
   "type DialogProps",
   "FilteredSearch",
   "type FilteredSearchProps",
+  "Flash",
+  "type FlashProps",
   "Octicon",
   "type OcticonProps",
   "Pagehead",

packages/react/src/deprecated/index.ts

@@ -42,3 +42,8 @@ export type {TabNavProps, TabNavLinkProps} from '../TabNav'
 export {default as Tooltip} from '../Tooltip/Tooltip'
 export type {TooltipProps} from '../Tooltip/Tooltip'
 // end of v37.0.0
+
+// Deprecated in v38.0.0
+export {default as Flash} from '../Flash'
+export type {FlashProps} from '../Flash'
+// end of v38.0.0

script/generate-e2e-tests.js

@@ -500,23 +500,23 @@ const components = new Map([
     {
       stories: [
         {
-          id: 'components-flash--default',
+          id: 'deprecated-components-flash--default',
           name: 'Default',
         },
         {
-          id: 'components-flash-features--danger',
+          id: 'deprecated-components-flash-features--danger',
           name: 'Danger',
         },
         {
-          id: 'components-flash-features--full',
+          id: 'deprecated-components-flash-features--full',
           name: 'Full',
         },
         {
-          id: 'components-flash-features--success',
+          id: 'deprecated-components-flash-features--success',
           name: 'Success',
         },
         {
-          id: 'components-flash-features--warning',
+          id: 'deprecated-components-flash-features--warning',
           name: 'Warning',
         },
       ],