fix(hippy-react): fix declaration for animation and scroll-view (#3510)

* fix(hippy-react): fix declaration for animation and scroll-view

* fix(hippy-react): fix declaration for web-view

* fix(hippy-react): fix ScrollViewEvent declaration

packages/hippy-react/src/components/scroll-view.tsx

@@ -27,7 +27,52 @@ import Element from '../dom/element-node';
 import { isRTL } from '../utils/i18n';
 import View from './view';
 
-export interface ScrollViewProps {
+interface ScrollViewPropsIOS {
+
+  /**
+   * When `true`, shows a horizontal scroll indicator.
+   * Default: true
+   */
+  showsHorizontalScrollIndicator?: boolean;
+
+  /**
+   * When `true`, shows a vertical scroll indicator.
+   * Default: true
+   */
+  showsVerticalScrollIndicator?: boolean;
+}
+
+interface ScrollViewPropsAndroid {
+  /**
+   * When false, the scroll view will hide scroll indicator
+   * @default false
+   */
+  showScrollIndicator?: boolean;
+}
+
+export interface ScrollEvent {
+  contentInset: {
+    right: number;
+    top: number;
+    left: number;
+    bottom: number;
+  };
+  contentOffset: {
+    x: number;
+    y: number;
+  };
+  contentSize: {
+    width: number;
+    height: number;
+  };
+  layoutMeasurement: {
+    width: number;
+    height: number;
+  };
+  zoomScale: number;
+}
+
+export interface ScrollViewProps extends ScrollViewPropsAndroid, ScrollViewPropsIOS {
   // TODO: allow HippyTypes.Style[]
   style?: HippyTypes.Style;
   /**
@@ -52,18 +97,6 @@ export interface ScrollViewProps {
    */
   scrollEnabled?: boolean;
 
-  /**
-   * When `true`, shows a horizontal scroll indicator.
-   * Default: true
-   */
-  showsHorizontalScrollIndicator?: boolean;
-
-  /**
-   * When `true`, shows a vertical scroll indicator.
-   * Default: true
-   */
-  showsVerticalScrollIndicator?: boolean;
-
   /**
    * These styles will be applied to the scroll view content container which wraps all
    * of the child views.
@@ -100,32 +133,32 @@ export interface ScrollViewProps {
   /**
    * Called when the momentum scroll starts (scroll which occurs as the ScrollView starts gliding).
    */
-  onMomentumScrollBegin?: () => void;
+  onMomentumScrollBegin?: (event: ScrollEvent) => void;
 
   /**
    * Called when the momentum scroll ends (scroll which occurs as the ScrollView glides to a stop).
    */
-  onMomentumScrollEnd?: () => void;
+  onMomentumScrollEnd?: (event: ScrollEvent) => void;
 
   /**
    * Fires at most once per frame during scrolling.
    * The frequency of the events can be controlled using the `scrollEventThrottle` prop.
    *
-   * @param {Object} evt - Scroll event data.
-   * @param {number} evt.contentOffset.x - Offset X of scrolling.
-   * @param {number} evt.contentOffset.y - Offset Y of scrolling.
+   * @param {Object} event - Scroll event data.
+   * @param {number} event.contentOffset.x - Offset X of scrolling.
+   * @param {number} event.contentOffset.y - Offset Y of scrolling.
    */
-  onScroll?: (evt: { contentOffset: { x: number, y: number }}) => void;
+  onScroll?: (event: ScrollEvent) => void;
 
   /**
    * Called when the user begins to drag the scroll view.
    */
-  onScrollBeginDrag?: () => void;
+  onScrollBeginDrag?: (event: ScrollEvent) => void;
 
   /**
    * Called when the user stops dragging the scroll view and it either stops or begins to glide.
    */
-  onScrollEndDrag?: () => void;
+  onScrollEndDrag?: (event: ScrollEvent) => void;
 }
 
 const styles = StyleSheet.create({

packages/hippy-react/src/components/web-view.tsx

@@ -64,7 +64,7 @@ export interface WebViewProps {
    * @param {Object} evt - Load event data
    * @param {string} evt.url - Web page url
    */
-  onLoadEnd: (evt: LoadEvent) => void;
+  onLoadEnd?: (evt: LoadEvent) => void;
 }
 
 /**

packages/hippy-react/src/modules/animation.ts

@@ -59,7 +59,7 @@ interface AnimationOptions {
    * Value type, leave it blank in most case, except use rotate/color related
    * animation, set it to be 'deg' or 'color'.
    */
-  valueType?: 'deg'; // TODO: fill more options
+  valueType?: 'deg' | 'rad' | 'color'; // TODO: fill more options
 
   /**
    * Animation start position