@react-native-oh/react-native-harmony 0.72.82 → 0.77.18-1

package/Libraries/Components/ScrollView/{ScrollView.harmony.js → ScrollView.js}

@@ -8,77 +8,51 @@
  * @flow strict-local
  */
 
-//RNOH: patch - fix imports
-import type { HostComponent } from "react-native/Libraries/Renderer/shims/ReactNativeTypes";
-import type { EdgeInsetsProp } from "react-native/Libraries/StyleSheet/EdgeInsetsPropType";
-import type { PointProp } from "react-native/Libraries/StyleSheet/PointPropType";
-import type { ViewStyleProp } from "react-native/Libraries/StyleSheet/StyleSheet";
-import type { ColorValue } from "react-native/Libraries/StyleSheet/StyleSheet";
+import type {HostInstance} from '../../Renderer/shims/ReactNativeTypes';
+import type {EdgeInsetsProp} from '../../StyleSheet/EdgeInsetsPropType';
+import type {PointProp} from '../../StyleSheet/PointPropType';
+import type {ViewStyleProp} from '../../StyleSheet/StyleSheet';
+import type {ColorValue} from '../../StyleSheet/StyleSheet';
 import type {
   LayoutEvent,
   PressEvent,
   ScrollEvent,
-} from "react-native/Libraries/Types/CoreEventTypes";
-import type { EventSubscription } from "react-native/Libraries/vendor/emitter/EventEmitter";
-import type {
-  KeyboardEvent,
-  KeyboardMetrics,
-} from "react-native/Libraries/Components/Keyboard/Keyboard";
-import type { ViewProps } from "react-native/Libraries/Components/View/ViewPropTypes";
-import type { Props as ScrollViewStickyHeaderProps } from "react-native/Libraries/Components/ScrollView/ScrollViewStickyHeader";
-
-import AnimatedImplementation from "react-native/Libraries/Animated/AnimatedImplementation";
-import FrameRateLogger from "react-native/Libraries/Interaction/FrameRateLogger";
-import { findNodeHandle } from "react-native/Libraries/ReactNative/RendererProxy";
-import UIManager from "react-native/Libraries/ReactNative/UIManager";
-import flattenStyle from "react-native/Libraries/StyleSheet/flattenStyle";
-import splitLayoutProps from "react-native/Libraries/StyleSheet/splitLayoutProps";
-import StyleSheet from "react-native/Libraries/StyleSheet/StyleSheet";
-import Dimensions from "react-native/Libraries/Utilities/Dimensions";
-import dismissKeyboard from "react-native/Libraries/Utilities/dismissKeyboard";
-import Platform from "../../Utilities/Platform";
-import Keyboard from "react-native/Libraries/Components/Keyboard/Keyboard";
-import TextInputState from "../TextInput/TextInputState.harmony";
-import View from "react-native/Libraries/Components/View/View";
-import AndroidHorizontalScrollContentViewNativeComponent from "react-native/Libraries/Components/ScrollView/AndroidHorizontalScrollContentViewNativeComponent";
-import AndroidHorizontalScrollViewNativeComponent from "react-native/Libraries/Components/ScrollView/AndroidHorizontalScrollViewNativeComponent";
-import processDecelerationRate from "./processDecelerationRate";
-import ScrollContentViewNativeComponent from "react-native/Libraries/Components/ScrollView/ScrollContentViewNativeComponent";
-import Commands from "react-native/Libraries/Components/ScrollView/ScrollViewCommands";
-import ScrollViewContext, {
-  HORIZONTAL,
-  VERTICAL,
-} from "react-native/Libraries/Components/ScrollView/ScrollViewContext";
-import ScrollViewNativeComponent from "react-native/Libraries/Components/ScrollView/ScrollViewNativeComponent";
-import ScrollViewStickyHeader from "react-native/Libraries/Components/ScrollView/ScrollViewStickyHeader";
-import invariant from "invariant";
-import memoize from "memoize-one";
-import nullthrows from "nullthrows";
-import * as React from "react";
-
-if (Platform.OS === "ios") {
-  require("react-native/Libraries/Renderer/shims/ReactNative"); // Force side effects to prevent T55744311
-}
-
-const { NativeHorizontalScrollViewTuple, NativeVerticalScrollViewTuple } =
-  Platform.OS === "android"
-    ? {
-        NativeHorizontalScrollViewTuple: [
-          AndroidHorizontalScrollViewNativeComponent,
-          AndroidHorizontalScrollContentViewNativeComponent,
-        ],
-        NativeVerticalScrollViewTuple: [ScrollViewNativeComponent, View],
-      }
-    : {
-        NativeHorizontalScrollViewTuple: [
-          ScrollViewNativeComponent,
-          ScrollContentViewNativeComponent,
-        ],
-        NativeVerticalScrollViewTuple: [
-          ScrollViewNativeComponent,
-          ScrollContentViewNativeComponent,
-        ],
-      };
+} from '../../Types/CoreEventTypes';
+import type {EventSubscription} from '../../vendor/emitter/EventEmitter';
+import type {KeyboardEvent, KeyboardMetrics} from '../Keyboard/Keyboard';
+import typeof View from '../View/View';
+import type {ViewProps} from '../View/ViewPropTypes';
+import type {Props as ScrollViewStickyHeaderProps} from './ScrollViewStickyHeader';
+
+import {
+  HScrollContentViewNativeComponent,
+  HScrollViewNativeComponent,
+} from '../../../src/private/components/HScrollViewNativeComponents';
+import {
+  VScrollContentViewNativeComponent,
+  VScrollViewNativeComponent,
+} from '../../../src/private/components/VScrollViewNativeComponents';
+import AnimatedImplementation from '../../Animated/AnimatedImplementation';
+import FrameRateLogger from '../../Interaction/FrameRateLogger';
+import {findNodeHandle} from '../../ReactNative/RendererProxy';
+import UIManager from '../../ReactNative/UIManager';
+import flattenStyle from '../../StyleSheet/flattenStyle';
+import splitLayoutProps from '../../StyleSheet/splitLayoutProps';
+import StyleSheet from '../../StyleSheet/StyleSheet';
+import Dimensions from '../../Utilities/Dimensions';
+import dismissKeyboard from '../../Utilities/dismissKeyboard';
+import Platform from '../../Utilities/Platform';
+import Keyboard from '../Keyboard/Keyboard';
+import TextInputState from '../TextInput/TextInputState';
+import ScrollViewDelegate from './delegates/ScrollViewDelegate';
+import processDecelerationRate from './processDecelerationRate';
+import Commands from './ScrollViewCommands';
+import ScrollViewContext, {HORIZONTAL, VERTICAL} from './ScrollViewContext';
+import ScrollViewStickyHeader from './ScrollViewStickyHeader';
+import invariant from 'invariant';
+import memoize from 'memoize-one';
+import nullthrows from 'nullthrows';
+import * as React from 'react';
 
 /*
  * iOS scroll event timing nuances:
@@ -155,31 +129,30 @@ const { NativeHorizontalScrollViewTuple, NativeVerticalScrollViewTuple } =
 
 // Public methods for ScrollView
 export type ScrollViewImperativeMethods = $ReadOnly<{|
-  getScrollResponder: $PropertyType<ScrollView, "getScrollResponder">,
-  getScrollableNode: $PropertyType<ScrollView, "getScrollableNode">,
-  getInnerViewNode: $PropertyType<ScrollView, "getInnerViewNode">,
-  getInnerViewRef: $PropertyType<ScrollView, "getInnerViewRef">,
-  getNativeScrollRef: $PropertyType<ScrollView, "getNativeScrollRef">,
-  scrollTo: $PropertyType<ScrollView, "scrollTo">,
-  scrollToEnd: $PropertyType<ScrollView, "scrollToEnd">,
-  flashScrollIndicators: $PropertyType<ScrollView, "flashScrollIndicators">,
-  scrollResponderZoomTo: $PropertyType<ScrollView, "scrollResponderZoomTo">,
+  getScrollResponder: $PropertyType<ScrollView, 'getScrollResponder'>,
+  getScrollableNode: $PropertyType<ScrollView, 'getScrollableNode'>,
+  getInnerViewNode: $PropertyType<ScrollView, 'getInnerViewNode'>,
+  getInnerViewRef: $PropertyType<ScrollView, 'getInnerViewRef'>,
+  getNativeScrollRef: $PropertyType<ScrollView, 'getNativeScrollRef'>,
+  scrollTo: $PropertyType<ScrollView, 'scrollTo'>,
+  scrollToEnd: $PropertyType<ScrollView, 'scrollToEnd'>,
+  flashScrollIndicators: $PropertyType<ScrollView, 'flashScrollIndicators'>,
+  scrollResponderZoomTo: $PropertyType<ScrollView, 'scrollResponderZoomTo'>,
   scrollResponderScrollNativeHandleToKeyboard: $PropertyType<
     ScrollView,
-    "scrollResponderScrollNativeHandleToKeyboard"
+    'scrollResponderScrollNativeHandleToKeyboard',
   >,
 |}>;
 
-export type DecelerationRateType = "fast" | "normal" | number;
+export type DecelerationRateType = 'fast' | 'normal' | number;
 export type ScrollResponderType = ScrollViewImperativeMethods;
 
-type NativeScrollViewInstance = React.ElementRef<HostComponent<mixed>>;
 type PublicScrollViewInstance = $ReadOnly<{|
-  ...$Exact<NativeScrollViewInstance>,
+  ...HostInstance,
   ...ScrollViewImperativeMethods,
 |}>;
 
-type InnerViewInstance = React.ElementRef<typeof View>;
+type InnerViewInstance = React.ElementRef<View>;
 
 type IOSProps = $ReadOnly<{|
   /**
@@ -260,7 +233,7 @@ type IOSProps = $ReadOnly<{|
    *
    * @platform ios
    */
-  indicatorStyle?: ?("default" | "black" | "white"),
+  indicatorStyle?: ?('default' | 'black' | 'white'),
   /**
    * When true, the ScrollView will try to lock to only vertical or horizontal
    * scrolling while dragging.  The default value is false.
@@ -273,33 +246,6 @@ type IOSProps = $ReadOnly<{|
    * @platform ios
    */
   canCancelContentTouches?: ?boolean,
-  /**
-   * When set, the scroll view will adjust the scroll position so that the first child that is
-   * currently visible and at or beyond `minIndexForVisible` will not change position. This is
-   * useful for lists that are loading content in both directions, e.g. a chat thread, where new
-   * messages coming in might otherwise cause the scroll position to jump. A value of 0 is common,
-   * but other values such as 1 can be used to skip loading spinners or other content that should
-   * not maintain position.
-   *
-   * The optional `autoscrollToTopThreshold` can be used to make the content automatically scroll
-   * to the top after making the adjustment if the user was within the threshold of the top before
-   * the adjustment was made. This is also useful for chat-like applications where you want to see
-   * new messages scroll into place, but not if the user has scrolled up a ways and it would be
-   * disruptive to scroll a bunch.
-   *
-   * Caveat 1: Reordering elements in the scrollview with this enabled will probably cause
-   * jumpiness and jank. It can be fixed, but there are currently no plans to do so. For now,
-   * don't re-order the content of any ScrollViews or Lists that use this feature.
-   *
-   * Caveat 2: This simply uses `contentOffset` and `frame.origin` in native code to compute
-   * visibility. Occlusion, transforms, and other complexity won't be taken into account as to
-   * whether content is "visible" or not.
-   *
-   */
-  maintainVisibleContentPosition?: ?$ReadOnly<{|
-    minIndexForVisible: number,
-    autoscrollToTopThreshold?: ?number,
-  |}>,
   /**
    * The maximum allowed zoom scale. The default value is 1.0.
    * @platform ios
@@ -357,10 +303,10 @@ type IOSProps = $ReadOnly<{|
    * @platform ios
    */
   contentInsetAdjustmentBehavior?: ?(
-    | "automatic"
-    | "scrollableAxes"
-    | "never"
-    | "always"
+    | 'automatic'
+    | 'scrollableAxes'
+    | 'never'
+    | 'always'
   ),
 |}>;
 
@@ -399,7 +345,7 @@ type AndroidProps = $ReadOnly<{|
    *
    * @platform android
    */
-  overScrollMode?: ?("auto" | "always" | "never"),
+  overScrollMode?: ?('auto' | 'always' | 'never'),
   /**
    * Causes the scrollbars not to turn transparent when they are not in use.
    * The default value is false.
@@ -421,10 +367,10 @@ type AndroidProps = $ReadOnly<{|
   fadingEdgeLength?: ?number,
 |}>;
 
-type StickyHeaderComponentType = React.AbstractComponent<
-  ScrollViewStickyHeaderProps,
-  $ReadOnly<interface { setNextHeaderY: (number) => void }>
->;
+type StickyHeaderComponentType = component(
+  ref?: React.RefSetter<$ReadOnly<interface {setNextHeaderY: number => void}>>,
+  ...ScrollViewStickyHeaderProps
+);
 
 export type Props = $ReadOnly<{|
   ...ViewProps,
@@ -472,6 +418,20 @@ export type Props = $ReadOnly<{|
    *   - `'fast'`: 0.99 on iOS, 0.9 on Android
    */
   decelerationRate?: ?DecelerationRateType,
+
+  /**
+   * *Experimental, iOS Only*. The API is experimental and will change in future releases.
+   *
+   * Controls how much distance is travelled after user stops scrolling.
+   * Value greater than 1 will increase the distance travelled.
+   * Value less than 1 will decrease the distance travelled.
+   *
+   * @deprecated
+   *
+   * The default value is 1.
+   */
+  experimental_endDraggingSensitivityMultiplier?: ?number,
+
   /**
    * When true, the scroll view's children are arranged horizontally in a row
    * instead of vertically in a column. The default value is false.
@@ -498,7 +458,7 @@ export type Props = $ReadOnly<{|
    */
   keyboardDismissMode?: ?// default
   // cross-platform
-  ("none" | "on-drag" | "interactive"), // ios only
+  ('none' | 'on-drag' | 'interactive'), // ios only
   /**
    * Determines when the keyboard should stay visible after a tap.
    *
@@ -511,7 +471,34 @@ export type Props = $ReadOnly<{|
    *   - `false`, deprecated, use 'never' instead
    *   - `true`, deprecated, use 'always' instead
    */
-  keyboardShouldPersistTaps?: ?("always" | "never" | "handled" | true | false),
+  keyboardShouldPersistTaps?: ?('always' | 'never' | 'handled' | true | false),
+  /**
+   * When set, the scroll view will adjust the scroll position so that the first child that is
+   * partially or fully visible and at or beyond `minIndexForVisible` will not change position.
+   * This is useful for lists that are loading content in both directions, e.g. a chat thread,
+   * where new messages coming in might otherwise cause the scroll position to jump. A value of 0
+   * is common, but other values such as 1 can be used to skip loading spinners or other content
+   * that should not maintain position.
+   *
+   * The optional `autoscrollToTopThreshold` can be used to make the content automatically scroll
+   * to the top after making the adjustment if the user was within the threshold of the top before
+   * the adjustment was made. This is also useful for chat-like applications where you want to see
+   * new messages scroll into place, but not if the user has scrolled up a ways and it would be
+   * disruptive to scroll a bunch.
+   *
+   * Caveat 1: Reordering elements in the scrollview with this enabled will probably cause
+   * jumpiness and jank. It can be fixed, but there are currently no plans to do so. For now,
+   * don't re-order the content of any ScrollViews or Lists that use this feature.
+   *
+   * Caveat 2: This simply uses `contentOffset` and `frame.origin` in native code to compute
+   * visibility. Occlusion, transforms, and other complexity won't be taken into account as to
+   * whether content is "visible" or not.
+   *
+   */
+  maintainVisibleContentPosition?: ?$ReadOnly<{|
+    minIndexForVisible: number,
+    autoscrollToTopThreshold?: ?number,
+  |}>,
   /**
    * Called when the momentum scroll starts (scroll which occurs as the ScrollView glides to a stop).
    */
@@ -522,8 +509,7 @@ export type Props = $ReadOnly<{|
   onMomentumScrollEnd?: ?(event: ScrollEvent) => void,
 
   /**
-   * Fires at most once per frame during scrolling. The frequency of the
-   * events can be controlled using the `scrollEventThrottle` prop.
+   * Fires at most once per frame during scrolling.
    */
   onScroll?: ?(event: ScrollEvent) => void,
   /**
@@ -553,8 +539,6 @@ export type Props = $ReadOnly<{|
    * When true, the scroll view stops on multiples of the scroll view's size
    * when scrolling. This can be used for horizontal pagination. The default
    * value is false.
-   *
-   * Note: Vertical pagination is not supported on Android.
    */
   pagingEnabled?: ?boolean,
   /**
@@ -565,19 +549,10 @@ export type Props = $ReadOnly<{|
    */
   scrollEnabled?: ?boolean,
   /**
-   * This controls how often the scroll event will be fired while scrolling
-   * (as a time interval in ms). A lower number yields better accuracy for code
-   * that is tracking the scroll position, but can lead to scroll performance
-   * problems due to the volume of information being send over the bridge.
-   *
-   * Values between 0 and 17ms indicate 60fps updates are needed and throttling
-   * will be disabled.
-   *
-   * If you do not need precise scroll position tracking, set this value higher
-   * to limit the information being sent across the bridge.
-   *
-   * The default value is zero, which results in the scroll event being sent only
-   * once each time the view is scrolled.
+   * Limits how often scroll events will be fired while scrolling, specified as
+   * a time interval in ms. This may be useful when expensive work is performed
+   * in response to scrolling. Values <= `16` will disable throttling,
+   * regardless of the refresh rate of the device.
    */
   scrollEventThrottle?: ?number,
   /**
@@ -613,7 +588,7 @@ export type Props = $ReadOnly<{|
    *   - `'center'` will align the snap in the center
    *   - `'end'` will align the snap at the right (horizontal) or bottom (vertical)
    */
-  snapToAlignment?: ?("start" | "center" | "end"),
+  snapToAlignment?: ?('start' | 'center' | 'end'),
   /**
    * When set, causes the scroll view to stop at multiples of the value of
    * `snapToInterval`. This can be used for paginating through children
@@ -664,26 +639,24 @@ export type Props = $ReadOnly<{|
    */
   /* $FlowFixMe[unclear-type] - how to handle generic type without existential
    * operator? */
-  refreshControl?: ?React.Element<any>,
+  refreshControl?: ?ExactReactElement_DEPRECATED<any>,
   children?: React.Node,
   /**
    * A ref to the inner View element of the ScrollView. This should be used
    * instead of calling `getInnerViewRef`.
    */
-  innerViewRef?: ForwardedRef<InnerViewInstance>,
+  innerViewRef?: React.RefSetter<InnerViewInstance>,
   /**
    * A ref to the Native ScrollView component. This ref can be used to call
    * all of ScrollView's public methods, in addition to native methods like
    * measure, measureLayout, etc.
    */
-  scrollViewRef?: ForwardedRef<PublicScrollViewInstance>,
+  scrollViewRef?: React.RefSetter<PublicScrollViewInstance>,
 |}>;
 
 type State = {|
   layoutHeight: ?number,
-  // RNOH patch - resolving flashScrollIndicators command on the JS side
-  // as it is currently not feasible on the native side
-  showScrollIndicator: boolean,
+  showScrollIndicator: boolean, // RNC_patch
 |};
 
 const IS_ANIMATING_TOUCH_START_THRESHOLD_MS = 16;
@@ -730,17 +703,20 @@ export type ScrollViewComponentStatics = $ReadOnly<{|
 class ScrollView extends React.Component<Props, State> {
   static Context: typeof ScrollViewContext = ScrollViewContext;
 
+  _delegate: ScrollViewDelegate;
+
   constructor(props: Props) {
     super(props);
-
+    // RNOH patch - resolving flashScrollIndicators command on the JS side
     this._scrollAnimatedValue = new AnimatedImplementation.Value(
-      this.props.contentOffset?.y ?? 0
+      this.props.contentOffset?.y ?? 0,
     );
     this._scrollAnimatedValue.setOffset(this.props.contentInset?.top ?? 0);
+    this._delegate = new ScrollViewDelegate({});
   }
 
   _scrollAnimatedValue: AnimatedImplementation.Value;
-  _scrollAnimatedValueAttachment: ?{ detach: () => void, ... } = null;
+  _scrollAnimatedValueAttachment: ?{detach: () => void, ...} = null;
   _stickyHeaderRefs: Map<string, React.ElementRef<StickyHeaderComponentType>> =
     new Map();
   _headerLayoutYs: Map<string, number> = new Map();
@@ -769,20 +745,18 @@ class ScrollView extends React.Component<Props, State> {
 
   state: State = {
     layoutHeight: null,
-    // RNOH patch - resolving flashScrollIndicators command on the JS side
-    // as it is currently not feasible on the native side
-    showScrollIndicator: false,
+    showScrollIndicator: false, // RNC_patch
   };
 
   componentDidMount() {
-    if (typeof this.props.keyboardShouldPersistTaps === "boolean") {
+    if (typeof this.props.keyboardShouldPersistTaps === 'boolean') {
       console.warn(
         `'keyboardShouldPersistTaps={${
-          this.props.keyboardShouldPersistTaps === true ? "true" : "false"
+          this.props.keyboardShouldPersistTaps === true ? 'true' : 'false'
         }}' is deprecated. ` +
           `Use 'keyboardShouldPersistTaps="${
-            this.props.keyboardShouldPersistTaps ? "always" : "never"
-          }"' instead`
+            this.props.keyboardShouldPersistTaps ? 'always' : 'never'
+          }"' instead`,
       );
     }
 
@@ -790,20 +764,20 @@ class ScrollView extends React.Component<Props, State> {
     this._additionalScrollOffset = 0;
 
     this._subscriptionKeyboardWillShow = Keyboard.addListener(
-      "keyboardWillShow",
-      this.scrollResponderKeyboardWillShow
+      'keyboardWillShow',
+      this.scrollResponderKeyboardWillShow,
     );
     this._subscriptionKeyboardWillHide = Keyboard.addListener(
-      "keyboardWillHide",
-      this.scrollResponderKeyboardWillHide
+      'keyboardWillHide',
+      this.scrollResponderKeyboardWillHide,
     );
     this._subscriptionKeyboardDidShow = Keyboard.addListener(
-      "keyboardDidShow",
-      this.scrollResponderKeyboardDidShow
+      'keyboardDidShow',
+      this.scrollResponderKeyboardDidShow,
     );
     this._subscriptionKeyboardDidHide = Keyboard.addListener(
-      "keyboardDidHide",
-      this.scrollResponderKeyboardDidHide
+      'keyboardDidHide',
+      this.scrollResponderKeyboardDidHide,
     );
 
     this._updateAnimatedNodeAttachment();
@@ -854,7 +828,7 @@ class ScrollView extends React.Component<Props, State> {
   };
 
   getScrollableNode: () => ?number = () => {
-    return findNodeHandle(this._scrollView.nativeInstance);
+    return findNodeHandle(this.getNativeScrollRef());
   };
 
   getInnerViewNode: () => ?number = () => {
@@ -865,7 +839,7 @@ class ScrollView extends React.Component<Props, State> {
     return this._innerView.nativeInstance;
   };
 
-  getNativeScrollRef: () => NativeScrollViewInstance | null = () => {
+  getNativeScrollRef: () => HostInstance | null = () => {
     return this._scrollView.nativeInstance;
   };
 
@@ -890,7 +864,7 @@ class ScrollView extends React.Component<Props, State> {
         }
       | number,
     deprecatedX?: number,
-    deprecatedAnimated?: boolean
+    deprecatedAnimated?: boolean,
   ) => void = (
     options?:
       | {
@@ -901,13 +875,13 @@ class ScrollView extends React.Component<Props, State> {
         }
       | number,
     deprecatedX?: number,
-    deprecatedAnimated?: boolean
+    deprecatedAnimated?: boolean,
   ) => {
     let x, y, animated;
-    if (typeof options === "number") {
+    if (typeof options === 'number') {
       console.warn(
-        "`scrollTo(y, x, animated)` is deprecated. Use `scrollTo({x: 5, y: 5, " +
-          "animated: true})` instead."
+        '`scrollTo(y, x, animated)` is deprecated. Use `scrollTo({x: 5, y: 5, ' +
+          'animated: true})` instead.',
       );
       y = options;
       x = deprecatedX;
@@ -917,15 +891,11 @@ class ScrollView extends React.Component<Props, State> {
       x = options.x;
       animated = options.animated;
     }
-    if (this._scrollView.nativeInstance == null) {
+    const component = this.getNativeScrollRef();
+    if (component == null) {
       return;
     }
-    Commands.scrollTo(
-      this._scrollView.nativeInstance,
-      x || 0,
-      y || 0,
-      animated !== false
-    );
+    Commands.scrollTo(component, x || 0, y || 0, animated !== false);
   };
 
   /**
@@ -936,15 +906,16 @@ class ScrollView extends React.Component<Props, State> {
    * `scrollToEnd({animated: false})` for immediate scrolling.
    * If no options are passed, `animated` defaults to true.
    */
-  scrollToEnd: (options?: ?{ animated?: boolean, ... }) => void = (
-    options?: ?{ animated?: boolean, ... }
+  scrollToEnd: (options?: ?{animated?: boolean, ...}) => void = (
+    options?: ?{animated?: boolean, ...},
   ) => {
     // Default to true
     const animated = (options && options.animated) !== false;
-    if (this._scrollView.nativeInstance == null) {
+    const component = this.getNativeScrollRef();
+    if (component == null) {
       return;
     }
-    Commands.scrollToEnd(this._scrollView.nativeInstance, animated);
+    Commands.scrollToEnd(component, animated);
   };
 
   /**
@@ -953,20 +924,16 @@ class ScrollView extends React.Component<Props, State> {
    * @platform ios
    */
   flashScrollIndicators: () => void = () => {
-    // RNOH patch - resolving flashScrollIndicators command on the JS side
-    // as it is currently not feasible on the native side
-
-    // if (this._scrollView.nativeInstance == null) {
-    //   return;
-    // }
-    // Commands.flashScrollIndicators(this._scrollView.nativeInstance);
-
-    this.state.showScrollIndicator = true;
+    // RNC_patch
+    this.setState(prev => ({...prev, showScrollIndicator: true}));
     setTimeout(() => {
-      this.state.showScrollIndicator = false;
-      this.forceUpdate();
+      this.setState(prev => ({...prev, showScrollIndicator: false}));
     }, 500);
-    this.forceUpdate();
+    // const component = this.getNativeScrollRef();
+    // if (component == null) {
+    //   return;
+    // }
+    // Commands.flashScrollIndicators(component);
   };
 
   /**
@@ -979,14 +946,14 @@ class ScrollView extends React.Component<Props, State> {
    * @param {bool} preventNegativeScrolling Whether to allow pulling the content
    *        down to make it meet the keyboard's top. Default is false.
    */
-  scrollResponderScrollNativeHandleToKeyboard: <T>(
-    nodeHandle: number | React.ElementRef<HostComponent<T>>,
+  scrollResponderScrollNativeHandleToKeyboard: (
+    nodeHandle: number | HostInstance,
     additionalOffset?: number,
-    preventNegativeScrollOffset?: boolean
-  ) => void = <T>(
-    nodeHandle: number | React.ElementRef<HostComponent<T>>,
+    preventNegativeScrollOffset?: boolean,
+  ) => void = (
+    nodeHandle: number | HostInstance,
     additionalOffset?: number,
-    preventNegativeScrollOffset?: boolean
+    preventNegativeScrollOffset?: boolean,
   ) => {
     this._additionalScrollOffset = additionalOffset || 0;
     this._preventNegativeScrollOffset = !!preventNegativeScrollOffset;
@@ -995,20 +962,20 @@ class ScrollView extends React.Component<Props, State> {
       return;
     }
 
-    if (typeof nodeHandle === "number") {
+    if (typeof nodeHandle === 'number') {
       UIManager.measureLayout(
         nodeHandle,
         nullthrows(findNodeHandle(this)),
         // $FlowFixMe[method-unbinding] added when improving typing for this parameters
         this._textInputFocusError,
-        this._inputMeasureAndScrollToKeyboard
+        this._inputMeasureAndScrollToKeyboard,
       );
     } else {
       nodeHandle.measureLayout(
         this._innerView.nativeInstance,
         this._inputMeasureAndScrollToKeyboard,
         // $FlowFixMe[method-unbinding] added when improving typing for this parameters
-        this._textInputFocusError
+        this._textInputFocusError,
       );
     }
   };
@@ -1027,7 +994,7 @@ class ScrollView extends React.Component<Props, State> {
       height: number,
       animated?: boolean,
     |},
-    animated?: boolean // deprecated, put this inside the rect argument instead
+    animated?: boolean, // deprecated, put this inside the rect argument instead
   ) => void = (
     rect: {|
       x: number,
@@ -1036,30 +1003,27 @@ class ScrollView extends React.Component<Props, State> {
       height: number,
       animated?: boolean,
     |},
-    animated?: boolean // deprecated, put this inside the rect argument instead
+    animated?: boolean, // deprecated, put this inside the rect argument instead
   ) => {
-    invariant(Platform.OS === "ios", "zoomToRect is not implemented");
-    if ("animated" in rect) {
+    invariant(Platform.OS === 'ios', 'zoomToRect is not implemented');
+    if ('animated' in rect) {
       this._animated = rect.animated;
       delete rect.animated;
-    } else if (typeof animated !== "undefined") {
+    } else if (typeof animated !== 'undefined') {
       console.warn(
-        "`scrollResponderZoomTo` `animated` argument is deprecated. Use `options.animated` instead"
+        '`scrollResponderZoomTo` `animated` argument is deprecated. Use `options.animated` instead',
       );
     }
 
-    if (this._scrollView.nativeInstance == null) {
+    const component = this.getNativeScrollRef();
+    if (component == null) {
       return;
     }
-    Commands.zoomToRect(
-      this._scrollView.nativeInstance,
-      rect,
-      animated !== false
-    );
+    Commands.zoomToRect(component, rect, animated !== false);
   };
 
   _textInputFocusError() {
-    console.warn("Error measuring text field.");
+    console.warn('Error measuring text field.');
   }
 
   /**
@@ -1076,9 +1040,9 @@ class ScrollView extends React.Component<Props, State> {
     left: number,
     top: number,
     width: number,
-    height: number
+    height: number,
   ) => void = (left: number, top: number, width: number, height: number) => {
-    let keyboardScreenY = Dimensions.get("window").height;
+    let keyboardScreenY = Dimensions.get('window').height;
 
     const scrollTextInputIntoVisibleRect = () => {
       if (this._keyboardMetrics != null) {
@@ -1094,7 +1058,7 @@ class ScrollView extends React.Component<Props, State> {
       if (this._preventNegativeScrollOffset === true) {
         scrollOffsetY = Math.max(0, scrollOffsetY);
       }
-      this.scrollTo({ x: 0, y: scrollOffsetY, animated: true });
+      this.scrollTo({x: 0, y: scrollOffsetY, animated: true});
 
       this._additionalScrollOffset = 0;
       this._preventNegativeScrollOffset = false;
@@ -1128,16 +1092,16 @@ class ScrollView extends React.Component<Props, State> {
     ) {
       this._scrollAnimatedValueAttachment =
         AnimatedImplementation.attachNativeEvent(
-          this._scrollView.nativeInstance,
-          "onScroll",
-          [{ nativeEvent: { contentOffset: { y: this._scrollAnimatedValue } } }]
+          this.getNativeScrollRef(),
+          'onScroll',
+          [{nativeEvent: {contentOffset: {y: this._scrollAnimatedValue}}}],
         );
     }
   }
 
   _setStickyHeaderRef(
     key: string,
-    ref: ?React.ElementRef<StickyHeaderComponentType>
+    ref: ?React.ElementRef<StickyHeaderComponentType>,
   ) {
     if (ref) {
       this._stickyHeaderRefs.set(key, ref);
@@ -1147,7 +1111,7 @@ class ScrollView extends React.Component<Props, State> {
   }
 
   _onStickyHeaderLayout(index: $FlowFixMe, event: $FlowFixMe, key: $FlowFixMe) {
-    const { stickyHeaderIndices } = this.props;
+    const {stickyHeaderIndices} = this.props;
     if (!stickyHeaderIndices) {
       return;
     }
@@ -1164,7 +1128,7 @@ class ScrollView extends React.Component<Props, State> {
     const previousHeaderIndex = stickyHeaderIndices[indexOfIndex - 1];
     if (previousHeaderIndex != null) {
       const previousHeader = this._stickyHeaderRefs.get(
-        this._getKeyForIndex(previousHeaderIndex, childArray)
+        this._getKeyForIndex(previousHeaderIndex, childArray),
       );
       previousHeader &&
         previousHeader.setNextHeaderY &&
@@ -1173,28 +1137,13 @@ class ScrollView extends React.Component<Props, State> {
   }
 
   _handleScroll = (e: ScrollEvent) => {
-    if (__DEV__) {
-      if (
-        this.props.onScroll &&
-        this.props.scrollEventThrottle == null &&
-        Platform.OS === "ios"
-      ) {
-        console.log(
-          "You specified `onScroll` on a <ScrollView> but not " +
-            "`scrollEventThrottle`. You will only receive one event. " +
-            "Using `16` you get all the events but be aware that it may " +
-            "cause frame drops, use a bigger number if you don't need as " +
-            "much precision."
-        );
-      }
-    }
     this._observedScrollSinceBecomingResponder = true;
     this.props.onScroll && this.props.onScroll(e);
   };
 
   _handleLayout = (e: LayoutEvent) => {
     if (this.props.invertStickyHeaders === true) {
-      this.setState({ layoutHeight: e.nativeEvent.layout.height });
+      this.setState({layoutHeight: e.nativeEvent.layout.height});
     }
     if (this.props.onLayout) {
       this.props.onLayout(e);
@@ -1202,21 +1151,18 @@ class ScrollView extends React.Component<Props, State> {
   };
 
   _handleContentOnLayout = (e: LayoutEvent) => {
-    const { width, height } = e.nativeEvent.layout;
+    const {width, height} = e.nativeEvent.layout;
     this.props.onContentSizeChange &&
       this.props.onContentSizeChange(width, height);
   };
 
   _innerView: RefForwarder<InnerViewInstance, InnerViewInstance> =
     createRefForwarder(
-      (instance: InnerViewInstance): InnerViewInstance => instance
+      (instance: InnerViewInstance): InnerViewInstance => instance,
     );
 
-  _scrollView: RefForwarder<
-    NativeScrollViewInstance,
-    PublicScrollViewInstance
-  > = createRefForwarder(
-    (nativeInstance: NativeScrollViewInstance): PublicScrollViewInstance => {
+  _scrollView: RefForwarder<HostInstance, PublicScrollViewInstance | null> =
+    createRefForwarder(nativeInstance => {
       // This is a hack. Ideally we would forwardRef  to the underlying
       // host component. However, since ScrollView has it's own methods that can be
       // called as well, if we used the standard forwardRef then these
@@ -1240,12 +1186,11 @@ class ScrollView extends React.Component<Props, State> {
           scrollResponderZoomTo: this.scrollResponderZoomTo,
           scrollResponderScrollNativeHandleToKeyboard:
             this.scrollResponderScrollNativeHandleToKeyboard,
-        }
+        },
       );
 
       return publicInstance;
-    }
-  );
+    });
 
   /**
    * Warning, this may be called several times for a single keyboard opening.
@@ -1277,28 +1222,28 @@ class ScrollView extends React.Component<Props, State> {
    */
 
   scrollResponderKeyboardWillShow: (e: KeyboardEvent) => void = (
-    e: KeyboardEvent
+    e: KeyboardEvent,
   ) => {
     this._keyboardMetrics = e.endCoordinates;
     this.props.onKeyboardWillShow && this.props.onKeyboardWillShow(e);
   };
 
   scrollResponderKeyboardWillHide: (e: KeyboardEvent) => void = (
-    e: KeyboardEvent
+    e: KeyboardEvent,
   ) => {
     this._keyboardMetrics = null;
     this.props.onKeyboardWillHide && this.props.onKeyboardWillHide(e);
   };
 
   scrollResponderKeyboardDidShow: (e: KeyboardEvent) => void = (
-    e: KeyboardEvent
+    e: KeyboardEvent,
   ) => {
     this._keyboardMetrics = e.endCoordinates;
     this.props.onKeyboardDidShow && this.props.onKeyboardDidShow(e);
   };
 
   scrollResponderKeyboardDidHide: (e: KeyboardEvent) => void = (
-    e: KeyboardEvent
+    e: KeyboardEvent,
   ) => {
     this._keyboardMetrics = null;
     this.props.onKeyboardDidHide && this.props.onKeyboardDidHide(e);
@@ -1331,11 +1276,7 @@ class ScrollView extends React.Component<Props, State> {
   _handleScrollBeginDrag: (e: ScrollEvent) => void = (e: ScrollEvent) => {
     FrameRateLogger.beginScroll(); // TODO: track all scrolls after implementing onScrollEndAnimation
 
-    if (
-      // RNOH: patch - add support for OpenHarmony
-      (Platform.OS === "android" || Platform.OS === "harmony") &&
-      this.props.keyboardDismissMode === "on-drag"
-    ) {
+    if (this._delegate.shouldDismissKeyboardOnScrollBeginDrag(this.props)) {
       dismissKeyboard();
     }
 
@@ -1346,7 +1287,7 @@ class ScrollView extends React.Component<Props, State> {
    * Invoke this from an `onScrollEndDrag` event.
    */
   _handleScrollEndDrag: (e: ScrollEvent) => void = (e: ScrollEvent) => {
-    const { velocity } = e.nativeEvent;
+    const {velocity} = e.nativeEvent;
     // - If we are animating, then this is a "drag" that is stopping the scrollview and momentum end
     //   will fire.
     // - If velocity is non-zero, then the interaction will stop when momentum scroll ends or
@@ -1404,10 +1345,10 @@ class ScrollView extends React.Component<Props, State> {
     this._isTouching = e.nativeEvent.touches.length !== 0;
     this.props.onResponderRelease && this.props.onResponderRelease(e);
 
-    if (typeof e.target === "number") {
+    if (typeof e.target === 'number') {
       if (__DEV__) {
         console.error(
-          "Did not expect event target to be a number. Should have been a native component"
+          'Did not expect event target to be a number. Should have been a native component',
         );
       }
 
@@ -1420,7 +1361,7 @@ class ScrollView extends React.Component<Props, State> {
     if (
       currentlyFocusedTextInput != null &&
       this.props.keyboardShouldPersistTaps !== true &&
-      this.props.keyboardShouldPersistTaps !== "always" &&
+      this.props.keyboardShouldPersistTaps !== 'always' &&
       this._keyboardIsDismissible() &&
       e.target !== currentlyFocusedTextInput &&
       !this._observedScrollSinceBecomingResponder &&
@@ -1486,7 +1427,7 @@ class ScrollView extends React.Component<Props, State> {
    *
    */
   _handleStartShouldSetResponder: (e: PressEvent) => boolean = (
-    e: PressEvent
+    e: PressEvent,
   ) => {
     // Allow any event touch pass through if the default pan responder is disabled
     if (this.props.disableScrollViewPanResponder === true) {
@@ -1495,7 +1436,7 @@ class ScrollView extends React.Component<Props, State> {
 
     const currentlyFocusedInput = TextInputState.currentlyFocusedInput();
     if (
-      this.props.keyboardShouldPersistTaps === "handled" &&
+      this.props.keyboardShouldPersistTaps === 'handled' &&
       this._keyboardIsDismissible() &&
       e.target !== currentlyFocusedInput
     ) {
@@ -1516,7 +1457,7 @@ class ScrollView extends React.Component<Props, State> {
    * Invoke this from an `onStartShouldSetResponderCapture` event.
    */
   _handleStartShouldSetResponderCapture: (e: PressEvent) => boolean = (
-    e: PressEvent
+    e: PressEvent,
   ) => {
     // The scroll view should receive taps instead of its descendants if:
     // * it is already animating/decelerating
@@ -1533,14 +1474,14 @@ class ScrollView extends React.Component<Props, State> {
     // and a new touch starts with a non-textinput target (in which case the
     // first tap should be sent to the scroll view and dismiss the keyboard,
     // then the second tap goes to the actual interior view)
-    const { keyboardShouldPersistTaps } = this.props;
+    const {keyboardShouldPersistTaps} = this.props;
     const keyboardNeverPersistTaps =
-      !keyboardShouldPersistTaps || keyboardShouldPersistTaps === "never";
+      !keyboardShouldPersistTaps || keyboardShouldPersistTaps === 'never';
 
-    if (typeof e.target === "number") {
+    if (typeof e.target === 'number') {
       if (__DEV__) {
         console.error(
-          "Did not expect event target to be a number. Should have been a native component"
+          'Did not expect event target to be a number. Should have been a native component',
         );
       }
 
@@ -1601,7 +1542,7 @@ class ScrollView extends React.Component<Props, State> {
   _keyboardEventsAreUnreliable: () => boolean = () => {
     // Android versions prior to API 30 rely on observing layout changes when
     // `android:windowSoftInputMode` is set to `adjustResize` or `adjustPan`.
-    return Platform.OS === "android" && Platform.Version < 30;
+    return Platform.OS === 'android' && Platform.Version < 30;
   };
 
   /**
@@ -1613,9 +1554,9 @@ class ScrollView extends React.Component<Props, State> {
     const nativeEvent = e.nativeEvent;
     this._isTouching = nativeEvent.touches.length !== 0;
 
-    const { keyboardShouldPersistTaps } = this.props;
+    const {keyboardShouldPersistTaps} = this.props;
     const keyboardNeverPersistsTaps =
-      !keyboardShouldPersistTaps || keyboardShouldPersistTaps === "never";
+      !keyboardShouldPersistTaps || keyboardShouldPersistTaps === 'never';
 
     // Dismiss the keyboard now if we didn't become responder in capture phase
     // to eat presses, but still want to dismiss on interaction.
@@ -1675,27 +1616,33 @@ class ScrollView extends React.Component<Props, State> {
     this.props.onTouchMove && this.props.onTouchMove(e);
   };
 
-  render(): React.Node | React.Element<string> {
-    const [NativeDirectionalScrollView, NativeDirectionalScrollContentView] =
-      this.props.horizontal === true
-        ? NativeHorizontalScrollViewTuple
-        : NativeVerticalScrollViewTuple;
+  render(): React.Node {
+    const horizontal = this.props.horizontal === true;
+
+    const NativeScrollView = horizontal
+      ? HScrollViewNativeComponent
+      : VScrollViewNativeComponent;
+
+    const NativeScrollContentView = horizontal
+      ? HScrollContentViewNativeComponent
+      : VScrollContentViewNativeComponent;
 
     const contentContainerStyle = [
-      this.props.horizontal === true && styles.contentContainerHorizontal,
+      horizontal && styles.contentContainerHorizontal,
       this.props.contentContainerStyle,
     ];
     if (__DEV__ && this.props.style !== undefined) {
       // $FlowFixMe[underconstrained-implicit-instantiation]
       const style = flattenStyle(this.props.style);
-      const childLayoutProps = ["alignItems", "justifyContent"].filter(
-        (prop) => style && style[prop] !== undefined
+      const childLayoutProps = ['alignItems', 'justifyContent'].filter(
+        // $FlowFixMe[incompatible-use]
+        prop => style && style[prop] !== undefined,
       );
       invariant(
         childLayoutProps.length === 0,
-        "ScrollView child layout (" +
+        'ScrollView child layout (' +
           JSON.stringify(childLayoutProps) +
-          ") must be applied through the contentContainerStyle prop."
+          ') must be applied through the contentContainerStyle prop.',
       );
     }
 
@@ -1706,15 +1653,16 @@ class ScrollView extends React.Component<Props, State> {
             onLayout: this._handleContentOnLayout,
           };
 
-    const { stickyHeaderIndices } = this.props;
+    const {stickyHeaderIndices} = this.props;
     let children = this.props.children;
+    /**
+     * This function can cause unnecessary remount when nested in conditionals as it causes remap of children keys.
+     * https://react.dev/reference/react/Children#children-toarray-caveats
+     */
+    children = React.Children.toArray<$FlowFixMe>(children);
 
     if (stickyHeaderIndices != null && stickyHeaderIndices.length > 0) {
-      const childArray = React.Children.toArray<$FlowFixMe>(
-        this.props.children
-      );
-
-      children = childArray.map((child, index) => {
+      children = children.map((child, index) => {
         const indexOfIndex = child ? stickyHeaderIndices.indexOf(index) : -1;
         if (indexOfIndex > -1) {
           const key = child.key;
@@ -1724,19 +1672,15 @@ class ScrollView extends React.Component<Props, State> {
           return (
             <StickyHeaderComponent
               key={key}
-              nativeID={"StickyHeader-" + key} /* TODO: T68258846. */
-              ref={(ref) => this._setStickyHeaderRef(key, ref)}
+              ref={ref => this._setStickyHeaderRef(key, ref)}
               nextHeaderLayoutY={this._headerLayoutYs.get(
-                this._getKeyForIndex(nextIndex, childArray)
+                this._getKeyForIndex(nextIndex, children),
               )}
-              onLayout={(event) =>
-                this._onStickyHeaderLayout(index, event, key)
-              }
+              onLayout={event => this._onStickyHeaderLayout(index, event, key)}
               scrollAnimatedValue={this._scrollAnimatedValue}
               inverted={this.props.invertStickyHeaders}
               hiddenOnScroll={this.props.stickyHeaderHiddenOnScroll}
-              scrollViewHeight={this.state.layoutHeight}
-            >
+              scrollViewHeight={this.state.layoutHeight}>
               {child}
             </StickyHeaderComponent>
           );
@@ -1746,9 +1690,7 @@ class ScrollView extends React.Component<Props, State> {
       });
     }
     children = (
-      <ScrollViewContext.Provider
-        value={this.props.horizontal === true ? HORIZONTAL : VERTICAL}
-      >
+      <ScrollViewContext.Provider value={horizontal ? HORIZONTAL : VERTICAL}>
         {children}
       </ScrollViewContext.Provider>
     );
@@ -1756,22 +1698,29 @@ class ScrollView extends React.Component<Props, State> {
     const hasStickyHeaders =
       Array.isArray(stickyHeaderIndices) && stickyHeaderIndices.length > 0;
 
+    // Some ScrollView native component behaviors rely on using the metrics
+    // of mounted views for anchoring. Make sure not to flatten children if
+    // this is the case.
+    const preserveChildren =
+      this.props.maintainVisibleContentPosition != null ||
+      (Platform.OS === 'android' && this.props.snapToAlignment != null);
+
     const contentContainer = (
-      <NativeDirectionalScrollContentView
+      <NativeScrollContentView
         {...contentSizeChangeProps}
         ref={this._innerView.getForwardingRef(this.props.innerViewRef)}
         style={contentContainerStyle}
         removeClippedSubviews={
           // Subview clipping causes issues with sticky headers on Android and
           // would be hard to fix properly in a performant way.
-          Platform.OS === "android" && hasStickyHeaders
+          Platform.OS === 'android' && hasStickyHeaders
             ? false
             : this.props.removeClippedSubviews
         }
         collapsable={false}
-      >
+        collapsableChildren={!preserveChildren}>
         {children}
-      </NativeDirectionalScrollContentView>
+      </NativeScrollContentView>
     );
 
     const alwaysBounceHorizontal =
@@ -1784,12 +1733,12 @@ class ScrollView extends React.Component<Props, State> {
         ? this.props.alwaysBounceVertical
         : !this.props.horizontal;
 
-    const baseStyle =
-      this.props.horizontal === true
-        ? styles.baseHorizontal
-        : styles.baseVertical;
+    const baseStyle = horizontal ? styles.baseHorizontal : styles.baseVertical;
+
+    const {experimental_endDraggingSensitivityMultiplier, ...otherProps} =
+      this.props;
     const props = {
-      ...this.props,
+      ...otherProps,
       alwaysBounceHorizontal,
       alwaysBounceVertical,
       style: StyleSheet.compose(baseStyle, this.props.style),
@@ -1814,6 +1763,8 @@ class ScrollView extends React.Component<Props, State> {
       onTouchStart: this._handleTouchStart,
       onTouchCancel: this._handleTouchCancel,
       onScroll: this._handleScroll,
+      endDraggingSensitivityMultiplier:
+        experimental_endDraggingSensitivityMultiplier,
       scrollEventThrottle: hasStickyHeaders
         ? 1
         : this.props.scrollEventThrottle,
@@ -1826,47 +1777,78 @@ class ScrollView extends React.Component<Props, State> {
       // default to true
       snapToEnd: this.props.snapToEnd !== false,
       // pagingEnabled is overridden by snapToInterval / snapToOffsets
+      // RNC_patch: BEGIN
       pagingEnabled:
         this.props.pagingEnabled === true &&
         this.props.snapToInterval == null &&
         this.props.snapToOffsets == null,
-      // RNOH patch - resolving flashScrollIndicators command on the JS side
-      // as it is currently not feasible on the native side 
-      showsVerticalScrollIndicator: (this.props.showsVerticalScrollIndicator ?? true) || this.state.showScrollIndicator,
-      showsHorizontalScrollIndicator: (this.props.showsHorizontalScrollIndicator ?? true) || this.state.showScrollIndicator,
-      persistentScrollbar: this.props.persistentScrollbar || this.state.showScrollIndicator,
+      showsVerticalScrollIndicator:
+        (this.props.showsVerticalScrollIndicator ?? true) ||
+        this.state.showScrollIndicator,
+      showsHorizontalScrollIndicator:
+        (this.props.showsHorizontalScrollIndicator ?? true) ||
+        this.state.showScrollIndicator,
+      persistentScrollbar:
+        this.props.persistentScrollbar || this.state.showScrollIndicator,
+      // RNC_patch: END
+      ...this._delegate.getCustomNativeProps(this.props),
     };
 
-    const { decelerationRate } = this.props;
+    const {decelerationRate} = this.props;
     if (decelerationRate != null) {
       props.decelerationRate = processDecelerationRate(decelerationRate);
     }
 
     const refreshControl = this.props.refreshControl;
     const scrollViewRef = this._scrollView.getForwardingRef(
-      this.props.scrollViewRef
+      this.props.scrollViewRef,
     );
 
     if (refreshControl) {
-      // RNOH: patch - use Android implementation
-      const { outer, inner } = splitLayoutProps(flattenStyle(props.style));
-      return React.cloneElement(
+      return this._delegate.renderScrollViewWithRefreshControl({
+        NativeScrollView,
+        props,
+        scrollViewRef,
         refreshControl,
-        { style: StyleSheet.compose(baseStyle, outer) },
-        <NativeDirectionalScrollView
-          {...props}
-          style={StyleSheet.compose(baseStyle, inner)}
-          ref={scrollViewRef}
-        >
-          {contentContainer}
-        </NativeDirectionalScrollView>
-      );
+        contentContainer,
+        baseStyle,
+      });
+      // if (Platform.OS === 'ios') {
+      //   // On iOS the RefreshControl is a child of the ScrollView.
+      //   return (
+      //     // $FlowFixMe[incompatible-type] - Flow only knows element refs.
+      //     <NativeScrollView {...props} ref={scrollViewRef}>
+      //       {refreshControl}
+      //       {contentContainer}
+      //     </NativeScrollView>
+      //   );
+      // } else if (Platform.OS === 'android') {
+      //   // On Android wrap the ScrollView with a AndroidSwipeRefreshLayout.
+      //   // Since the ScrollView is wrapped add the style props to the
+      //   // AndroidSwipeRefreshLayout and use flex: 1 for the ScrollView.
+      //   // Note: we should split props.style on the inner and outer props
+      //   // however, the ScrollView still needs the baseStyle to be scrollable
+      //   // $FlowFixMe[underconstrained-implicit-instantiation]
+      //   // $FlowFixMe[incompatible-call]
+      //   const {outer, inner} = splitLayoutProps(flattenStyle(props.style));
+      //   return React.cloneElement(
+      //     refreshControl,
+      //     {style: StyleSheet.compose(baseStyle, outer)},
+      //     <NativeScrollView
+      //       {...props}
+      //       style={StyleSheet.compose(baseStyle, inner)}
+      //       // $FlowFixMe[incompatible-type] - Flow only knows element refs.
+      //       ref={scrollViewRef}>
+      //       {contentContainer}
+      //     </NativeScrollView>,
+      //   );
+      // }
     }
-
     return (
-      <NativeDirectionalScrollView {...props} ref={scrollViewRef}>
+      // $FlowFixMe[incompatible-type] - Flow only knows element refs.
+      <NativeScrollView {...props} ref={scrollViewRef}>
         {contentContainer}
-      </NativeDirectionalScrollView>
+      </NativeScrollView>
     );
   }
 }
@@ -1875,25 +1857,23 @@ const styles = StyleSheet.create({
   baseVertical: {
     flexGrow: 1,
     flexShrink: 1,
-    flexDirection: "column",
-    overflow: "scroll",
+    flexDirection: 'column',
+    overflow: 'scroll',
   },
   baseHorizontal: {
     flexGrow: 1,
     flexShrink: 1,
-    flexDirection: "row",
-    overflow: "scroll",
+    flexDirection: 'row',
+    overflow: 'scroll',
   },
   contentContainerHorizontal: {
-    flexDirection: "row",
+    flexDirection: 'row',
   },
 });
 
-type ForwardedRef<T> = { current: null | T, ... } | ((null | T) => mixed);
-
 type RefForwarder<TNativeInstance, TPublicInstance> = {
   getForwardingRef: (
-    ?ForwardedRef<TPublicInstance>
+    ?React.RefSetter<TPublicInstance>,
   ) => (TNativeInstance | null) => void,
   nativeInstance: TNativeInstance | null,
   publicInstance: TPublicInstance | null,
@@ -1904,10 +1884,10 @@ type RefForwarder<TNativeInstance, TPublicInstance> = {
  * once `ScrollView` is reimplemented as a functional component.
  */
 function createRefForwarder<TNativeInstance, TPublicInstance>(
-  mutator: (TNativeInstance) => TPublicInstance
+  mutator: TNativeInstance => TPublicInstance,
 ): RefForwarder<TNativeInstance, TPublicInstance> {
   const state: RefForwarder<TNativeInstance, TPublicInstance> = {
-    getForwardingRef: memoize((forwardedRef) => {
+    getForwardingRef: memoize(forwardedRef => {
       return (nativeInstance: TNativeInstance | null): void => {
         const publicInstance =
           nativeInstance == null ? null : mutator(nativeInstance);
@@ -1916,7 +1896,7 @@ function createRefForwarder<TNativeInstance, TPublicInstance>(
         state.publicInstance = publicInstance;
 
         if (forwardedRef != null) {
-          if (typeof forwardedRef === "function") {
+          if (typeof forwardedRef === 'function') {
             forwardedRef(publicInstance);
           } else {
             forwardedRef.current = publicInstance;
@@ -1931,21 +1911,26 @@ function createRefForwarder<TNativeInstance, TPublicInstance>(
   return state;
 }
 
-/* $FlowFixMe[missing-local-annot] The type annotation(s) required by Flow's
- * LTI update could not be added via codemod */
-function Wrapper(props, ref: ((mixed) => mixed) | { current: mixed, ... }) {
-  return <ScrollView {...props} scrollViewRef={ref} />;
-}
-Wrapper.displayName = "ScrollView";
-const ForwardedScrollView = React.forwardRef(Wrapper);
-
-// $FlowFixMe[prop-missing] Add static context to ForwardedScrollView
-ForwardedScrollView.Context = ScrollViewContext;
-
-ForwardedScrollView.displayName = "ScrollView";
+// TODO: After upgrading to React 19, remove `forwardRef` from this component.
+// NOTE: This wrapper component is necessary because `ScrollView` is a class
+// component and we need to map `ref` to a differently named prop. This can be
+// removed when `ScrollView` is a functional component.
+const Wrapper: component(
+  ref: React.RefSetter<PublicScrollViewInstance>,
+  ...props: Props
+) = React.forwardRef(function Wrapper(
+  props: Props,
+  ref: ?React.RefSetter<PublicScrollViewInstance>,
+): React.Node {
+  return ref == null ? (
+    <ScrollView {...props} />
+  ) : (
+    <ScrollView {...props} scrollViewRef={ref} />
+  );
+});
+Wrapper.displayName = 'ScrollView';
+// $FlowExpectedError[prop-missing]
+Wrapper.Context = ScrollViewContext;
 
-module.exports = ((ForwardedScrollView: $FlowFixMe): React.AbstractComponent<
-  React.ElementConfig<typeof ScrollView>,
-  PublicScrollViewInstance
-> &
+module.exports = ((Wrapper: $FlowFixMe): typeof Wrapper &
   ScrollViewComponentStatics);