@office-iss/react-native-win32 0.0.0-canary.270 → 0.0.0-canary.272

package/src/private/featureflags/ReactNativeFeatureFlags.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<e161b67cb919ad7e2e67ddcb3c501adb>>
+ * @generated SignedSource<<1ef57002084a2e38a69b43b7d4d557a9>>
  * @flow strict
  */
 
@@ -36,6 +36,7 @@ export type ReactNativeFeatureFlagsJsOnly = {
   enableAnimatedPropsMemo: Getter<boolean>,
   enableOptimisedVirtualizedCells: Getter<boolean>,
   isLayoutAnimationEnabled: Getter<boolean>,
+  scheduleAnimatedEndCallbackInMicrotask: Getter<boolean>,
   shouldSkipStateUpdatesForLoopingAnimations: Getter<boolean>,
   shouldUseAnimatedObjectForTransform: Getter<boolean>,
   shouldUseRemoveClippedSubviewsAsDefaultOnIOS: Getter<boolean>,
@@ -53,10 +54,8 @@ export type ReactNativeFeatureFlags = {
   allowRecursiveCommitsWithSynchronousMountOnAndroid: Getter<boolean>,
   batchRenderingUpdatesInEventLoop: Getter<boolean>,
   completeReactInstanceCreationOnBgThreadOnAndroid: Getter<boolean>,
-  destroyFabricSurfacesInReactInstanceManager: Getter<boolean>,
   enableAlignItemsBaselineOnFabricIOS: Getter<boolean>,
   enableAndroidLineHeightCentering: Getter<boolean>,
-  enableBackgroundStyleApplicator: Getter<boolean>,
   enableBridgelessArchitecture: Getter<boolean>,
   enableCleanTextInputYogaNode: Getter<boolean>,
   enableDeletionOfUnmountedViews: Getter<boolean>,
@@ -67,6 +66,7 @@ export type ReactNativeFeatureFlags = {
   enableFabricRendererExclusively: Getter<boolean>,
   enableGranularShadowTreeStateReconciliation: Getter<boolean>,
   enableIOSViewClipToPaddingBox: Getter<boolean>,
+  enableLayoutAnimationsOnAndroid: Getter<boolean>,
   enableLayoutAnimationsOnIOS: Getter<boolean>,
   enableLongTaskAPI: Getter<boolean>,
   enableMicrotasks: Getter<boolean>,
@@ -94,11 +94,9 @@ export type ReactNativeFeatureFlags = {
   useImmediateExecutorInAndroidBridgeless: Getter<boolean>,
   useModernRuntimeScheduler: Getter<boolean>,
   useNativeViewConfigsInBridgelessMode: Getter<boolean>,
-  useNewReactImageViewBackgroundDrawing: Getter<boolean>,
   useOptimisedViewPreallocationOnAndroid: Getter<boolean>,
   useOptimizedEventBatchingOnAndroid: Getter<boolean>,
   useRuntimeShadowNodeReferenceUpdate: Getter<boolean>,
-  useRuntimeShadowNodeReferenceUpdateOnLayout: Getter<boolean>,
   useTurboModuleInterop: Getter<boolean>,
   useTurboModules: Getter<boolean>,
 }
@@ -148,6 +146,11 @@ export const enableOptimisedVirtualizedCells: Getter<boolean> = createJavaScript
  */
 export const isLayoutAnimationEnabled: Getter<boolean> = createJavaScriptFlagGetter('isLayoutAnimationEnabled', true);
 
+/**
+ * Changes the completion callback supplied via `Animation#start` to be scheduled in a microtask instead of synchronously executed.
+ */
+export const scheduleAnimatedEndCallbackInMicrotask: Getter<boolean> = createJavaScriptFlagGetter('scheduleAnimatedEndCallbackInMicrotask', false);
+
 /**
  * If the animation is within Animated.loop, we do not send state updates to React.
  */
@@ -199,10 +202,6 @@ export const batchRenderingUpdatesInEventLoop: Getter<boolean> = createNativeFla
  * Do not wait for a main-thread dispatch to complete init to start executing work on the JS thread on Android
  */
 export const completeReactInstanceCreationOnBgThreadOnAndroid: Getter<boolean> = createNativeFlagGetter('completeReactInstanceCreationOnBgThreadOnAndroid', false);
-/**
- * When enabled, ReactInstanceManager will clean up Fabric surfaces on destroy().
- */
-export const destroyFabricSurfacesInReactInstanceManager: Getter<boolean> = createNativeFlagGetter('destroyFabricSurfacesInReactInstanceManager', false);
 /**
  * Kill-switch to turn off support for aling-items:baseline on Fabric iOS.
  */
@@ -211,10 +210,6 @@ export const enableAlignItemsBaselineOnFabricIOS: Getter<boolean> = createNative
  * When enabled, custom line height calculation will be centered from top to bottom.
  */
 export const enableAndroidLineHeightCentering: Getter<boolean> = createNativeFlagGetter('enableAndroidLineHeightCentering', false);
-/**
- * Use BackgroundStyleApplicator in place of other background/border drawing code
- */
-export const enableBackgroundStyleApplicator: Getter<boolean> = createNativeFlagGetter('enableBackgroundStyleApplicator', true);
 /**
  * Feature flag to enable the new bridgeless architecture. Note: Enabling this will force enable the following flags: `useTurboModules` & `enableFabricRenderer.
  */
@@ -255,6 +250,10 @@ export const enableGranularShadowTreeStateReconciliation: Getter<boolean> = crea
  * iOS Views will clip to their padding box vs border box
  */
 export const enableIOSViewClipToPaddingBox: Getter<boolean> = createNativeFlagGetter('enableIOSViewClipToPaddingBox', false);
+/**
+ * When enabled, LayoutAnimations API will animate state changes on Android.
+ */
+export const enableLayoutAnimationsOnAndroid: Getter<boolean> = createNativeFlagGetter('enableLayoutAnimationsOnAndroid', false);
 /**
  * When enabled, LayoutAnimations API will animate state changes on iOS.
  */
@@ -342,7 +341,7 @@ export const removeNestedCallsToDispatchMountItemsOnAndroid: Getter<boolean> = c
 /**
  * Propagate layout direction to Android views.
  */
-export const setAndroidLayoutDirection: Getter<boolean> = createNativeFlagGetter('setAndroidLayoutDirection', false);
+export const setAndroidLayoutDirection: Getter<boolean> = createNativeFlagGetter('setAndroidLayoutDirection', true);
 /**
  * Enables storing js caller stack when creating promise in native module. This is useful in case of Promise rejection and tracing the cause.
  */
@@ -363,10 +362,6 @@ export const useModernRuntimeScheduler: Getter<boolean> = createNativeFlagGetter
  * When enabled, the native view configs are used in bridgeless mode.
  */
 export const useNativeViewConfigsInBridgelessMode: Getter<boolean> = createNativeFlagGetter('useNativeViewConfigsInBridgelessMode', false);
-/**
- * Use shared background drawing code for ReactImageView instead of using Fresco to manipulate the bitmap
- */
-export const useNewReactImageViewBackgroundDrawing: Getter<boolean> = createNativeFlagGetter('useNewReactImageViewBackgroundDrawing', false);
 /**
  * Moves more of the work in view preallocation to the main thread to free up JS thread.
  */
@@ -379,10 +374,6 @@ export const useOptimizedEventBatchingOnAndroid: Getter<boolean> = createNativeF
  * When enabled, cloning shadow nodes within react native will update the reference held by the current JS fiber tree.
  */
 export const useRuntimeShadowNodeReferenceUpdate: Getter<boolean> = createNativeFlagGetter('useRuntimeShadowNodeReferenceUpdate', false);
-/**
- * When enabled, cloning shadow nodes during layout will update the reference held by the current JS fiber tree.
- */
-export const useRuntimeShadowNodeReferenceUpdateOnLayout: Getter<boolean> = createNativeFlagGetter('useRuntimeShadowNodeReferenceUpdateOnLayout', false);
 /**
  * In Bridgeless mode, should legacy NativeModules use the TurboModule system?
  */

package/src/private/featureflags/specs/NativeReactNativeFeatureFlags.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<cd4a2a047e3a6fdb4205efb518906462>>
+ * @generated SignedSource<<e6477fcd9bf64a5c84496dfb55ae3700>>
  * @flow strict
  */
 
@@ -27,10 +27,8 @@ export interface Spec extends TurboModule {
   +allowRecursiveCommitsWithSynchronousMountOnAndroid?: () => boolean;
   +batchRenderingUpdatesInEventLoop?: () => boolean;
   +completeReactInstanceCreationOnBgThreadOnAndroid?: () => boolean;
-  +destroyFabricSurfacesInReactInstanceManager?: () => boolean;
   +enableAlignItemsBaselineOnFabricIOS?: () => boolean;
   +enableAndroidLineHeightCentering?: () => boolean;
-  +enableBackgroundStyleApplicator?: () => boolean;
   +enableBridgelessArchitecture?: () => boolean;
   +enableCleanTextInputYogaNode?: () => boolean;
   +enableDeletionOfUnmountedViews?: () => boolean;
@@ -41,6 +39,7 @@ export interface Spec extends TurboModule {
   +enableFabricRendererExclusively?: () => boolean;
   +enableGranularShadowTreeStateReconciliation?: () => boolean;
   +enableIOSViewClipToPaddingBox?: () => boolean;
+  +enableLayoutAnimationsOnAndroid?: () => boolean;
   +enableLayoutAnimationsOnIOS?: () => boolean;
   +enableLongTaskAPI?: () => boolean;
   +enableMicrotasks?: () => boolean;
@@ -68,11 +67,9 @@ export interface Spec extends TurboModule {
   +useImmediateExecutorInAndroidBridgeless?: () => boolean;
   +useModernRuntimeScheduler?: () => boolean;
   +useNativeViewConfigsInBridgelessMode?: () => boolean;
-  +useNewReactImageViewBackgroundDrawing?: () => boolean;
   +useOptimisedViewPreallocationOnAndroid?: () => boolean;
   +useOptimizedEventBatchingOnAndroid?: () => boolean;
   +useRuntimeShadowNodeReferenceUpdate?: () => boolean;
-  +useRuntimeShadowNodeReferenceUpdateOnLayout?: () => boolean;
   +useTurboModuleInterop?: () => boolean;
   +useTurboModules?: () => boolean;
 }

package/src/private/fusebox/specs/NativeReactDevToolsRuntimeSettingsModule.js

@@ -0,0 +1,34 @@
+/**
+ * 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-local
+ * @format
+ * @oncall react_native
+ */
+
+import type {TurboModule} from '../../../../Libraries/TurboModule/RCTExport';
+
+import * as TurboModuleRegistry from '../../../../Libraries/TurboModule/TurboModuleRegistry';
+
+export type ReloadAndProfileConfig = {
+  shouldReloadAndProfile: boolean,
+  recordChangeDescriptions: boolean,
+};
+
+// Linter doesn't speak Flow's `Partial` type
+export type PartialReloadAndProfileConfig = {
+  shouldReloadAndProfile?: boolean,
+  recordChangeDescriptions?: boolean,
+};
+
+export interface Spec extends TurboModule {
+  +setReloadAndProfileConfig: (config: PartialReloadAndProfileConfig) => void;
+  +getReloadAndProfileConfig: () => ReloadAndProfileConfig;
+}
+
+export default (TurboModuleRegistry.get<Spec>(
+  'ReactDevToolsRuntimeSettingsModule',
+): ?Spec);

package/src/private/specs/modules/NativeAccessibilityInfo.js

@@ -16,6 +16,9 @@ export interface Spec extends TurboModule {
   +isReduceMotionEnabled: (
     onSuccess: (isReduceMotionEnabled: boolean) => void,
   ) => void;
+  +isHighTextContrastEnabled?: (
+    onSuccess: (isHighTextContrastEnabled: boolean) => void,
+  ) => void;
   +isTouchExplorationEnabled: (
     onSuccess: (isScreenReaderEnabled: boolean) => void,
   ) => void;

package/src/private/specs/modules/NativeAccessibilityInfoWin32.js

@@ -16,6 +16,9 @@ export interface Spec extends TurboModule {
   +isReduceMotionEnabled: (
     onSuccess: (isReduceMotionEnabled: boolean) => void,
   ) => void;
+  +isHighTextContrastEnabled?: (
+    onSuccess: (isHighTextContrastEnabled: boolean) => void,
+  ) => void;
   +isTouchExplorationEnabled: (
     onSuccess: (isScreenReaderEnabled: boolean) => void,
   ) => void;

package/src/private/specs/modules/NativeAccessibilityManager.js

@@ -29,6 +29,10 @@ export interface Spec extends TurboModule {
     onSuccess: (isReduceMotionEnabled: boolean) => void,
     onError: (error: Object) => void,
   ) => void;
+  +getCurrentDarkerSystemColorsState?: (
+    onSuccess: (isDarkerSystemColorsEnabled: boolean) => void,
+    onError: (error: Object) => void,
+  ) => void;
   +getCurrentPrefersCrossFadeTransitionsState?: (
     onSuccess: (prefersCrossFadeTransitions: boolean) => void,
     onError: (error: Object) => void,

package/src/private/specs/modules/NativeAppearance.js

@@ -12,21 +12,15 @@ import type {TurboModule} from '../../../../Libraries/TurboModule/RCTExport';
 
 import * as TurboModuleRegistry from '../../../../Libraries/TurboModule/TurboModuleRegistry';
 
-export type ColorSchemeName = 'light' | 'dark';
+export type ColorSchemeName = 'light' | 'dark' | 'unspecified';
 
 export type AppearancePreferences = {
-  // TODO: (hramos) T52919652 Use ?ColorSchemeName once codegen supports union
-  // types.
-  /* 'light' | 'dark' */
-  colorScheme?: ?string,
+  colorScheme?: ?ColorSchemeName,
 };
 
 export interface Spec extends TurboModule {
-  // TODO: (hramos) T52919652 Use ?ColorSchemeName once codegen supports union
-  // types.
-  /* 'light' | 'dark' */
-  +getColorScheme: () => ?string;
-  +setColorScheme: (colorScheme: string) => void;
+  +getColorScheme: () => ?ColorSchemeName;
+  +setColorScheme: (colorScheme: ColorSchemeName) => void;
 
   // RCTEventEmitter
   +addListener: (eventName: string) => void;

package/src/private/webapis/dom/nodes/ReactNativeElement.js

@@ -11,7 +11,7 @@
 // flowlint unsafe-getters-setters:off
 
 import type {
-  HostComponent,
+  HostInstance,
   INativeMethods,
   InternalInstanceHandle,
   MeasureInWindowOnSuccessCallback,
@@ -19,7 +19,6 @@ import type {
   MeasureOnSuccessCallback,
   ViewConfig,
 } from '../../../../../Libraries/Renderer/shims/ReactNativeTypes';
-import type {ElementRef} from 'react';
 
 import TextInputState from '../../../../../Libraries/Components/TextInput/TextInputState';
 import {getFabricUIManager} from '../../../../../Libraries/ReactNative/FabricUIManager';
@@ -143,7 +142,7 @@ export default class ReactNativeElement
   }
 
   measureLayout(
-    relativeToNativeNode: number | ElementRef<HostComponent<mixed>>,
+    relativeToNativeNode: number | HostInstance,
     onSuccess: MeasureLayoutOnSuccessCallback,
     onFail?: () => void /* currently unused */,
   ) {

package/src/private/webapis/performance/EventTiming.js

@@ -16,8 +16,8 @@ import type {
 } from './PerformanceEntry';
 
 import {PerformanceEntry} from './PerformanceEntry';
-import {warnNoNativePerformanceObserver} from './Utilities';
-import NativePerformanceObserver from './specs/NativePerformanceObserver';
+import {warnNoNativePerformance} from './Utilities';
+import NativePerformance from './specs/NativePerformance';
 
 export type PerformanceEventTimingJSON = {
   ...PerformanceEntryJSON,
@@ -85,14 +85,18 @@ function getCachedEventCounts(): Map<string, number> {
   if (cachedEventCounts) {
     return cachedEventCounts;
   }
-  if (!NativePerformanceObserver) {
-    warnNoNativePerformanceObserver();
-    return new Map();
+
+  if (!NativePerformance || !NativePerformance?.getEventCounts) {
+    warnNoNativePerformance();
+    cachedEventCounts = new Map();
+    return cachedEventCounts;
   }
 
-  cachedEventCounts = new Map<string, number>(
-    NativePerformanceObserver.getEventCounts(),
+  const eventCounts = new Map<string, number>(
+    NativePerformance.getEventCounts?.() ?? [],
   );
+  cachedEventCounts = eventCounts;
+
   // $FlowFixMe[incompatible-call]
   global.queueMicrotask(() => {
     // To be consistent with the calls to the API from the same task,
@@ -101,7 +105,8 @@ function getCachedEventCounts(): Map<string, number> {
     // after the current task is guaranteed to have finished.
     cachedEventCounts = null;
   });
-  return cachedEventCounts ?? new Map();
+
+  return eventCounts;
 }
 
 /**

package/src/private/webapis/performance/Performance.js

@@ -13,22 +13,18 @@
 import type {
   DOMHighResTimeStamp,
   PerformanceEntryType,
+  PerformanceEntryList,
 } from './PerformanceEntry';
-import type {PerformanceEntryList} from './PerformanceObserver';
 import type {DetailType, PerformanceMarkOptions} from './UserTiming';
 
 import {EventCounts} from './EventTiming';
 import MemoryInfo from './MemoryInfo';
-import {ALWAYS_LOGGED_ENTRY_TYPES} from './PerformanceEntry';
-import {warnNoNativePerformanceObserver} from './Utilities';
 import {
   performanceEntryTypeToRaw,
   rawToPerformanceEntry,
 } from './RawPerformanceEntry';
-import {RawPerformanceEntryTypeValues} from './RawPerformanceEntry';
 import ReactNativeStartupTiming from './ReactNativeStartupTiming';
 import NativePerformance from './specs/NativePerformance';
-import NativePerformanceObserver from './specs/NativePerformanceObserver';
 import {PerformanceMark, PerformanceMeasure} from './UserTiming';
 import {warnNoNativePerformance} from './Utilities';
 
@@ -47,6 +43,9 @@ export type PerformanceMeasureOptions = {
   end?: DOMHighResTimeStamp,
 };
 
+const ENTRY_TYPES_AVAILABLE_FROM_TIMELINE: $ReadOnlyArray<PerformanceEntryType> =
+  ['mark', 'measure'];
+
 /**
  * Partial implementation of the Performance interface for RN,
  * corresponding to the standard in
@@ -122,15 +121,12 @@ export default class Performance {
   }
 
   clearMarks(markName?: string): void {
-    if (!NativePerformanceObserver?.clearEntries) {
-      warnNoNativePerformanceObserver();
+    if (!NativePerformance?.clearMarks) {
+      warnNoNativePerformance();
       return;
     }
 
-    NativePerformanceObserver.clearEntries(
-      RawPerformanceEntryTypeValues.MARK,
-      markName,
-    );
+    NativePerformance.clearMarks(markName);
   }
 
   measure(
@@ -209,15 +205,12 @@ export default class Performance {
   }
 
   clearMeasures(measureName?: string): void {
-    if (!NativePerformanceObserver?.clearEntries) {
-      warnNoNativePerformanceObserver();
+    if (!NativePerformance?.clearMeasures) {
+      warnNoNativePerformance();
       return;
     }
 
-    NativePerformanceObserver?.clearEntries(
-      RawPerformanceEntryTypeValues.MEASURE,
-      measureName,
-    );
+    NativePerformance?.clearMeasures(measureName);
   }
 
   /**
@@ -234,28 +227,28 @@ export default class Performance {
    * https://www.w3.org/TR/performance-timeline/#extensions-to-the-performance-interface
    */
   getEntries(): PerformanceEntryList {
-    if (!NativePerformanceObserver?.getEntries) {
-      warnNoNativePerformanceObserver();
+    if (!NativePerformance?.getEntries) {
+      warnNoNativePerformance();
       return [];
     }
-    return NativePerformanceObserver.getEntries().map(rawToPerformanceEntry);
+    return NativePerformance.getEntries().map(rawToPerformanceEntry);
   }
 
   getEntriesByType(entryType: PerformanceEntryType): PerformanceEntryList {
-    if (!ALWAYS_LOGGED_ENTRY_TYPES.includes(entryType)) {
-      console.warn(
-        `Performance.getEntriesByType: Only valid for ${JSON.stringify(
-          ALWAYS_LOGGED_ENTRY_TYPES,
-        )} entry types, got ${entryType}`,
-      );
+    if (
+      entryType != null &&
+      !ENTRY_TYPES_AVAILABLE_FROM_TIMELINE.includes(entryType)
+    ) {
+      console.warn('Deprecated API for given entry type.');
       return [];
     }
 
-    if (!NativePerformanceObserver?.getEntries) {
-      warnNoNativePerformanceObserver();
+    if (!NativePerformance?.getEntriesByType) {
+      warnNoNativePerformance();
       return [];
     }
-    return NativePerformanceObserver.getEntries(
+
+    return NativePerformance.getEntriesByType(
       performanceEntryTypeToRaw(entryType),
     ).map(rawToPerformanceEntry);
   }
@@ -265,24 +258,21 @@ export default class Performance {
     entryType?: PerformanceEntryType,
   ): PerformanceEntryList {
     if (
-      entryType !== undefined &&
-      !ALWAYS_LOGGED_ENTRY_TYPES.includes(entryType)
+      entryType != null &&
+      !ENTRY_TYPES_AVAILABLE_FROM_TIMELINE.includes(entryType)
     ) {
-      console.warn(
-        `Performance.getEntriesByName: Only valid for ${JSON.stringify(
-          ALWAYS_LOGGED_ENTRY_TYPES,
-        )} entry types, got ${entryType}`,
-      );
+      console.warn('Deprecated API for given entry type.');
       return [];
     }
 
-    if (!NativePerformanceObserver?.getEntries) {
-      warnNoNativePerformanceObserver();
+    if (!NativePerformance?.getEntriesByName) {
+      warnNoNativePerformance();
       return [];
     }
-    return NativePerformanceObserver.getEntries(
-      entryType != null ? performanceEntryTypeToRaw(entryType) : undefined,
+
+    return NativePerformance.getEntriesByName(
       entryName,
+      entryType != null ? performanceEntryTypeToRaw(entryType) : undefined,
     ).map(rawToPerformanceEntry);
   }
 }

package/src/private/webapis/performance/PerformanceEntry.js

@@ -21,11 +21,6 @@ export type PerformanceEntryJSON = {
   ...
 };
 
-export const ALWAYS_LOGGED_ENTRY_TYPES: $ReadOnlyArray<PerformanceEntryType> = [
-  'mark',
-  'measure',
-];
-
 export class PerformanceEntry {
   #name: string;
   #entryType: PerformanceEntryType;
@@ -69,3 +64,5 @@ export class PerformanceEntry {
     };
   }
 }
+
+export type PerformanceEntryList = $ReadOnlyArray<PerformanceEntry>;

package/src/private/webapis/performance/PerformanceObserver.js

@@ -11,20 +11,18 @@
 import type {
   DOMHighResTimeStamp,
   PerformanceEntryType,
+  PerformanceEntryList,
 } from './PerformanceEntry';
 
 import {PerformanceEventTiming} from './EventTiming';
-import {PerformanceEntry} from './PerformanceEntry';
 import {
   performanceEntryTypeToRaw,
   rawToPerformanceEntry,
   rawToPerformanceEntryType,
 } from './RawPerformanceEntry';
-import NativePerformanceObserver from './specs/NativePerformanceObserver';
-import type {OpaqueNativeObserverHandle} from './specs/NativePerformanceObserver';
-import {warnNoNativePerformanceObserver} from './Utilities';
-
-export type PerformanceEntryList = $ReadOnlyArray<PerformanceEntry>;
+import NativePerformance from './specs/NativePerformance';
+import type {OpaqueNativeObserverHandle} from './specs/NativePerformance';
+import {warnNoNativePerformance} from './Utilities';
 
 export {PerformanceEntry} from './PerformanceEntry';
 
@@ -76,15 +74,15 @@ export type PerformanceObserverInit = {
 };
 
 function getSupportedPerformanceEntryTypes(): $ReadOnlyArray<PerformanceEntryType> {
-  if (!NativePerformanceObserver) {
+  if (!NativePerformance) {
     return Object.freeze([]);
   }
-  if (!NativePerformanceObserver.getSupportedPerformanceEntryTypes) {
+  if (!NativePerformance.getSupportedPerformanceEntryTypes) {
     // fallback if getSupportedPerformanceEntryTypes is not defined on native side
     return Object.freeze(['mark', 'measure', 'event']);
   }
   return Object.freeze(
-    NativePerformanceObserver.getSupportedPerformanceEntryTypes().map(
+    NativePerformance.getSupportedPerformanceEntryTypes().map(
       rawToPerformanceEntryType,
     ),
   );
@@ -121,11 +119,8 @@ export class PerformanceObserver {
   }
 
   observe(options: PerformanceObserverInit): void {
-    if (
-      !NativePerformanceObserver ||
-      NativePerformanceObserver.observe == null
-    ) {
-      warnNoNativePerformanceObserver();
+    if (!NativePerformance || NativePerformance.observe == null) {
+      warnNoNativePerformance();
       return;
     }
 
@@ -137,12 +132,12 @@ export class PerformanceObserver {
 
     if (options.entryTypes) {
       this.#type = 'multiple';
-      NativePerformanceObserver.observe?.(this.#nativeObserverHandle, {
+      NativePerformance.observe?.(this.#nativeObserverHandle, {
         entryTypes: options.entryTypes.map(performanceEntryTypeToRaw),
       });
     } else if (options.type) {
       this.#type = 'single';
-      NativePerformanceObserver.observe?.(this.#nativeObserverHandle, {
+      NativePerformance.observe?.(this.#nativeObserverHandle, {
         type: performanceEntryTypeToRaw(options.type),
         buffered: options.buffered,
         durationThreshold: options.durationThreshold,
@@ -151,35 +146,28 @@ export class PerformanceObserver {
   }
 
   disconnect(): void {
-    if (!NativePerformanceObserver) {
-      warnNoNativePerformanceObserver();
+    if (!NativePerformance) {
+      warnNoNativePerformance();
       return;
     }
 
-    if (
-      this.#nativeObserverHandle == null ||
-      !NativePerformanceObserver.disconnect
-    ) {
+    if (this.#nativeObserverHandle == null || !NativePerformance.disconnect) {
       return;
     }
 
-    NativePerformanceObserver.disconnect(this.#nativeObserverHandle);
+    NativePerformance.disconnect(this.#nativeObserverHandle);
   }
 
   #createNativeObserver(): OpaqueNativeObserverHandle {
-    if (
-      !NativePerformanceObserver ||
-      !NativePerformanceObserver.createObserver
-    ) {
-      warnNoNativePerformanceObserver();
+    if (!NativePerformance || !NativePerformance.createObserver) {
+      warnNoNativePerformance();
       return;
     }
 
     this.#calledAtLeastOnce = false;
 
-    return NativePerformanceObserver.createObserver(() => {
-      // $FlowNotNull
-      const rawEntries = NativePerformanceObserver.takeRecords?.(
+    return NativePerformance.createObserver(() => {
+      const rawEntries = NativePerformance.takeRecords?.(
         this.#nativeObserverHandle,
         true, // sort records
       );
@@ -193,7 +181,7 @@ export class PerformanceObserver {
       let droppedEntriesCount = 0;
       if (!this.#calledAtLeastOnce) {
         droppedEntriesCount =
-          NativePerformanceObserver.getDroppedEntriesCount?.(
+          NativePerformance.getDroppedEntriesCount?.(
             this.#nativeObserverHandle,
           ) ?? 0;
         this.#calledAtLeastOnce = true;

package/src/private/webapis/performance/RawPerformanceEntry.js

@@ -12,7 +12,7 @@ import type {PerformanceEntryType} from './PerformanceEntry';
 import type {
   RawPerformanceEntry,
   RawPerformanceEntryType,
-} from './specs/NativePerformanceObserver';
+} from './specs/NativePerformance';
 
 import {PerformanceEventTiming} from './EventTiming';
 import {PerformanceLongTaskTiming} from './LongTasks';

package/src/private/webapis/performance/UserTiming.js

@@ -30,7 +30,7 @@ export type PerformanceMeasureInit = {
 };
 
 export class PerformanceMark extends PerformanceEntry {
-  detail: DetailType;
+  #detail: DetailType;
 
   constructor(markName: string, markOptions?: PerformanceMarkOptions) {
     super({
@@ -41,9 +41,13 @@ export class PerformanceMark extends PerformanceEntry {
     });
 
     if (markOptions) {
-      this.detail = markOptions.detail;
+      this.#detail = markOptions.detail;
     }
   }
+
+  get detail(): DetailType {
+    return this.#detail;
+  }
 }
 
 export class PerformanceMeasure extends PerformanceEntry {

package/src/private/webapis/performance/Utilities.js

@@ -16,10 +16,3 @@ export function warnNoNativePerformance() {
     'Missing native implementation of Performance',
   );
 }
-
-export function warnNoNativePerformanceObserver() {
-  warnOnce(
-    'missing-native-performance-observer',
-    'Missing native implementation of PerformanceObserver',
-  );
-}