From a83964b034968e5f26b5b8142ce178efa611d414 Mon Sep 17 00:00:00 2001 From: Frank Calise Date: Wed, 25 Jun 2025 08:18:51 -0400 Subject: [PATCH 1/5] fix(Flyout): deprecation warning in new arch --- vnext/src-win/Libraries/Components/Flyout/Flyout.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/vnext/src-win/Libraries/Components/Flyout/Flyout.js b/vnext/src-win/Libraries/Components/Flyout/Flyout.js index 8124d83c889..7c63b99dd33 100644 --- a/vnext/src-win/Libraries/Components/Flyout/Flyout.js +++ b/vnext/src-win/Libraries/Components/Flyout/Flyout.js @@ -66,6 +66,8 @@ type State = $ReadOnly<{ targetRef?: React.ReactNode, }>; +const isFabric = global.nativeFabricUIManager; + /** * Renders a flyout component. * @@ -93,6 +95,12 @@ export class Flyout extends React.Component { constructor(props: Props) { super(props); + + if (__DEV__ && isFabric) { + console.warn( + '`Flyout` is deprecated and not supported in the New Architecture. Use the new `Modal` component instead.', + ); + } } render(): React.Node { From 92c84cb0da06ca791b56acd1beca6531a5df6e99 Mon Sep 17 00:00:00 2001 From: Frank Calise Date: Wed, 25 Jun 2025 08:19:08 -0400 Subject: [PATCH 2/5] fix(Popup): deprecation warning in new arch --- vnext/src-win/Libraries/Components/Popup/Popup.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/vnext/src-win/Libraries/Components/Popup/Popup.js b/vnext/src-win/Libraries/Components/Popup/Popup.js index 08316cc14d6..e10097bbabb 100644 --- a/vnext/src-win/Libraries/Components/Popup/Popup.js +++ b/vnext/src-win/Libraries/Components/Popup/Popup.js @@ -49,6 +49,8 @@ type State = $ReadOnly<{| targetRef?: React.ReactNode, |}>; +const isFabric = global.nativeFabricUIManager; + /** * Renders a popup component. * @@ -75,6 +77,12 @@ export class Popup extends React.Component { constructor(props: Props) { super(props); this.state = {target: undefined, targetRef: null}; + + if (__DEV__ && isFabric) { + console.warn( + '`Popup` is deprecated and not supported in the New Architecture. Use the new `Modal` component instead.', + ); + } } render(): React.Node { From 2de57308a86ccb0eeb5ada9b61be3e7de3c61051 Mon Sep 17 00:00:00 2001 From: Frank Calise Date: Wed, 25 Jun 2025 12:53:38 -0400 Subject: [PATCH 3/5] fix(Flyout): use warnOnce --- vnext/src-win/Libraries/Components/Flyout/Flyout.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/vnext/src-win/Libraries/Components/Flyout/Flyout.js b/vnext/src-win/Libraries/Components/Flyout/Flyout.js index 7c63b99dd33..a269dd614f6 100644 --- a/vnext/src-win/Libraries/Components/Flyout/Flyout.js +++ b/vnext/src-win/Libraries/Components/Flyout/Flyout.js @@ -10,6 +10,8 @@ import FlyoutNativeComponent from './FlyoutNativeComponent'; import * as React from 'react'; import {findNodeHandle, StyleSheet} from 'react-native'; +const warnOnce = require('../../Utilities/warnOnce').default; + type Placement = | 'top' | 'bottom' @@ -97,7 +99,8 @@ export class Flyout extends React.Component { super(props); if (__DEV__ && isFabric) { - console.warn( + warnOnce( + 'flyout-new-arch-deprecated', '`Flyout` is deprecated and not supported in the New Architecture. Use the new `Modal` component instead.', ); } From 5d42b00efefad4034953826ebb537989fcc2f00b Mon Sep 17 00:00:00 2001 From: Frank Calise Date: Wed, 25 Jun 2025 12:53:45 -0400 Subject: [PATCH 4/5] fix(Popup): use warnOnce --- vnext/src-win/Libraries/Components/Popup/Popup.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/vnext/src-win/Libraries/Components/Popup/Popup.js b/vnext/src-win/Libraries/Components/Popup/Popup.js index e10097bbabb..a076e1d51da 100644 --- a/vnext/src-win/Libraries/Components/Popup/Popup.js +++ b/vnext/src-win/Libraries/Components/Popup/Popup.js @@ -11,6 +11,8 @@ import type {ViewProps} from '../View/ViewPropTypes'; import {findNodeHandle} from '../../ReactNative/RendererProxy'; import StyleSheet from '../../StyleSheet/StyleSheet'; +const warnOnce = require('../../Utilities/warnOnce').default; + const styles = StyleSheet.create({ rctPopup: { position: 'absolute', @@ -79,7 +81,8 @@ export class Popup extends React.Component { this.state = {target: undefined, targetRef: null}; if (__DEV__ && isFabric) { - console.warn( + warnOnce( + 'popup-new-arch-deprecated', '`Popup` is deprecated and not supported in the New Architecture. Use the new `Modal` component instead.', ); } From 4c3041e7793e0d70b879be66c9b65cfda5bc892b Mon Sep 17 00:00:00 2001 From: Frank Calise Date: Thu, 26 Jun 2025 11:26:02 -0400 Subject: [PATCH 5/5] Change files --- ...ative-windows-435e1359-4961-4938-9b95-12d1e464146f.json | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 change/react-native-windows-435e1359-4961-4938-9b95-12d1e464146f.json diff --git a/change/react-native-windows-435e1359-4961-4938-9b95-12d1e464146f.json b/change/react-native-windows-435e1359-4961-4938-9b95-12d1e464146f.json new file mode 100644 index 00000000000..7e6ac3ca280 --- /dev/null +++ b/change/react-native-windows-435e1359-4961-4938-9b95-12d1e464146f.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "fix(new-arch): add deprecation warning for Flyout/Popup", + "packageName": "react-native-windows", + "email": "fcalise@gmail.com", + "dependentChangeType": "patch" +}