@office-iss/react-native-win32 0.0.0-canary.284 → 0.0.0-canary.286

package/{Libraries/Inspector → src/private/inspector}/NetworkOverlay.js

@@ -10,18 +10,21 @@
 
 'use strict';
 
-import type {RenderItemProps} from '@react-native/virtualized-lists';
+import type XMLHttpRequest from '../../../Libraries/Network/XMLHttpRequest';
+import type {ListRenderItemInfo} from '@react-native/virtualized-lists';
 
-import ScrollView from '../Components/ScrollView/ScrollView';
+import ScrollView from '../../../Libraries/Components/ScrollView/ScrollView';
 import React from 'react';
 
-const TouchableHighlight = require('../Components/Touchable/TouchableHighlight');
-const View = require('../Components/View/View');
-const FlatList = require('../Lists/FlatList');
-const XHRInterceptor = require('../Network/XHRInterceptor');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const Text = require('../Text/Text');
-const WebSocketInterceptor = require('../WebSocket/WebSocketInterceptor');
+const TouchableHighlight =
+  require('../../../Libraries/Components/Touchable/TouchableHighlight').default;
+const View = require('../../../Libraries/Components/View/View').default;
+const FlatList = require('../../../Libraries/Lists/FlatList').default;
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
+const Text = require('../../../Libraries/Text/Text').default;
+const WebSocketInterceptor =
+  require('../../../Libraries/WebSocket/WebSocketInterceptor').default;
+const XHRInterceptor = require('./XHRInterceptor').default;
 
 const LISTVIEW_CELL_HEIGHT = 15;
 
@@ -85,6 +88,18 @@ function keyExtractor(request: NetworkRequestInfo): string {
   return String(request.id);
 }
 
+const XHR_ID_KEY = Symbol('XHR_ID');
+
+function getXHRId(xhr: XMLHttpRequest): number {
+  // $FlowExpectedError[prop-missing]
+  return xhr[XHR_ID_KEY];
+}
+
+function setXHRId(xhr: XMLHttpRequest, id: number) {
+  // $FlowExpectedError[prop-missing]
+  xhr[XHR_ID_KEY] = id;
+}
+
 /**
  * Show all the intercepted network requests over the InspectorPanel.
  */
@@ -107,8 +122,8 @@ class NetworkOverlay extends React.Component<Props, State> {
   };
 
   // Map of `socketId` -> `index in `this.state.requests`.
-  _socketIdMap: {[string]: number} = {};
-  // Map of `xhr._index` -> `index in `this.state.requests`.
+  _socketIdMap: {[number]: number} = {};
+  // Map of `xhr[XHR_ID_KEY]` -> `index in `this.state.requests`.
   _xhrIdMap: {[key: number]: number, ...} = {};
 
   state: State = {
@@ -125,9 +140,9 @@ class NetworkOverlay extends React.Component<Props, State> {
       // Generate a global id for each intercepted xhr object, add this id
       // to the xhr object as a private `_index` property to identify it,
       // so that we can distinguish different xhr objects in callbacks.
-      xhr._index = nextXHRId++;
+      setXHRId(xhr, nextXHRId++);
       const xhrIndex = this.state.requests.length;
-      this._xhrIdMap[xhr._index] = xhrIndex;
+      this._xhrIdMap[getXHRId(xhr)] = xhrIndex;
 
       const _xhr: NetworkRequestInfo = {
         id: xhrIndex,
@@ -145,7 +160,7 @@ class NetworkOverlay extends React.Component<Props, State> {
 
     XHRInterceptor.setRequestHeaderCallback((header, value, xhr) => {
       // $FlowFixMe[prop-missing]
-      const xhrIndex = this._getRequestIndexByXHRID(xhr._index);
+      const xhrIndex = this._getRequestIndexByXHRID(getXHRId(xhr));
       if (xhrIndex === -1) {
         return;
       }
@@ -162,7 +177,7 @@ class NetworkOverlay extends React.Component<Props, State> {
 
     XHRInterceptor.setSendCallback((data, xhr) => {
       // $FlowFixMe[prop-missing]
-      const xhrIndex = this._getRequestIndexByXHRID(xhr._index);
+      const xhrIndex = this._getRequestIndexByXHRID(getXHRId(xhr));
       if (xhrIndex === -1) {
         return;
       }
@@ -177,7 +192,7 @@ class NetworkOverlay extends React.Component<Props, State> {
     XHRInterceptor.setHeaderReceivedCallback(
       (type, size, responseHeaders, xhr) => {
         // $FlowFixMe[prop-missing]
-        const xhrIndex = this._getRequestIndexByXHRID(xhr._index);
+        const xhrIndex = this._getRequestIndexByXHRID(getXHRId(xhr));
         if (xhrIndex === -1) {
           return;
         }
@@ -195,7 +210,7 @@ class NetworkOverlay extends React.Component<Props, State> {
     XHRInterceptor.setResponseCallback(
       (status, timeout, response, responseURL, responseType, xhr) => {
         // $FlowFixMe[prop-missing]
-        const xhrIndex = this._getRequestIndexByXHRID(xhr._index);
+        const xhrIndex = this._getRequestIndexByXHRID(getXHRId(xhr));
         if (xhrIndex === -1) {
           return;
         }
@@ -276,7 +291,7 @@ class NetworkOverlay extends React.Component<Props, State> {
       });
     });
 
-    WebSocketInterceptor.setOnMessageCallback((socketId, message) => {
+    WebSocketInterceptor.setOnMessageCallback((message, socketId) => {
       const socketIndex = this._socketIdMap[socketId];
       if (socketIndex === undefined) {
         return;
@@ -295,7 +310,7 @@ class NetworkOverlay extends React.Component<Props, State> {
       });
     });
 
-    WebSocketInterceptor.setOnCloseCallback((socketId, message) => {
+    WebSocketInterceptor.setOnCloseCallback((message, socketId) => {
       const socketIndex = this._socketIdMap[socketId];
       if (socketIndex === undefined) {
         return;
@@ -309,7 +324,7 @@ class NetworkOverlay extends React.Component<Props, State> {
       });
     });
 
-    WebSocketInterceptor.setOnErrorCallback((socketId, message) => {
+    WebSocketInterceptor.setOnErrorCallback((message, socketId) => {
       const socketIndex = this._socketIdMap[socketId];
       if (socketIndex === undefined) {
         return;
@@ -340,7 +355,7 @@ class NetworkOverlay extends React.Component<Props, State> {
   _renderItem = ({
     item,
     index,
-  }: RenderItemProps<NetworkRequestInfo>): React.MixedElement => {
+  }: ListRenderItemInfo<NetworkRequestInfo>): React.MixedElement => {
     const tableRowViewStyle = [
       styles.tableRow,
       index % 2 === 1 ? styles.tableRowOdd : styles.tableRowEven,
@@ -609,4 +624,4 @@ const styles = StyleSheet.create({
   },
 });
 
-module.exports = NetworkOverlay;
+export default NetworkOverlay;

package/{Libraries/Inspector → src/private/inspector}/PerformanceOverlay.js

@@ -12,10 +12,11 @@
 
 import React from 'react';
 
-const View = require('../Components/View/View');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const Text = require('../Text/Text');
-const PerformanceLogger = require('../Utilities/GlobalPerformanceLogger');
+const View = require('../../../Libraries/Components/View/View').default;
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
+const Text = require('../../../Libraries/Text/Text').default;
+const PerformanceLogger =
+  require('../../../Libraries/Utilities/GlobalPerformanceLogger').default;
 
 class PerformanceOverlay extends React.Component<{...}> {
   render(): React.Node {
@@ -61,4 +62,4 @@ const styles = StyleSheet.create({
   },
 });
 
-module.exports = PerformanceOverlay;
+export default PerformanceOverlay;

package/{Libraries/Inspector → src/private/inspector}/ReactDevToolsOverlay.js

@@ -8,19 +8,20 @@
  * @flow
  */
 
-import type {InspectedViewRef} from '../ReactNative/AppContainer-dev';
-import type {PointerEvent} from '../Types/CoreEventTypes';
-import type {PressEvent} from '../Types/CoreEventTypes';
-import type {ReactDevToolsAgent} from '../Types/ReactDevToolsTypes';
+import type {InspectedViewRef} from '../../../Libraries/ReactNative/AppContainer-dev';
+import type {PointerEvent} from '../../../Libraries/Types/CoreEventTypes';
+import type {GestureResponderEvent} from '../../../Libraries/Types/CoreEventTypes';
+import type {ReactDevToolsAgent} from '../../../Libraries/Types/ReactDevToolsTypes';
 import type {InspectedElement} from './Inspector';
 
-import View from '../Components/View/View';
-import ReactNativeFeatureFlags from '../ReactNative/ReactNativeFeatureFlags';
-import StyleSheet from '../StyleSheet/StyleSheet';
+import View from '../../../Libraries/Components/View/View';
+import ReactNativeFeatureFlags from '../../../Libraries/ReactNative/ReactNativeFeatureFlags';
+import StyleSheet from '../../../Libraries/StyleSheet/StyleSheet';
 import ElementBox from './ElementBox';
 import * as React from 'react';
 
-const getInspectorDataForViewAtPoint = require('./getInspectorDataForViewAtPoint');
+const getInspectorDataForViewAtPoint =
+  require('./getInspectorDataForViewAtPoint').default;
 
 const {useEffect, useState, useCallback} = React;
 
@@ -106,7 +107,7 @@ export default function ReactDevToolsOverlay({
   );
 
   const onResponderMove = useCallback(
-    (e: PressEvent) => {
+    (e: GestureResponderEvent) => {
       findViewForLocation(
         e.nativeEvent.touches[0].locationX,
         e.nativeEvent.touches[0].locationY,
@@ -116,7 +117,7 @@ export default function ReactDevToolsOverlay({
   );
 
   const shouldSetResponder = useCallback(
-    (e: PressEvent): boolean => {
+    (e: GestureResponderEvent): boolean => {
       onResponderMove(e);
       return true;
     },

package/{Libraries/Inspector → src/private/inspector}/StyleInspector.js

@@ -10,14 +10,14 @@
 
 'use strict';
 
-import type {ViewStyleProp} from '../StyleSheet/StyleSheet';
-import type {____FlattenStyleProp_Internal} from '../StyleSheet/StyleSheetTypes';
+import type {ViewStyleProp} from '../../../Libraries/StyleSheet/StyleSheet';
+import type {____FlattenStyleProp_Internal} from '../../../Libraries/StyleSheet/StyleSheetTypes';
 
 import React from 'react';
 
-const View = require('../Components/View/View');
-const StyleSheet = require('../StyleSheet/StyleSheet');
-const Text = require('../Text/Text');
+const View = require('../../../Libraries/Components/View/View').default;
+const StyleSheet = require('../../../Libraries/StyleSheet/StyleSheet').default;
+const Text = require('../../../Libraries/Text/Text').default;
 
 type Props = $ReadOnly<{
   style?: ?____FlattenStyleProp_Internal<ViewStyleProp>,
@@ -73,4 +73,4 @@ const styles = StyleSheet.create({
   },
 });
 
-module.exports = StyleInspector;
+export default StyleInspector;

package/{Libraries/Network → src/private/inspector}/XHRInterceptor.js

@@ -10,7 +10,10 @@
 
 'use strict';
 
-const XMLHttpRequest = require('./XMLHttpRequest');
+import typeof XMLHttpRequestT from '../../../Libraries/Network/XMLHttpRequest';
+
+const XMLHttpRequest: XMLHttpRequestT =
+  require('../../../Libraries/Network/XMLHttpRequest').default;
 // $FlowFixMe[method-unbinding]
 const originalXHROpen = XMLHttpRequest.prototype.open;
 // $FlowFixMe[method-unbinding]
@@ -211,4 +214,4 @@ const XHRInterceptor = {
   },
 };
 
-module.exports = XHRInterceptor;
+export default XHRInterceptor;

package/{Libraries/Inspector → src/private/inspector}/getInspectorDataForViewAtPoint.js

@@ -11,7 +11,7 @@
 import type {
   HostInstance,
   TouchedViewDataAtPoint,
-} from '../Renderer/shims/ReactNativeTypes';
+} from '../../../Libraries/Renderer/shims/ReactNativeTypes';
 
 const invariant = require('invariant');
 
@@ -49,7 +49,7 @@ function validateRenderers(): void {
   );
 }
 
-module.exports = function getInspectorDataForViewAtPoint(
+function getInspectorDataForViewAtPoint(
   inspectedView: ?HostInstance,
   locationX: number,
   locationY: number,
@@ -78,4 +78,6 @@ module.exports = function getInspectorDataForViewAtPoint(
       );
     }
   }
-};
+}
+
+export default getInspectorDataForViewAtPoint;

package/{Libraries/Inspector → src/private/inspector}/resolveBoxStyle.js

@@ -10,7 +10,8 @@
 
 'use strict';
 
-const I18nManager = require('../ReactNative/I18nManager');
+const I18nManager =
+  require('../../../Libraries/ReactNative/I18nManager').default;
 
 /**
  * Resolve a style property into its component parts.
@@ -111,4 +112,4 @@ function resolveBoxStyle(
   return hasParts ? result : null;
 }
 
-module.exports = resolveBoxStyle;
+export default resolveBoxStyle;

package/src/private/renderer/errorhandling/ErrorHandlers.js

@@ -9,16 +9,16 @@
  */
 
 import type {ExtendedError} from '../../../../Libraries/Core/ExtendedError';
+import type {Component as ReactComponent} from 'react';
 
-import {
+import ExceptionsManager, {
   SyntheticError,
-  handleException,
 } from '../../../../Libraries/Core/ExceptionsManager';
 
 type ErrorInfo = {
   +componentStack?: ?string,
   // $FlowFixMe[unclear-type] unknown props and state.
-  +errorBoundary?: ?React$Component<any, any>,
+  +errorBoundary?: ?ReactComponent<any, any>,
 };
 
 function getExtendedError(
@@ -60,14 +60,14 @@ export function onUncaughtError(errorValue: mixed, errorInfo: ErrorInfo): void {
   const error = getExtendedError(errorValue, errorInfo);
 
   // Uncaught errors are fatal.
-  handleException(error, true);
+  ExceptionsManager.handleException(error, true);
 }
 
 export function onCaughtError(errorValue: mixed, errorInfo: ErrorInfo): void {
   const error = getExtendedError(errorValue, errorInfo);
 
   // Caught errors are not fatal.
-  handleException(error, false);
+  ExceptionsManager.handleException(error, false);
 }
 
 export function onRecoverableError(

package/src/private/setup/setUpDOM.js

@@ -21,12 +21,17 @@ export default function setUpDOM() {
 
   polyfillGlobal(
     'DOMRect',
-    () => require('../webapis/dom/geometry/DOMRect').default,
+    () => require('../webapis/geometry/DOMRect').default,
   );
 
   polyfillGlobal(
     'DOMRectReadOnly',
-    () => require('../webapis/dom/geometry/DOMRectReadOnly').default,
+    () => require('../webapis/geometry/DOMRectReadOnly').default,
+  );
+
+  polyfillGlobal(
+    'HTMLCollection',
+    () => require('../webapis/dom/oldstylecollections/HTMLCollection').default,
   );
 
   polyfillGlobal(

package/src/private/{specs → specs_DEPRECATED}/modules/NativeDevMenu.js

@@ -15,7 +15,6 @@ import * as TurboModuleRegistry from '../../../../Libraries/TurboModule/TurboMod
 export interface Spec extends TurboModule {
   +show: () => void;
   +reload: () => void;
-  +debugRemotely: (enableDebug: boolean) => void;
   +setProfilingEnabled: (enabled: boolean) => void;
   +setHotLoadingEnabled: (enabled: boolean) => void;
 }

package/src/private/{specs → specs_DEPRECATED}/modules/NativeDevSettings.js

@@ -17,7 +17,6 @@ export interface Spec extends TurboModule {
   +reloadWithReason?: (reason: string) => void;
   +onFastRefresh?: () => void;
   +setHotLoadingEnabled: (isHotLoadingEnabled: boolean) => void;
-  +setIsDebuggingRemotely: (isDebuggingRemotelyEnabled: boolean) => void;
   +setProfilingEnabled: (isProfilingEnabled: boolean) => void;
   +toggleElementInspector: () => void;
   +addMenuItem: (title: string) => void;

package/src/private/{specs → specs_DEPRECATED}/modules/NativeExceptionsManager.js

@@ -12,7 +12,7 @@ import type {TurboModule} from '../../../../Libraries/TurboModule/RCTExport';
 
 import * as TurboModuleRegistry from '../../../../Libraries/TurboModule/TurboModuleRegistry';
 
-const Platform = require('../../../../Libraries/Utilities/Platform');
+const Platform = require('../../../../Libraries/Utilities/Platform').default;
 
 export type StackFrame = {
   column: ?number,

package/src/private/{specs → specs_DEPRECATED}/modules/NativePermissionsAndroid.js

@@ -15,6 +15,7 @@ import * as TurboModuleRegistry from '../../../../Libraries/TurboModule/TurboMod
 // TODO: Use proper enum types.
 export type PermissionStatus = string;
 export type PermissionType = string;
+
 /*
 export type PermissionStatus = 'granted' | 'denied' | 'never_ask_again';
 export type PermissionType =
@@ -45,9 +46,9 @@ export type PermissionType =
   | 'android.permission.RECEIVE_WAP_PUSH'
   | 'android.permission.RECEIVE_MMS'
   | 'android.permission.READ_EXTERNAL_STORAGE'
-  | 'android.permission.READ_MEDIA_IMAGES',
-  | 'android.permission.READ_MEDIA_VIDEO',
-  | 'android.permission.READ_MEDIA_AUDIO',
+  | 'android.permission.READ_MEDIA_IMAGES'
+  | 'android.permission.READ_MEDIA_VIDEO'
+  | 'android.permission.READ_MEDIA_AUDIO'
   | 'android.permission.READ_MEDIA_VISUAL_USER_SELECTED'
   | 'android.permission.WRITE_EXTERNAL_STORAGE'
   | 'android.permission.BLUETOOTH_CONNECT'
@@ -61,7 +62,7 @@ export type PermissionType =
   | 'android.permission.UWB_RANGING'
   | 'android.permission.POST_NOTIFICATIONS'
   | 'android.permission.NEARBY_WIFI_DEVICES';
-*/
+  */
 
 export interface Spec extends TurboModule {
   +checkPermission: (permission: PermissionType) => Promise<boolean>;

package/src/private/specs_DEPRECATED/modules/NativeUIManager.js

@@ -0,0 +1,184 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ * @format
+ */
+
+import type {RootTag} from '../../../../Libraries/TurboModule/RCTExport';
+import type {TurboModule} from '../../../../Libraries/TurboModule/RCTExport';
+
+import * as TurboModuleRegistry from '../../../../Libraries/TurboModule/TurboModuleRegistry';
+
+export type MeasureOnSuccessCallback = (
+  x: number,
+  y: number,
+  width: number,
+  height: number,
+  pageX: number,
+  pageY: number,
+) => void;
+
+export type MeasureInWindowOnSuccessCallback = (
+  x: number,
+  y: number,
+  width: number,
+  height: number,
+) => void;
+
+export type MeasureLayoutOnSuccessCallback = (
+  left: number,
+  top: number,
+  width: number,
+  height: number,
+) => void;
+
+export interface Spec extends TurboModule {
+  +getConstants: () => Object;
+  +createView: (
+    reactTag: number,
+    viewName: string,
+    rootTag: RootTag,
+    props: Object,
+  ) => void;
+  +updateView: (reactTag: number, viewName: string, props: Object) => void;
+  +findSubviewIn: (
+    reactTag: number,
+    point: Array<number>,
+    callback: (
+      nativeViewTag: number,
+      left: number,
+      top: number,
+      width: number,
+      height: number,
+    ) => void,
+  ) => void;
+  /**
+   * Used to call a native view method from JavaScript
+   *
+   * reactTag - Id of react view.
+   * commandID - Id of the native method that should be called.
+   * commandArgs - Args of the native method that we can pass from JS to native.
+   */
+  +dispatchViewManagerCommand: (
+    reactTag: number,
+    commandID: number, // number || string
+    commandArgs?: Array<any>,
+  ) => void;
+  /**
+   * Determines the location on screen, width, and height of the given view and
+   * returns the values via an async callback. If successful, the callback will
+   * be called with the following arguments:
+   *
+   *  - x
+   *  - y
+   *  - width
+   *  - height
+   *  - pageX
+   *  - pageY
+   *
+   * Note that these measurements are not available until after the rendering
+   * has been completed in native. If you need the measurements as soon as
+   * possible, consider using the [`onLayout`
+   * prop](docs/view.html#onlayout) instead.
+   *
+   * @deprecated Use `ref.measure` instead.
+   */
+  +measure: (reactTag: number, callback: MeasureOnSuccessCallback) => void;
+  /**
+   * Determines the location of the given view in the window and returns the
+   * values via an async callback. If the React root view is embedded in
+   * another native view, this will give you the absolute coordinates. If
+   * successful, the callback will be called with the following
+   * arguments:
+   *
+   *  - x
+   *  - y
+   *  - width
+   *  - height
+   *
+   * Note that these measurements are not available until after the rendering
+   * has been completed in native.
+   *
+   * @deprecated Use `ref.measureInWindow` instead.
+   */
+  +measureInWindow: (
+    reactTag: number,
+    callback: MeasureInWindowOnSuccessCallback,
+  ) => void;
+  +viewIsDescendantOf: (
+    reactTag: number,
+    ancestorReactTag: number,
+    callback: (result: Array<boolean>) => void,
+  ) => void;
+  /**
+   * Like [`measure()`](#measure), but measures the view relative an ancestor,
+   * specified as `relativeToNativeNode`. This means that the returned x, y
+   * are relative to the origin x, y of the ancestor view.
+   *
+   * As always, to obtain a native node handle for a component, you can use
+   * `React.findNodeHandle(component)`.
+   *
+   * @deprecated Use `ref.measureLayout` instead.
+   */
+  +measureLayout: (
+    reactTag: number,
+    ancestorReactTag: number,
+    errorCallback: (error: Object) => void,
+    callback: MeasureLayoutOnSuccessCallback,
+  ) => void;
+  +measureLayoutRelativeToParent: (
+    reactTag: number,
+    errorCallback: (error: Object) => void,
+    callback: (
+      left: number,
+      top: number,
+      width: number,
+      height: number,
+    ) => void,
+  ) => void;
+  +setJSResponder: (reactTag: number, blockNativeResponder: boolean) => void;
+  +clearJSResponder: () => void;
+  +configureNextLayoutAnimation: (
+    config: Object,
+    callback: () => void, // check what is returned here
+    errorCallback: (error: Object) => void,
+  ) => void;
+  +setChildren: (containerTag: number, reactTags: Array<number>) => void;
+  +manageChildren: (
+    containerTag: number,
+    moveFromIndices: Array<number>,
+    moveToIndices: Array<number>,
+    addChildReactTags: Array<number>,
+    addAtIndices: Array<number>,
+    removeAtIndices: Array<number>,
+  ) => void;
+
+  // Android only
+  +getConstantsForViewManager?: (viewManagerName: string) => ?Object;
+  +getDefaultEventTypes?: () => Array<string>;
+  /**
+   * Automatically animates views to their new positions when the
+   * next layout happens.
+   *
+   * A common way to use this API is to call it before calling `setState`.
+   *
+   * Note that in order to get this to work on **Android** you need to set the following flags via `UIManager`:
+   *
+   * ```js
+   * UIManager.setLayoutAnimationEnabledExperimental && UIManager.setLayoutAnimationEnabledExperimental(true);
+   * ```
+   */
+  +setLayoutAnimationEnabledExperimental?: (enabled: boolean) => void;
+  +sendAccessibilityEvent?: (reactTag: number, eventType: number) => void;
+
+  // ios only
+  +lazilyLoadView?: (name: string) => Object; // revisit return
+  +focus?: (reactTag: number) => void;
+  +blur?: (reactTag: number) => void;
+}
+
+export default (TurboModuleRegistry.getEnforcing<Spec>('UIManager'): Spec);

package/src/private/webapis/dom/events/CustomEvent.js

@@ -0,0 +1,38 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict
+ * @format
+ */
+
+/**
+ * This module implements the `CustomEvent` interface from the DOM.
+ * See https://dom.spec.whatwg.org/#interface-customevent.
+ */
+
+// flowlint unsafe-getters-setters:off
+
+import type {EventInit} from './Event';
+
+import Event from './Event';
+
+export interface CustomEventInit extends EventInit {
+  +detail?: mixed;
+}
+
+export default class CustomEvent extends Event {
+  _detail: mixed;
+
+  constructor(type: string, options?: ?CustomEventInit) {
+    super(type, options);
+
+    this._detail = options?.detail;
+  }
+
+  get detail(): mixed {
+    return this._detail;
+  }
+}