Replace legacy compat types with their new names in TS based lib.dom.d.ts in xplat: 2/n

Summary:
X-link: react/metro#1960

Changelog: [Internal]

Reviewed By: gkz

Differential Revision: D121075922

Author: SamChou19815

packages/jest-preset/jest/setup.js

@@ -28,7 +28,7 @@ Object.defineProperties(global, {
   cancelAnimationFrame: {
     configurable: true,
     enumerable: true,
-    value(id: TimeoutID): void {
+    value(id: ReturnType<typeof setTimeout>): void {
       return clearTimeout(id);
     },
     writable: true,
@@ -57,7 +57,7 @@ Object.defineProperties(global, {
   requestAnimationFrame: {
     configurable: true,
     enumerable: true,
-    value(callback: number => void): TimeoutID {
+    value(callback: number => void): ReturnType<typeof setTimeout> {
       return setTimeout(() => callback(jest.now()), 0);
     },
     writable: true,

packages/react-native/Libraries/Animated/animations/SpringAnimation.js

@@ -99,7 +99,7 @@ export default class SpringAnimation extends Animation {
   _mass: number;
   _initialVelocity: number;
   _delay: number;
-  _timeout: ?TimeoutID;
+  _timeout: ?ReturnType<typeof setTimeout>;
   _startTime: number;
   _lastTime: number;
   _frameTime: number;

packages/react-native/Libraries/Animated/animations/TimingAnimation.js

@@ -69,7 +69,7 @@ export default class TimingAnimation extends Animation {
   _easing: (value: number) => number;
   _onUpdate: (value: number) => void;
   _animationFrame: ?number;
-  _timeout: ?TimeoutID;
+  _timeout: ?ReturnType<typeof setTimeout>;
   _platformConfig: ?PlatformConfig;
   _deferredStart: boolean;
 

packages/react-native/Libraries/Components/ScrollView/ScrollViewStickyHeader.js

@@ -119,7 +119,7 @@ const ScrollViewStickyHeader: component(
   );
 
   const haveReceivedInitialZeroTranslateY = useRef<boolean>(true);
-  const translateYDebounceTimer = useRef<?TimeoutID>(null);
+  const translateYDebounceTimer = useRef<?ReturnType<typeof setTimeout>>(null);
 
   useEffect(() => {
     if (translateY !== 0 && translateY != null) {

packages/react-native/Libraries/Components/Touchable/TouchableHighlight.js

@@ -93,7 +93,7 @@ class TouchableHighlightImpl extends React.Component<
   TouchableHighlightProps,
   TouchableHighlightState,
 > {
-  _hideTimeout: ?TimeoutID;
+  _hideTimeout: ?ReturnType<typeof setTimeout>;
   _isMounted: boolean = false;
 
   state: TouchableHighlightState = {

packages/react-native/Libraries/LogBox/Data/LogBoxData.js

@@ -476,7 +476,7 @@ export function withSubscription(
     }
 
     _subscription: ?Subscription;
-    _updateStateOnMountTimeoutId: ?TimeoutID;
+    _updateStateOnMountTimeoutId: ?ReturnType<typeof setTimeout>;
 
     state: LogBoxStateSubscriptionState = {
       hasError: false,

packages/react-native/Libraries/Pressability/Pressability.js

@@ -371,12 +371,12 @@ let longPressDeactivationDistance = DEFAULT_LONG_PRESS_DEACTIVATION_DISTANCE;
 export default class Pressability {
   _config: PressabilityConfig;
   _eventHandlers: ?EventHandlers = null;
-  _hoverInDelayTimeout: ?TimeoutID = null;
-  _hoverOutDelayTimeout: ?TimeoutID = null;
+  _hoverInDelayTimeout: ?ReturnType<typeof setTimeout> = null;
+  _hoverOutDelayTimeout: ?ReturnType<typeof setTimeout> = null;
   _isHovered: boolean = false;
-  _longPressDelayTimeout: ?TimeoutID = null;
-  _pressDelayTimeout: ?TimeoutID = null;
-  _pressOutDelayTimeout: ?TimeoutID = null;
+  _longPressDelayTimeout: ?ReturnType<typeof setTimeout> = null;
+  _pressDelayTimeout: ?ReturnType<typeof setTimeout> = null;
+  _pressOutDelayTimeout: ?ReturnType<typeof setTimeout> = null;
   _responderID: ?number | HostInstance = null;
   _responderRegion: ?Readonly<{
     bottom: number,

packages/react-native/src/private/animated/createAnimatedPropsHook.js

@@ -56,7 +56,7 @@ export default function createAnimatedPropsHook(
   ): [ReducedProps<TProps>, React.RefCallback<TInstance>] {
     const [, scheduleUpdate] = useReducer<number, void>(count => count + 1, 0);
     const onUpdateRef = useRef<UpdateCallback | null>(null);
-    const timerRef = useRef<TimeoutID | null>(null);
+    const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
     const rootTag = useContext(RootTagContext);
 

packages/rn-tester/IntegrationTests/TimersTest.js

@@ -27,10 +27,10 @@ type ImmediateID = Object;
 
 class TimersTest extends React.Component<Props, State> {
   _nextTest = () => {};
-  _interval: ?IntervalID = null;
+  _interval: ?ReturnType<typeof setInterval> = null;
 
-  _timeoutIDs: Set<TimeoutID> = new Set();
-  _intervalIDs: Set<IntervalID> = new Set();
+  _timeoutIDs: Set<ReturnType<typeof setTimeout>> = new Set();
+  _intervalIDs: Set<ReturnType<typeof setInterval>> = new Set();
   _immediateIDs: Set<ImmediateID> = new Set();
   _animationFrameIDs: Set<number> = new Set();
 
@@ -39,8 +39,8 @@ class TimersTest extends React.Component<Props, State> {
     done: false,
   };
 
-  setTimeout(fn: () => void, time: number): TimeoutID {
-    const id: TimeoutID = setTimeout(() => {
+  setTimeout(fn: () => void, time: number): ReturnType<typeof setTimeout> {
+    const id: ReturnType<typeof setTimeout> = setTimeout(() => {
       this._timeoutIDs.delete(id);
       fn();
     }, time);
@@ -50,12 +50,12 @@ class TimersTest extends React.Component<Props, State> {
     return id;
   }
 
-  clearTimeout(id: TimeoutID) {
+  clearTimeout(id: ReturnType<typeof setTimeout>) {
     this._timeoutIDs.delete(id);
     clearTimeout(id);
   }
 
-  setInterval(fn: () => void, time: number): IntervalID {
+  setInterval(fn: () => void, time: number): ReturnType<typeof setInterval> {
     const id = setInterval(() => {
       fn();
     }, time);
@@ -65,7 +65,7 @@ class TimersTest extends React.Component<Props, State> {
     return id;
   }
 
-  clearInterval(id: IntervalID) {
+  clearInterval(id: ReturnType<typeof setInterval>) {
     this._intervalIDs.delete(id);
     clearInterval(id);
   }

packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js

@@ -1251,13 +1251,13 @@ class FakeSliderExampleForAccessibilityValue extends React.Component<
 }
 
 class AnnounceForAccessibility extends React.Component<{}> {
-  _handleOnPress = (): TimeoutID =>
+  _handleOnPress = (): ReturnType<typeof setTimeout> =>
     setTimeout(
       () => AccessibilityInfo.announceForAccessibility('Announcement Test'),
       1000,
     );
 
-  _handleOnPressQueued = (): TimeoutID =>
+  _handleOnPressQueued = (): ReturnType<typeof setTimeout> =>
     setTimeout(
       () =>
         AccessibilityInfo.announceForAccessibilityWithOptions(