uilib-native 5.0.0-snapshot.7227 → 5.0.0-snapshot.7233

package/components/HighlighterOverlayView/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { processColor, StyleSheet, Modal } from 'react-native';
 // Import the Codegen specification for New Architecture
-import HighlighterViewNativeComponent from "./HighlighterViewNativeComponent";
+import HighlighterViewNativeComponent from "../../specs/HighlighterViewNativeComponent";
 const DefaultOverlayColor = 'rgba(0, 0, 0, 0.5)';
 const HighlighterOverlayView = props => {
   const {

package/components/HighlighterOverlayView/index.web.d.ts

@@ -19,7 +19,7 @@ export type HighlighterOverlayViewProps = {
     onRequestClose?: () => void;
     highlightFrame?: HighlightFrameType;
     style?: ViewStyle;
-    highlightViewTag?: number | null;
+    highlightViewTag?: number;
     children?: JSX.Element[] | JSX.Element;
     highlightViewTagParams?: HighlightViewTagParams;
     minimumRectSize?: Pick<HighlightFrameType, 'width' | 'height'>;

package/components/Keyboard/KeyboardTrackingView/KeyboardTrackingView.ios.js

@@ -1,7 +1,7 @@
 import React, { PureComponent } from 'react';
 import ReactNative, { NativeModules } from 'react-native';
 // Import the Codegen specification for New Architecture
-import KeyboardTrackingViewNativeComponent from "./KeyboardTrackingViewNativeComponent";
+import KeyboardTrackingViewNativeComponent from "../../../specs/KeyboardTrackingViewNativeComponent";
 const KeyboardTrackingViewTempManager = NativeModules.KeyboardTrackingViewTempManager;
 
 /**

package/components/SafeArea/SafeAreaInsetsManager.d.ts

@@ -1,13 +1,16 @@
-type SafeAreaInsetsType = {
+export type SafeAreaInsetsType = {
     top: number;
     left: number;
     bottom: number;
     right: number;
 } | null;
+export type SafeAreaChangedDelegateType = {
+    onSafeAreaInsetsDidChangeEvent?: (insets: SafeAreaInsetsType) => void;
+};
 declare class SafeAreaInsetsManager {
     _defaultInsets: SafeAreaInsetsType;
     _safeAreaInsets: SafeAreaInsetsType;
-    _safeAreaChangedDelegates: Array<any>;
+    _safeAreaChangedDelegates: Array<SafeAreaChangedDelegateType>;
     _nativeModule: any;
     constructor();
     setupNativeConnection(): void;
@@ -16,8 +19,8 @@ declare class SafeAreaInsetsManager {
     notifyDelegates(insets: SafeAreaInsetsType): void;
     _updateInsets(): Promise<void>;
     getSafeAreaInsets(): Promise<SafeAreaInsetsType>;
-    addSafeAreaChangedDelegate(delegate: any): void;
-    removeSafeAreaChangedDelegate(delegateToRemove: any): void;
+    addSafeAreaChangedDelegate(delegate: SafeAreaChangedDelegateType): void;
+    removeSafeAreaChangedDelegate(delegateToRemove: SafeAreaChangedDelegateType): void;
     get defaultInsets(): SafeAreaInsetsType;
     refreshSafeAreaInsets(): Promise<void>;
 }

package/components/SafeArea/SafeAreaInsetsManager.js

@@ -2,7 +2,7 @@ import _isEqual from "lodash/isEqual";
 import _remove from "lodash/remove";
 import _forEach from "lodash/forEach";
 /* eslint no-underscore-dangle: 0 */
-import { NativeModules, DeviceEventEmitter, Platform } from 'react-native';
+import { NativeModules, DeviceEventEmitter } from 'react-native';
 let SafeAreaInsetsCache = null;
 class SafeAreaInsetsManager {
   _defaultInsets = {
@@ -11,12 +11,7 @@ class SafeAreaInsetsManager {
     bottom: 34,
     right: 0
   }; // Common iPhone safe area values
-  _safeAreaInsets = {
-    top: 47,
-    left: 0,
-    bottom: 34,
-    right: 0
-  };
+
   _safeAreaChangedDelegates = [];
   _nativeModule = null;
   constructor() {
@@ -45,11 +40,8 @@ class SafeAreaInsetsManager {
     }
   }
   setupEventListener() {
-    if (Platform.OS !== 'ios') {
-      return;
-    }
     try {
-      // Use DeviceEventEmitter instead of NativeEventEmitter to avoid getConstants      
+      // Use DeviceEventEmitter instead of NativeEventEmitter to avoid getConstants
       DeviceEventEmitter.addListener('SafeAreaInsetsDidChangeEvent', data => {
         if (data) {
           SafeAreaInsetsCache = data;
@@ -86,8 +78,13 @@ class SafeAreaInsetsManager {
   async _updateInsets() {
     if (this._nativeModule && SafeAreaInsetsCache === null) {
       try {
-        SafeAreaInsetsCache = await this._nativeModule.getSafeAreaInsets();
-        this._safeAreaInsets = SafeAreaInsetsCache;
+        const insets = await this._nativeModule.getSafeAreaInsets();
+        if (insets) {
+          SafeAreaInsetsCache = insets;
+          this._safeAreaInsets = SafeAreaInsetsCache;
+        } else {
+          this._safeAreaInsets = this._defaultInsets;
+        }
       } catch (error) {
         console.warn('SafeAreaInsetsManager: Failed to get native insets:', error);
         this._safeAreaInsets = this._defaultInsets;

package/components/SafeArea/SafeAreaSpacerView.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { ViewStyle } from 'react-native';
+import { ViewStyle, StyleProp } from 'react-native';
 export type SafeAreaSpacerViewProps = {
-    style?: ViewStyle;
+    style?: StyleProp<ViewStyle>;
 };
 declare const SafeAreaSpacerView: {
     ({ style }: SafeAreaSpacerViewProps): React.JSX.Element;

package/components/SafeArea/SafeAreaSpacerView.js

@@ -1,4 +1,4 @@
-import React, { useState, useCallback, useEffect } from 'react';
+import React, { useState, useCallback, useEffect, useMemo } from 'react';
 import { View, Dimensions } from 'react-native';
 import SafeAreaInsetsManager from "./SafeAreaInsetsManager";
 const SafeAreaSpacerView = ({
@@ -10,6 +10,7 @@ const SafeAreaSpacerView = ({
     bottom: 0,
     right: 0
   });
+  const [componentHeight, setComponentHeight] = useState(0);
   const [spacerHeight, setSpacerHeight] = useState(0);
   useEffect(() => {
     const getSafeAreaInsets = async () => {
@@ -43,22 +44,24 @@ const SafeAreaSpacerView = ({
     const {
       y
     } = event.nativeEvent.layout;
+    setComponentHeight(y);
+  }, []);
+  useEffect(() => {
     const screenHeight = Dimensions.get('window').height;
     let height = 0;
     // Check if positioned within safe area bounds
-    if (y < safeAreaInsets.top) {
+    if (componentHeight < safeAreaInsets.top) {
       height = safeAreaInsets.top;
-    } else if (y > screenHeight - safeAreaInsets.bottom) {
+    } else if (componentHeight > screenHeight - safeAreaInsets.bottom) {
       height = safeAreaInsets.bottom;
     }
     if (height !== spacerHeight) {
       setSpacerHeight(height);
     }
-  }, [safeAreaInsets, spacerHeight]);
-  const spacerStyle = {
-    height: spacerHeight,
-    ...style
-  };
+  }, [componentHeight, safeAreaInsets, spacerHeight]);
+  const spacerStyle = useMemo(() => [{
+    height: spacerHeight
+  }, style], [spacerHeight, style]);
   return <View style={spacerStyle} onLayout={handleLayout} />;
 };
 SafeAreaSpacerView.displayName = 'SafeAreaSpacerView';

package/components/SafeArea/__tests__/SafeAreaInsetsManager.spec.js

@@ -0,0 +1,271 @@
+import {NativeModules, DeviceEventEmitter} from 'react-native';
+
+describe('SafeAreaInsetsManager', () => {
+  beforeEach(() => {
+    // Reset mocks
+    jest.clearAllMocks();
+
+    // Reset the SafeAreaInsetsCache by creating a fresh instance
+    jest.resetModules();
+
+    // Spy on console methods to verify logging
+    jest.spyOn(console, 'log').mockImplementation(() => {});
+    jest.spyOn(console, 'warn').mockImplementation(() => {});
+  });
+
+  afterEach(() => {
+    // Restore console methods
+    jest.restoreAllMocks();
+  });
+
+  describe('getSafeAreaInsets', () => {
+    it('should return default insets when native module is not available', async () => {
+      // Arrange
+      NativeModules.SafeAreaManager = null;
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Act
+      const result = await SafeAreaInsetsManager.getSafeAreaInsets();
+
+      // Assert
+      expect(result).toEqual({top: 47, left: 0, bottom: 34, right: 0});
+      expect(console.log).toHaveBeenCalledWith('SafeAreaInsetsManager: Native SafeAreaManager not available, using defaults');
+    });
+
+    it('should return insets from native module when available', async () => {
+      // Arrange
+      const mockInsets = {top: 50, left: 10, bottom: 30, right: 10};
+      NativeModules.SafeAreaManager = {
+        getSafeAreaInsets: jest.fn().mockResolvedValue(mockInsets)
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Act
+      const result = await SafeAreaInsetsManager.getSafeAreaInsets();
+
+      // Assert
+      expect(result).toEqual(mockInsets);
+      expect(NativeModules.SafeAreaManager.getSafeAreaInsets).toHaveBeenCalled();
+    });
+
+    it.skip('should return cached insets on subsequent calls', async () => {
+      // Arrange
+      const mockInsets = {top: 44, left: 0, bottom: 34, right: 0};
+      NativeModules.SafeAreaManager = {
+        getSafeAreaInsets: jest.fn().mockResolvedValue(mockInsets)
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Act
+      const result1 = await SafeAreaInsetsManager.getSafeAreaInsets();
+      const result2 = await SafeAreaInsetsManager.getSafeAreaInsets();
+
+      // Assert
+      expect(result1).toEqual(mockInsets);
+      expect(result2).toEqual(mockInsets);
+      expect(NativeModules.SafeAreaManager.getSafeAreaInsets).toHaveBeenCalledTimes(1); // Should only call native once due to caching
+    });
+
+    it('should handle native module errors gracefully', async () => {
+      // Arrange
+      const mockError = new Error('Native module error');
+      NativeModules.SafeAreaManager = {
+        getSafeAreaInsets: jest.fn().mockRejectedValue(mockError)
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Act
+      const result = await SafeAreaInsetsManager.getSafeAreaInsets();
+
+      // Assert
+      expect(result).toEqual({top: 47, left: 0, bottom: 34, right: 0}); // Should fallback to defaults
+      expect(console.warn).toHaveBeenCalledWith('SafeAreaInsetsManager: Failed to get initial insets:', mockError);
+      expect(console.warn).toHaveBeenCalledWith('SafeAreaInsetsManager: Failed to get native insets:', mockError);
+    });
+
+    it('should handle native module setup errors gracefully', async () => {
+      // Arrange
+      Object.defineProperty(NativeModules, 'SafeAreaManager', {
+        get: () => {
+          throw new Error('Setup error');
+        }
+      });
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Act
+      const result = await SafeAreaInsetsManager.getSafeAreaInsets();
+
+      // Assert
+      expect(result).toEqual({top: 47, left: 0, bottom: 34, right: 0}); // Should fallback to defaults
+      expect(console.warn).toHaveBeenCalledWith('SafeAreaInsetsManager: Failed to connect to native module:', expect.any(Error));
+    });
+
+    it('should update insets when they change during the test', async () => {
+      // Arrange
+      const initialInsets = {top: 44, left: 0, bottom: 34, right: 0};
+      const updatedInsets = {top: 50, left: 0, bottom: 40, right: 0};
+
+      NativeModules.SafeAreaManager = {
+        // TODO: this will need to be changed when the we get caching to work in tests ("should return cached insets on subsequent calls")
+        // getSafeAreaInsets: jest.fn().mockResolvedValueOnce(initialInsets).mockResolvedValueOnce(updatedInsets)
+        getSafeAreaInsets: jest
+          .fn()
+          .mockResolvedValueOnce(initialInsets)
+          .mockResolvedValueOnce(initialInsets)
+          .mockResolvedValueOnce(updatedInsets)
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Act & Assert - Initial insets
+      const result1 = await SafeAreaInsetsManager.getSafeAreaInsets();
+      expect(result1).toEqual(initialInsets);
+
+      // Force refresh of insets
+      await SafeAreaInsetsManager.refreshSafeAreaInsets();
+
+      // Simulate insets change event from native side
+      DeviceEventEmitter.emit('SafeAreaInsetsDidChangeEvent', updatedInsets);
+
+      // Get insets again - should reflect the change
+      const result2 = await SafeAreaInsetsManager.getSafeAreaInsets();
+      expect(result2).toEqual(updatedInsets);
+    });
+
+    it('should notify delegates when insets change during the test', async () => {
+      // Arrange
+      const initialInsets = {top: 44, left: 0, bottom: 34, right: 0};
+      const updatedInsets = {top: 50, left: 0, bottom: 40, right: 0};
+
+      NativeModules.SafeAreaManager = {
+        getSafeAreaInsets: jest.fn().mockResolvedValue(initialInsets)
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Add a mock delegate
+      const mockDelegate = {
+        onSafeAreaInsetsDidChangeEvent: jest.fn()
+      };
+      SafeAreaInsetsManager.addSafeAreaChangedDelegate(mockDelegate);
+
+      // Act - Get initial insets
+      await SafeAreaInsetsManager.getSafeAreaInsets();
+
+      // Simulate insets change event from native side
+      DeviceEventEmitter.emit('SafeAreaInsetsDidChangeEvent', updatedInsets);
+
+      // Assert - Delegate should be notified
+      expect(mockDelegate.onSafeAreaInsetsDidChangeEvent).toHaveBeenCalledWith(updatedInsets);
+    });
+
+    it('should handle refreshSafeAreaInsets correctly', async () => {
+      // Arrange
+      const initialInsets = {top: 44, left: 0, bottom: 34, right: 0};
+      const refreshedInsets = {top: 48, left: 0, bottom: 36, right: 0};
+
+      NativeModules.SafeAreaManager = {
+        // TODO: this will need to be changed when the we get caching to work in tests ("should return cached insets on subsequent calls")
+        // getSafeAreaInsets: jest.fn().mockResolvedValueOnce(initialInsets).mockResolvedValueOnce(updatedInsets)
+        getSafeAreaInsets: jest
+          .fn()
+          .mockResolvedValueOnce(initialInsets)
+          .mockResolvedValueOnce(initialInsets)
+          .mockResolvedValueOnce(refreshedInsets)
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Act
+      const result1 = await SafeAreaInsetsManager.getSafeAreaInsets();
+      expect(result1).toEqual(initialInsets);
+
+      // Refresh insets
+      await SafeAreaInsetsManager.refreshSafeAreaInsets();
+
+      const result2 = await SafeAreaInsetsManager.getSafeAreaInsets();
+
+      // Assert
+      expect(result2).toEqual(refreshedInsets);
+      // TODO: this will need to be changed when the we get caching to work in tests ("should return cached insets on subsequent calls")
+      expect(NativeModules.SafeAreaManager.getSafeAreaInsets).toHaveBeenCalledTimes(3);
+    });
+
+    it('should not notify delegates when insets remain the same after refresh', async () => {
+      // Arrange
+      const sameInsets = {top: 44, left: 0, bottom: 34, right: 0};
+
+      NativeModules.SafeAreaManager = {
+        getSafeAreaInsets: jest.fn().mockResolvedValue(sameInsets)
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Add a mock delegate
+      const mockDelegate = {
+        onSafeAreaInsetsDidChangeEvent: jest.fn()
+      };
+      SafeAreaInsetsManager.addSafeAreaChangedDelegate(mockDelegate);
+
+      // Act
+      await SafeAreaInsetsManager.getSafeAreaInsets();
+      await SafeAreaInsetsManager.refreshSafeAreaInsets();
+
+      // TODO: this will need to be changed when the we get caching to work in tests ("should return cached insets on subsequent calls")
+      expect(NativeModules.SafeAreaManager.getSafeAreaInsets).toHaveBeenCalledTimes(3);
+
+      // Assert - Delegate should not be notified since insets didn't change
+      expect(mockDelegate.onSafeAreaInsetsDidChangeEvent).not.toHaveBeenCalled();
+    });
+
+    it('should return default insets when native getSafeAreaInsets returns null', async () => {
+      // Arrange
+      NativeModules.SafeAreaManager = {
+        getSafeAreaInsets: jest.fn().mockResolvedValue(null)
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      // Act
+      const result = await SafeAreaInsetsManager.getSafeAreaInsets();
+
+      // Assert
+      expect(result).toEqual({top: 47, left: 0, bottom: 34, right: 0});
+    });
+
+    it('should properly manage delegate lifecycle', async () => {
+      // Arrange
+      NativeModules.SafeAreaManager = {
+        getSafeAreaInsets: jest.fn().mockResolvedValue({top: 44, left: 0, bottom: 34, right: 0})
+      };
+
+      const SafeAreaInsetsManager = require('../SafeAreaInsetsManager').default;
+
+      const mockDelegate1 = {
+        onSafeAreaInsetsDidChangeEvent: jest.fn()
+      };
+      const mockDelegate2 = {
+        onSafeAreaInsetsDidChangeEvent: jest.fn()
+      };
+
+      // Act
+      SafeAreaInsetsManager.addSafeAreaChangedDelegate(mockDelegate1);
+      SafeAreaInsetsManager.addSafeAreaChangedDelegate(mockDelegate2);
+
+      // Remove one delegate
+      SafeAreaInsetsManager.removeSafeAreaChangedDelegate(mockDelegate1);
+
+      // Trigger notification
+      const newInsets = {top: 50, left: 0, bottom: 40, right: 0};
+      SafeAreaInsetsManager.notifyDelegates(newInsets);
+
+      // Assert
+      expect(mockDelegate1.onSafeAreaInsetsDidChangeEvent).not.toHaveBeenCalled();
+      expect(mockDelegate2.onSafeAreaInsetsDidChangeEvent).toHaveBeenCalledWith(newInsets);
+    });
+  });
+});

package/components/SafeArea/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { ViewStyle, StyleProp } from 'react-native';
+export type SafeAreaSpacerViewProps = {
+    style?: StyleProp<ViewStyle>;
+};
+declare const SafeAreaSpacerView: {
+    ({ style }: SafeAreaSpacerViewProps): React.JSX.Element;
+    displayName: string;
+};
+export default SafeAreaSpacerView;

package/components/SafeArea/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { View, Platform } from 'react-native';
+import SafeAreaSpacerViewIos from "./SafeAreaSpacerView";
+const isIOS = Platform.OS === 'ios';
+const SafeAreaSpacerView = ({
+  style
+}) => {
+  return isIOS ? <SafeAreaSpacerViewIos style={style} /> : <View style={style} />;
+};
+SafeAreaSpacerView.displayName = 'SafeAreaSpacerView';
+export default SafeAreaSpacerView;

package/components/index.d.ts

@@ -1,6 +1,6 @@
 import DynamicFonts, { FontExtension } from './DynamicFonts';
 import HighlighterOverlayView from './HighlighterOverlayView';
-import SafeAreaSpacerView from './SafeArea/SafeAreaSpacerView';
+import SafeAreaSpacerView from './SafeArea';
 import SafeAreaInsetsManager from './SafeArea/SafeAreaInsetsManager';
 import Keyboard, { KeyboardTrackingViewProps, KeyboardAccessoryViewProps } from './Keyboard';
 export { DynamicFonts, FontExtension, HighlighterOverlayView, SafeAreaSpacerView, SafeAreaInsetsManager, Keyboard, KeyboardTrackingViewProps, KeyboardAccessoryViewProps };

package/components/index.js

@@ -1,6 +1,6 @@
 import DynamicFonts, { FontExtension } from "./DynamicFonts";
 import HighlighterOverlayView from "./HighlighterOverlayView";
-import SafeAreaSpacerView from "./SafeArea/SafeAreaSpacerView";
+import SafeAreaSpacerView from "./SafeArea";
 import SafeAreaInsetsManager from "./SafeArea/SafeAreaInsetsManager";
 import Keyboard, { KeyboardTrackingViewProps, KeyboardAccessoryViewProps } from "./Keyboard";
 export { DynamicFonts, FontExtension, HighlighterOverlayView, SafeAreaSpacerView, SafeAreaInsetsManager, Keyboard, KeyboardTrackingViewProps, KeyboardAccessoryViewProps };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uilib-native",
-  "version": "5.0.0-snapshot.7227",
+  "version": "5.0.0-snapshot.7233",
   "homepage": "https://github.com/wix/react-native-ui-lib",
   "description": "uilib native components (separated from js components)",
   "main": "components/index",

package/specs/HighlighterViewNativeComponent.ts

@@ -0,0 +1,78 @@
+import type {ViewProps} from 'react-native';
+// import {requireNativeComponent, type ViewProps} from 'react-native';
+import type {Float, Int32, WithDefault} from 'react-native/Libraries/Types/CodegenTypes';
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+
+export interface HighlightFrame {
+  x: Float;
+  y: Float;
+  width: Float;
+  height: Float;
+}
+
+export interface MinimumRectSize {
+  width: Float;
+  height: Float;
+}
+
+export interface HighlightViewTagParams {
+  paddingLeft?: WithDefault<Float, 0>;
+  paddingTop?: WithDefault<Float, 0>;
+  paddingRight?: WithDefault<Float, 0>;
+  paddingBottom?: WithDefault<Float, 0>;
+  offsetX?: WithDefault<Float, 0>;
+  offsetY?: WithDefault<Float, 0>;
+}
+
+export interface NativeProps extends ViewProps {
+  /**
+   * The frame to highlight with x, y, width, height coordinates
+   */
+  highlightFrame?: HighlightFrame;
+
+  /**
+   * The overlay color (processed color int for Android)
+   */
+  overlayColor?: WithDefault<Int32, 0>;
+
+  /**
+   * The border radius for the highlighted area
+   */
+  borderRadius?: WithDefault<Float, 0>;
+
+  /**
+   * The stroke color (processed color int for Android)
+   */
+  strokeColor?: WithDefault<Int32, 0>;
+
+  /**
+   * The stroke width
+   */
+  strokeWidth?: WithDefault<Float, 0>;
+
+  /**
+   * The React tag of the view to highlight
+   */
+  highlightViewTag?: Int32;
+
+  /**
+   * Parameters for view-based highlighting including padding and offset
+   */
+  highlightViewTagParams?: HighlightViewTagParams;
+
+  /**
+   * Minimum rectangle size for the highlight area
+   */
+  minimumRectSize?: MinimumRectSize;
+
+  /**
+   * Inner padding for the highlight area
+   */
+  innerPadding?: WithDefault<Float, 0>;
+}
+
+export default codegenNativeComponent<NativeProps>('HighlighterView');
+
+// const HighlighterViewNativeComponent = requireNativeComponent<NativeProps>('HighlighterView');
+
+// export default HighlighterViewNativeComponent;

package/specs/KeyboardTrackingViewNativeComponent.ts

@@ -0,0 +1,74 @@
+import type {ViewProps} from 'react-native';
+// import {requireNativeComponent, type ViewProps} from 'react-native';
+import type {Int32, WithDefault} from 'react-native/Libraries/Types/CodegenTypes';
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+
+export interface NativeProps extends ViewProps {
+  /**
+   * Enables tracking of the keyboard when it's dismissed interactively (false by default).
+   */
+  trackInteractive?: WithDefault<boolean, false>;
+
+  /**
+   * iOS only.
+   * Show the keyboard on a negative scroll
+   */
+  revealKeyboardInteractive?: WithDefault<boolean, false>;
+
+  /**
+   * iOS only.
+   * Set to false to turn off inset management and manage it yourself
+   */
+  manageScrollView?: WithDefault<boolean, true>;
+
+  /**
+   * iOS only.
+   * Set to true manageScrollView is set to true and still does not work
+   */
+  requiresSameParentToManageScrollView?: WithDefault<boolean, false>;
+
+  /**
+   * iOS only.
+   * Allow hitting sub-views that are placed beyond the view bounds
+   */
+  allowHitsOutsideBounds?: WithDefault<boolean, false>;
+
+  /**
+   * Should the scrollView scroll to the focused input
+   */
+  scrollToFocusedInput?: WithDefault<boolean, false>;
+
+  /**
+   * iOS only.
+   * The scrolling behavior (NONE | SCROLL_TO_BOTTOM_INVERTED_ONLY | FIXED_OFFSET)
+   */
+  scrollBehavior?: WithDefault<Int32, 0>;
+
+  /**
+   * iOS only.
+   * Add a SafeArea view beneath the KeyboardAccessoryView
+   */
+  addBottomView?: WithDefault<boolean, false>;
+
+  /**
+   * iOS only.
+   * The bottom view's color
+   */
+  bottomViewColor?: string;
+
+  /**
+   * Allow control safe area
+   */
+  useSafeArea?: WithDefault<boolean, false>;
+
+  /**
+   * Whether or not to include bottom tab bar inset
+   */
+  usesBottomTabs?: WithDefault<boolean, false>;
+}
+
+export default codegenNativeComponent<NativeProps>('KeyboardTrackingViewTemp');
+
+// const KeyboardTrackingViewNativeComponent = requireNativeComponent<NativeProps>('KeyboardTrackingViewTemp');
+
+// export default KeyboardTrackingViewNativeComponent;

package/components/HighlighterOverlayView/HighlighterViewNativeComponent.js

@@ -1,2 +0,0 @@
-import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
-export default codegenNativeComponent('HighlighterView');

package/components/Keyboard/KeyboardTrackingView/KeyboardTrackingViewNativeComponent.js

@@ -1,2 +0,0 @@
-import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
-export default codegenNativeComponent('KeyboardTrackingViewTemp');