react-native-windows 0.0.0-canary.612 → 0.0.0-canary.613

package/Directory.Build.props

@@ -67,7 +67,7 @@
 
   <PropertyGroup Label="NuGet" Condition="'$(MSBuildProjectExtension)' == '.vcxproj'">
     <!--See https://docs.microsoft.com/en-us/nuget/reference/msbuild-targets#restore-target-->
-    <RestoreUseStaticGraphEvaluation Condition="'$(BuildingInsideVisualStudio)' == 'true'">true</RestoreUseStaticGraphEvaluation>
+    <RestoreUseStaticGraphEvaluation Condition="'$(BuildingInsideVisualStudio)' == 'true' AND '$(DisableRestoreUseStaticGraphEvaluation)' != 'true'">true</RestoreUseStaticGraphEvaluation>
   </PropertyGroup>
 
 </Project>

package/Libraries/AppTheme/AppThemeTypes.d.ts

@@ -4,7 +4,7 @@
  * @format
  */
 
-import {EmitterSubscription} from 'react-native';
+import {EmitterSubscription} from '../vendor/emitter/EventEmitter';
 
 /**
  * Color information for high contrast

package/Libraries/Components/Flyout/Flyout.d.ts

@@ -1,19 +1,55 @@
-import React from 'react';
-import { IFlyoutProps } from './FlyoutProps';
-export interface IFlyoutTargetState {
-    target?: number | null;
-    targetRef?: React.ReactNode;
-}
-/**
- * Renders a flyout component.
- *
- * This is a controlled component that requires an `onDismiss` callback that
- * updates the `isOpen` prop in order for the component to reflect user actions.
- *
- * @keyword flyout
- */
-export declare class Flyout extends React.Component<IFlyoutProps, IFlyoutTargetState> {
-    static getDerivedStateFromProps(nextProps: IFlyoutProps, prevState: IFlyoutTargetState): IFlyoutTargetState;
-    constructor(props: IFlyoutProps);
-    render(): JSX.Element;
-}
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ * @format
+ */
+import type * as React from 'react';
+
+import type {Constructor} from '../../../types/private/Utilities';
+import type {NativeMethods} from '../../../types/public/ReactNativeTypes';
+import type {ViewProps} from '../View/ViewPropTypes';
+
+export type Placement =
+  | 'top'
+  | 'bottom'
+  | 'left'
+  | 'right'
+  | 'full'
+  | 'top-edge-aligned-left'
+  | 'top-edge-aligned-right'
+  | 'bottom-edge-aligned-left'
+  | 'bottom-edge-aligned-right'
+  | 'left-edge-aligned-top'
+  | 'right-edge-aligned-top'
+  | 'left-edge-aligned-bottom'
+  | 'right-edge-aligned-bottom';
+
+export type ShowMode =
+  | 'auto'
+  | 'standard'
+  | 'transient'
+  | 'transient-with-dismiss-on-pointer-move-away';
+
+export interface IFlyoutProps extends ViewProps {
+  horizontalOffset?: number;
+  isLightDismissEnabled?: boolean;
+  autoFocus?: boolean;
+  shouldConstrainToRootBounds?: boolean;
+
+  /**
+   * Specifies whether the area outside the flyout is darkened
+   */
+  isOverlayEnabled?: boolean;
+
+  isOpen?: boolean;
+  onDismiss?: (isOpen: boolean) => void;
+  placement?: Placement;
+  showMode?: ShowMode;
+  target?: React.ReactNode;
+  verticalOffset?: number;
+}
+
+declare class FlyoutComponent extends React.Component<IFlyoutProps> {}
+declare const FlyoutBase: Constructor<NativeMethods> & typeof FlyoutComponent;
+
+export class Flyout extends FlyoutBase {}

package/Libraries/Components/Flyout/Flyout.js

@@ -1,51 +1,110 @@
-/**
- * Copyright (c) Microsoft Corporation.
- * Licensed under the MIT License.
- * @format
- */
-'use strict';
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Flyout = void 0;
-const react_1 = __importDefault(require("react"));
-const react_native_1 = require("react-native");
-const styles = react_native_1.StyleSheet.create({
-    rctFlyout: {
-        position: 'absolute',
-    },
-});
-const RCTFlyout = (0, react_native_1.requireNativeComponent)('RCTFlyout');
-/**
- * Renders a flyout component.
- *
- * This is a controlled component that requires an `onDismiss` callback that
- * updates the `isOpen` prop in order for the component to reflect user actions.
- *
- * @keyword flyout
- */
-class Flyout extends react_1.default.Component {
-    static getDerivedStateFromProps(nextProps, prevState) {
-        // Check if we're given a new target property; we need to resolve it to a node handle before render
-        if (prevState.targetRef !== nextProps.target) {
-            // Map the 'target' property to a node tag to use in the native layer
-            const newtarget = (0, react_native_1.findNodeHandle)(nextProps.target);
-            return {
-                target: newtarget,
-                targetRef: nextProps.target,
-            };
-        }
-        return prevState;
-    }
-    constructor(props) {
-        super(props);
-        this.state = { target: undefined, targetRef: null };
-    }
-    render() {
-        const props = { ...this.props };
-        return (react_1.default.createElement(RCTFlyout, { ...props, target: this.state.target, style: [styles.rctFlyout, this.props.style] }));
-    }
-}
-exports.Flyout = Flyout;
-//# sourceMappingURL=Flyout.js.map
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ * @format
+ */
+'use strict';
+
+import * as React from 'react';
+
+import FlyoutNativeComponent from './FlyoutNativeComponent';
+import type {ViewProps} from '../View/ViewPropTypes';
+import {findNodeHandle} from '../../ReactNative/RendererProxy';
+import StyleSheet from '../../StyleSheet/StyleSheet';
+
+type Placement =
+  | 'top'
+  | 'bottom'
+  | 'left'
+  | 'right'
+  | 'full'
+  | 'top-edge-aligned-left'
+  | 'top-edge-aligned-right'
+  | 'bottom-edge-aligned-left'
+  | 'bottom-edge-aligned-right'
+  | 'left-edge-aligned-top'
+  | 'right-edge-aligned-top'
+  | 'left-edge-aligned-bottom'
+  | 'right-edge-aligned-bottom';
+
+type ShowMode =
+  | 'auto'
+  | 'standard'
+  | 'transient'
+  | 'transient-with-dismiss-on-pointer-move-away';
+
+type Props = $ReadOnly<{|
+  ...ViewProps,
+
+  // Props
+  horizontalOffset?: Double,
+  isLightDismissEnabled?: boolean,
+  autoFocus?: boolean,
+  shouldConstrainToRootBounds?: boolean,
+
+  /**
+   * Specifies whether the area outside the flyout is darkened
+   */
+  isOverlayEnabled?: boolean,
+
+  isOpen?: boolean,
+  onDismiss?: (isOpen: boolean) => void,
+  placement?: Placement,
+  showMode?: ShowMode,
+  target?: React.ReactNode,
+  verticalOffset?: number,
+
+  // Events
+|}>;
+
+const styles = StyleSheet.create({
+  rctFlyout: {
+    position: 'absolute',
+  },
+});
+
+type State = $ReadOnly<{|
+  target?: number | null,
+  targetRef?: React.ReactNode,
+|}>;
+
+/**
+ * Renders a flyout component.
+ *
+ * This is a controlled component that requires an `onDismiss` callback that
+ * updates the `isOpen` prop in order for the component to reflect user actions.
+ *
+ * @keyword flyout
+ */
+export class Flyout extends React.Component<Props, State> {
+  static getDerivedStateFromProps(nextProps: Props, prevState: State): State {
+    // Check if we're given a new target property; we need to resolve it to a node handle before render
+    if (prevState.targetRef !== nextProps.target) {
+      // Map the 'target' property to a node tag to use in the native layer
+      const newtarget = findNodeHandle(nextProps.target);
+      return {
+        target: newtarget,
+        targetRef: nextProps.target,
+      };
+    }
+
+    return prevState;
+  }
+
+  constructor(props: Props) {
+    super(props);
+    this.state = {target: undefined, targetRef: null};
+  }
+
+  render(): React.Node {
+    const props = {...this.props};
+
+    return (
+      <FlyoutNativeComponent
+        {...props}
+        target={this.state.target}
+        style={[styles.rctFlyout, this.props.style]}
+      />
+    );
+  }
+}

package/Libraries/Components/Flyout/FlyoutNativeComponent.js

@@ -0,0 +1,45 @@
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ * @flow strict-local
+ * @format
+ */
+
+import type {Double, DirectEventHandler, Int32} from '../../Types/CodegenTypes';
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+import type {HostComponent} from 'react-native/Libraries/Renderer/shims/ReactNativeTypes';
+import type {ViewProps} from '../View/ViewPropTypes';
+
+type DismissEvent = $ReadOnly<{|
+  isOpen?: boolean,
+|}>;
+
+type NativeProps = $ReadOnly<{|
+  ...ViewProps,
+
+  // Props
+  horizontalOffset?: Double,
+  isLightDismissEnabled?: boolean,
+  autoFocus?: boolean,
+  shouldConstrainToRootBounds?: boolean,
+
+  /**
+   * Specifies whether the area outside the flyout is darkened
+   */
+  isOverlayEnabled?: boolean,
+
+  isOpen?: boolean,
+  onDismiss?: ?DirectEventHandler<DismissEvent>,
+  placement?: string,
+  showMode?: string,
+  target?: Int32,
+  verticalOffset?: Double,
+
+  // Events
+|}>;
+
+type NativeType = HostComponent<NativeProps>;
+
+export default (codegenNativeComponent<NativeProps>('RCTFlyout', {
+  interfaceOnly: true,
+}): NativeType);

package/Libraries/Components/Glyph/Glyph.d.ts

@@ -4,11 +4,12 @@
  * @format
  */
 
-import {Constructor} from '../../../types/private/Utilities';
-import {NativeMethods} from '../../../types/public/ReactNativeTypes';
-import {ColorValue, StyleProp} from '../../StyleSheet/StyleSheet';
-import {ViewStyle} from '../../StyleSheet/StyleSheetTypes';
-import {ViewProps} from '../View/ViewPropTypes';
+import type * as React from 'react';
+import type {Constructor} from '../../../types/private/Utilities';
+import type {NativeMethods} from '../../../types/public/ReactNativeTypes';
+import type {ColorValue, StyleProp} from '../../StyleSheet/StyleSheet';
+import type {ViewStyle} from '../../StyleSheet/StyleSheetTypes';
+import type {ViewProps} from '../View/ViewPropTypes';
 
 export interface GlyphStyle extends ViewStyle {
   color?: ColorValue | undefined;

package/Libraries/Components/Keyboard/KeyboardExtProps.d.ts

@@ -3,7 +3,7 @@
  * Licensed under the MIT License.
  * @format
  */
-import RN from 'react-native';
+import { NativeSyntheticEvent } from 'react-native';
 export declare enum EventPhase {
     None = 0,
     Capturing = 1,
@@ -31,7 +31,7 @@ export interface IHandledKeyboardEvent {
     code: string;
     handledEventPhase?: HandledEventPhase;
 }
-export type IKeyboardEvent = RN.NativeSyntheticEvent<INativeKeyboardEvent>;
+export type IKeyboardEvent = NativeSyntheticEvent<INativeKeyboardEvent>;
 export interface IKeyboardProps {
     onKeyDown?: (args: IKeyboardEvent) => void;
     onKeyDownCapture?: (args: IKeyboardEvent) => void;

package/Libraries/Components/Keyboard/KeyboardExtProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"KeyboardExtProps.js","sourceRoot":"","sources":["../../../src/Libraries/Components/Keyboard/KeyboardExtProps.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,YAAY,CAAC;;;AAIb,kCAAkC;AAClC,gDAAgD;AAChD,IAAY,UAKX;AALD,WAAY,UAAU;IACpB,2CAAQ,CAAA;IACR,qDAAS,CAAA;IACT,mDAAQ,CAAA;IACR,mDAAQ,CAAA;AACV,CAAC,EALW,UAAU,GAAV,kBAAU,KAAV,kBAAU,QAKrB;AAED,kCAAkC;AAClC,gDAAgD;AAChD,IAAY,iBAGX;AAHD,WAAY,iBAAiB;IAC3B,mEAAgC,CAAA;IAChC,iEAA8B,CAAA;AAChC,CAAC,EAHW,iBAAiB,GAAjB,yBAAiB,KAAjB,yBAAiB,QAG5B","sourcesContent":["/**\n * Copyright (c) Microsoft Corporation.\n * Licensed under the MIT License.\n * @format\n */\n\n'use strict';\n\nimport RN from 'react-native';\n\n// Enum already part of public API\n// eslint-disable-next-line no-restricted-syntax\nexport enum EventPhase {\n  None = 0,\n  Capturing,\n  AtTarget,\n  Bubbling,\n}\n\n// Enum already part of public API\n// eslint-disable-next-line no-restricted-syntax\nexport enum HandledEventPhase {\n  Capturing = EventPhase.Capturing,\n  Bubbling = EventPhase.Bubbling,\n}\n\nexport interface INativeKeyboardEvent {\n  altKey: boolean;\n  ctrlKey: boolean;\n  metaKey: boolean;\n  shiftKey: boolean;\n  key: string;\n  code: string;\n  eventPhase: EventPhase;\n}\n\nexport interface IHandledKeyboardEvent {\n  altKey?: boolean;\n  ctrlKey?: boolean;\n  metaKey?: boolean;\n  shiftKey?: boolean;\n  code: string;\n  handledEventPhase?: HandledEventPhase;\n}\n\nexport type IKeyboardEvent = RN.NativeSyntheticEvent<INativeKeyboardEvent>;\n\nexport interface IKeyboardProps {\n  onKeyDown?: (args: IKeyboardEvent) => void;\n  onKeyDownCapture?: (args: IKeyboardEvent) => void;\n  onKeyUp?: (args: IKeyboardEvent) => void;\n  onKeyUpCapture?: (args: IKeyboardEvent) => void;\n\n  keyDownEvents?: IHandledKeyboardEvent[];\n  keyUpEvents?: IHandledKeyboardEvent[];\n}\n"]}
+{"version":3,"file":"KeyboardExtProps.js","sourceRoot":"","sources":["../../../src/Libraries/Components/Keyboard/KeyboardExtProps.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,YAAY,CAAC;;;AAIb,kCAAkC;AAClC,gDAAgD;AAChD,IAAY,UAKX;AALD,WAAY,UAAU;IACpB,2CAAQ,CAAA;IACR,qDAAS,CAAA;IACT,mDAAQ,CAAA;IACR,mDAAQ,CAAA;AACV,CAAC,EALW,UAAU,GAAV,kBAAU,KAAV,kBAAU,QAKrB;AAED,kCAAkC;AAClC,gDAAgD;AAChD,IAAY,iBAGX;AAHD,WAAY,iBAAiB;IAC3B,mEAAgC,CAAA;IAChC,iEAA8B,CAAA;AAChC,CAAC,EAHW,iBAAiB,GAAjB,yBAAiB,KAAjB,yBAAiB,QAG5B","sourcesContent":["/**\n * Copyright (c) Microsoft Corporation.\n * Licensed under the MIT License.\n * @format\n */\n\n'use strict';\n\nimport {NativeSyntheticEvent} from 'react-native';\n\n// Enum already part of public API\n// eslint-disable-next-line no-restricted-syntax\nexport enum EventPhase {\n  None = 0,\n  Capturing,\n  AtTarget,\n  Bubbling,\n}\n\n// Enum already part of public API\n// eslint-disable-next-line no-restricted-syntax\nexport enum HandledEventPhase {\n  Capturing = EventPhase.Capturing,\n  Bubbling = EventPhase.Bubbling,\n}\n\nexport interface INativeKeyboardEvent {\n  altKey: boolean;\n  ctrlKey: boolean;\n  metaKey: boolean;\n  shiftKey: boolean;\n  key: string;\n  code: string;\n  eventPhase: EventPhase;\n}\n\nexport interface IHandledKeyboardEvent {\n  altKey?: boolean;\n  ctrlKey?: boolean;\n  metaKey?: boolean;\n  shiftKey?: boolean;\n  code: string;\n  handledEventPhase?: HandledEventPhase;\n}\n\nexport type IKeyboardEvent = NativeSyntheticEvent<INativeKeyboardEvent>;\n\nexport interface IKeyboardProps {\n  onKeyDown?: (args: IKeyboardEvent) => void;\n  onKeyDownCapture?: (args: IKeyboardEvent) => void;\n  onKeyUp?: (args: IKeyboardEvent) => void;\n  onKeyUpCapture?: (args: IKeyboardEvent) => void;\n\n  keyDownEvents?: IHandledKeyboardEvent[];\n  keyUpEvents?: IHandledKeyboardEvent[];\n}\n"]}

package/Libraries/Components/Popup/Popup.d.ts

@@ -1,19 +1,41 @@
-import React from 'react';
-import { IPopupProps } from './PopupProps';
-export interface IPopupTargetState {
-    target?: number | null;
-    targetRef?: React.ReactNode;
-}
-/**
- * Renders a popup component.
- *
- * This is a controlled component that requires an `onDismiss` callback that
- * updates the `isOpen` prop in order for the component to reflect user actions.
- *
- * @keyword popup
- */
-export declare class Popup extends React.Component<IPopupProps, IPopupTargetState> {
-    static getDerivedStateFromProps(nextProps: IPopupProps, prevState: IPopupTargetState): IPopupTargetState;
-    constructor(props: IPopupProps);
-    render(): JSX.Element;
-}
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ * @format
+ */
+
+import type * as React from 'react';
+
+import type {ViewProps} from '../View/ViewPropTypes';
+import type {Constructor} from '../../../types/private/Utilities';
+import type {NativeMethods} from '../../../types/public/ReactNativeTypes';
+
+export interface IPopupProps extends ViewProps {
+  isOpen?: boolean;
+
+  /**
+   * Configures the Popup with a transparent backdrop.
+   */
+  isLightDismissEnabled?: boolean;
+
+  /**
+   * Sets whether the Popup will automatically receive focus when opened.
+   * Defaults to true. Always true when isLightDismissEnabled === true.
+   */
+  autoFocus?: boolean;
+
+  horizontalOffset?: number;
+  verticalOffset?: number;
+
+  /**
+   * Sets a React element to use as an anchor point. When set, the popup will be positioned relative to it.
+   */
+  target?: React.ReactNode;
+  onDismiss?: () => void;
+  testID?: string;
+}
+
+declare class PopupComponent extends React.Component<IPopupProps> {}
+declare const PopupBase: Constructor<NativeMethods> & typeof PopupComponent;
+
+export class Popup extends PopupBase {}

package/Libraries/Components/Popup/Popup.js

@@ -1,52 +1,86 @@
-/**
- * Copyright (c) Microsoft Corporation.
- * Licensed under the MIT License.
- * @format
- */
-'use strict';
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Popup = void 0;
-const react_1 = __importDefault(require("react"));
-const react_native_1 = require("react-native");
-const styles = react_native_1.StyleSheet.create({
-    rctPopup: {
-        position: 'absolute',
-    },
-});
-const RCTPopup = (0, react_native_1.requireNativeComponent)('RCTPopup');
-/**
- * Renders a popup component.
- *
- * This is a controlled component that requires an `onDismiss` callback that
- * updates the `isOpen` prop in order for the component to reflect user actions.
- *
- * @keyword popup
- */
-class Popup extends react_1.default.Component {
-    static getDerivedStateFromProps(nextProps, prevState) {
-        // Check if we're given a new target property; we need to resolve it to a node handle before render
-        if (prevState.targetRef !== nextProps.target) {
-            // Map the 'target' property to a node tag to use in the native layer
-            const newTarget = (0, react_native_1.findNodeHandle)(nextProps.target);
-            return {
-                target: newTarget,
-                targetRef: nextProps.target,
-            };
-        }
-        return prevState;
-    }
-    constructor(props) {
-        super(props);
-        this.state = { target: undefined, targetRef: null };
-    }
-    render() {
-        const props = { ...this.props };
-        props.style = [styles.rctPopup, this.props.style];
-        return react_1.default.createElement(RCTPopup, { ...props, target: this.state.target });
-    }
-}
-exports.Popup = Popup;
-//# sourceMappingURL=Popup.js.map
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ * @format
+ */
+'use strict';
+
+import * as React from 'react';
+import PopupNativeComponent from './PopupNativeComponent';
+import type {ViewProps} from '../View/ViewPropTypes';
+import {findNodeHandle} from '../../ReactNative/RendererProxy';
+import StyleSheet from '../../StyleSheet/StyleSheet';
+
+const styles = StyleSheet.create({
+  rctPopup: {
+    position: 'absolute',
+  },
+});
+
+type Props = $ReadOnly<{|
+  ...ViewProps,
+
+  isOpen?: boolean,
+
+  /**
+   * Configures the Popup with a transparent backdrop.
+   */
+  isLightDismissEnabled?: boolean,
+
+  /**
+   * Sets whether the Popup will automatically receive focus when opened.
+   * Defaults to true. Always true when isLightDismissEnabled === true.
+   */
+  autoFocus?: boolean,
+
+  horizontalOffset?: number,
+  verticalOffset?: number,
+
+  /**
+   * Sets a React element to use as an anchor point. When set, the popup will be positioned relative to it.
+   */
+  target?: React.ReactNode,
+  onDismiss?: () => void,
+  testID?: string,
+|}>;
+
+type State = $ReadOnly<{|
+  target?: number | null,
+  targetRef?: React.ReactNode,
+|}>;
+
+/**
+ * Renders a popup component.
+ *
+ * This is a controlled component that requires an `onDismiss` callback that
+ * updates the `isOpen` prop in order for the component to reflect user actions.
+ *
+ * @keyword popup
+ */
+export class Popup extends React.Component<Props, State> {
+  static getDerivedStateFromProps(nextProps: Props, prevState: State): State {
+    // Check if we're given a new target property; we need to resolve it to a node handle before render
+    if (prevState.targetRef !== nextProps.target) {
+      // Map the 'target' property to a node tag to use in the native layer
+      const newtarget = findNodeHandle(nextProps.target);
+      return {
+        target: newtarget,
+        targetRef: nextProps.target,
+      };
+    }
+
+    return prevState;
+  }
+
+  constructor(props: Props) {
+    super(props);
+    this.state = {target: undefined, targetRef: null};
+  }
+
+  render(): React.Node {
+    const props = {...this.props};
+    props.style = [styles.rctPopup, this.props.style];
+
+    return <PopupNativeComponent {...props} target={this.state.target} />;
+  }
+}

package/Libraries/Components/Popup/PopupNativeComponent.js

@@ -0,0 +1,49 @@
+/**
+ * Copyright (c) Microsoft Corporation.
+ * Licensed under the MIT License.
+ * @flow strict-local
+ * @format
+ */
+
+import type {ColorValue} from '../../StyleSheet/StyleSheet';
+import type {Double, DirectEventHandler, Int32} from '../../Types/CodegenTypes';
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+import type {HostComponent} from 'react-native/Libraries/Renderer/shims/ReactNativeTypes';
+import type {ViewProps} from '../View/ViewPropTypes';
+
+type DismissEvent = $ReadOnly<{|
+  isOpen?: boolean,
+|}>;
+
+type NativeProps = $ReadOnly<{|
+  ...ViewProps,
+
+  isOpen?: boolean,
+
+  /**
+   * Configures the Popup with a transparent backdrop.
+   */
+  isLightDismissEnabled?: boolean,
+
+  /**
+   * Sets whether the Popup will automatically receive focus when opened.
+   * Defaults to true. Always true when isLightDismissEnabled === true.
+   */
+  autoFocus?: boolean,
+
+  horizontalOffset?: Double,
+  verticalOffset?: Double,
+
+  /**
+   * Sets a React element to use as an anchor point. When set, the popup will be positioned relative to it.
+   */
+  target?: Int32,
+  onDismiss?: ?DirectEventHandler<DismissEvent>,
+  testID?: string,
+|}>;
+
+type NativeType = HostComponent<NativeProps>;
+
+export default (codegenNativeComponent<NativeProps>('RCTPopup', {
+  interfaceOnly: true,
+}): NativeType);

package/Libraries/platform-types.d.ts

@@ -5,11 +5,9 @@
 *        need to also be added to index.windows.js
 */
 
-export * from './Components/Flyout/FlyoutProps';
-export * from './Components/Flyout/Flyout';
-export * from './Components/Glyph/Glyph';
-export * from './Components/Popup/PopupProps';
-export * from './Components/Popup/Popup';
+export {Flyout, IFlyoutProps, Placement, ShowMode} from './Components/Flyout/Flyout';
+export {Glyph, GlyphProps, GlyphStyle} from './Components/Glyph/Glyph';
+export {IPopupProps, Popup} from './Components/Popup/Popup';
 export * from './Components/Keyboard/KeyboardExt';
 export * from './Components/Keyboard/KeyboardExtProps';
 export * from './Components/View/ViewWindowsProps';

package/Microsoft.ReactNative/IReactDispatcher.cpp

@@ -124,6 +124,10 @@ void ReactDispatcher::InvokeElsePost(Mso::DispatchTask &&task) const noexcept {
   return jsThreadDispatcherProperty;
 }
 
+/*static*/ IReactDispatcher ReactDispatcher::GetJSDispatcher(IReactPropertyBag const &properties) noexcept {
+  return properties.Get(JSDispatcherProperty()).try_as<IReactDispatcher>();
+}
+
 /*static*/ IReactPropertyName ReactDispatcher::JSDispatcherTaskStartingEventName() noexcept {
   static IReactPropertyName jsThreadDispatcherProperty{ReactPropertyBagHelper::GetName(
       ReactPropertyBagHelper::GetNamespace(L"ReactNative.Dispatcher"), L"JSDispatcherTaskStartingEventName")};

package/Microsoft.ReactNative/IReactDispatcher.h

@@ -38,6 +38,7 @@ struct ReactDispatcher : implements<ReactDispatcher, IReactDispatcher, Mso::Reac
   static void SetUIThreadDispatcher(IReactPropertyBag const &properties) noexcept;
 
   static IReactPropertyName JSDispatcherProperty() noexcept;
+  static IReactDispatcher GetJSDispatcher(IReactPropertyBag const &properties) noexcept;
   static IReactPropertyName JSDispatcherTaskStartingEventName() noexcept;
   static IReactPropertyName JSDispatcherIdleWaitStartingEventName() noexcept;
   static IReactPropertyName JSDispatcherIdleWaitCompletedEventName() noexcept;