react-native-ui-lib 7.43.0-snapshot.7073 → 7.43.0-snapshot.7087

package/index.js

@@ -1,3 +1,4 @@
+import 'setimmediate';
 require('./demo/src/index');
 require('./demo/src/demoApp'); // this is separated from demo/src/index by purpose
 

package/lib/android/build.gradle

@@ -1,11 +1,11 @@
 apply plugin: 'com.android.library'
 
 project.ext {
-    buildToolsVersion = rootProject.ext.has("buildToolsVersion") ? rootProject.ext.buildToolsVersion : '27.0.3'
-    minSdkVersion = rootProject.ext.has("minSdkVersion") ? rootProject.ext.minSdkVersion : 19
-    compileSdkVersion = rootProject.ext.has("compileSdkVersion") ? rootProject.ext.compileSdkVersion : 27
-    targetSdkVersion = rootProject.ext.has("targetSdkVersion") ? rootProject.ext.targetSdkVersion : 25
-    supportLibVersion = rootProject.ext.has("supportLibVersion") ? rootProject.ext.supportLibVersion  : '27.1.1'
+    buildToolsVersion = rootProject.ext.has("buildToolsVersion") ? rootProject.ext.buildToolsVersion : '35.0.0'
+    minSdkVersion = rootProject.ext.has("minSdkVersion") ? rootProject.ext.minSdkVersion : 24
+    compileSdkVersion = rootProject.ext.has("compileSdkVersion") ? rootProject.ext.compileSdkVersion : 35
+    targetSdkVersion = rootProject.ext.has("targetSdkVersion") ? rootProject.ext.targetSdkVersion : 34
+    supportLibVersion = rootProject.ext.has("supportLibVersion") ? rootProject.ext.supportLibVersion  : '28.0.0'
 }
 
 android {

package/lib/android/src/main/java/com/wix/reactnativeuilib/UiLibPackageList.java

@@ -6,7 +6,6 @@ import com.facebook.react.ReactPackage;
 import com.wix.reactnativeuilib.dynamicfont.DynamicFontPackage;
 import com.wix.reactnativeuilib.highlighterview.HighlighterViewPackage;
 import com.wix.reactnativeuilib.keyboardinput.KeyboardInputPackage;
-import com.wix.reactnativeuilib.textinput.TextInputDelKeyHandlerPackage;
 
 import java.util.Arrays;
 import java.util.List;
@@ -23,7 +22,6 @@ public class UiLibPackageList {
         return Arrays.asList(
                 new DynamicFontPackage(),
                 new HighlighterViewPackage(),
-                new TextInputDelKeyHandlerPackage(),
                 new KeyboardInputPackage(application)
         );
     }

package/lib/android/src/main/java/com/wix/reactnativeuilib/highlighterview/HighlighterViewManager.java

@@ -8,12 +8,15 @@ import android.util.SizeF;
 import android.view.View;
 
 import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.bridge.UIManager;
 import com.facebook.react.uimanager.IllegalViewOperationException;
 import com.facebook.react.uimanager.NativeViewHierarchyManager;
 import com.facebook.react.uimanager.SimpleViewManager;
 import com.facebook.react.uimanager.ThemedReactContext;
+import com.facebook.react.uimanager.UIManagerHelper;
 import com.facebook.react.uimanager.UIManagerModule;
 import com.facebook.react.uimanager.annotations.ReactProp;
+import com.facebook.react.uimanager.common.UIManagerType;
 
 import javax.annotation.Nullable;
 
@@ -75,33 +78,38 @@ class HighlighterViewManager extends SimpleViewManager<HighlighterView> {
 
     @ReactProp(name = "highlightViewTag")
     public void setHighlightViewTag(final HighlighterView view, Integer highlightViewTag) {
-        try {
-            NativeViewHierarchyManager nativeViewHierarchyManager = ReactHacks.getNativeViewHierarchyManager(context.getNativeModule(UIManagerModule.class));
-            if (nativeViewHierarchyManager == null) {
-                return;
-            }
-
-            final View resolvedView = nativeViewHierarchyManager.resolveView(highlightViewTag);
-            if (resolvedView != null) {
-                if (resolvedView.getWidth() == 0 || resolvedView.getHeight() == 0) {
-                    resolvedView.addOnLayoutChangeListener(new View.OnLayoutChangeListener() {
-                        @Override
-                        public void onLayoutChange(View v, int left, int top, int right, int bottom, int oldLeft, int oldTop, int oldRight, int oldBottom) {
-                            float width = right - left;
-                            float height = bottom - top;
-                            if (width > 0 && height > 0) {
-                                setViewBasedHighlightFrame(view, resolvedView);
-                                resolvedView.removeOnLayoutChangeListener(this);
-                            }
+        if (highlightViewTag != null) {
+            try {
+                UIManager uiManager = UIManagerHelper.getUIManagerForReactTag(context, highlightViewTag);
+                if (uiManager != null) {
+                    final View resolvedView = uiManager.resolveView(highlightViewTag);
+                    if (resolvedView != null) {
+                        if (resolvedView.getWidth() == 0 || resolvedView.getHeight() == 0) {
+                            resolvedView.addOnLayoutChangeListener(new View.OnLayoutChangeListener() {
+                                @Override
+                                public void onLayoutChange(View v, int left, int top, int right, int bottom, int oldLeft, int oldTop, int oldRight, int oldBottom) {
+                                    float width = right - left;
+                                    float height = bottom - top;
+                                    if (width > 0 && height > 0) {
+                                        setViewBasedHighlightFrame(view, resolvedView);
+                                        resolvedView.removeOnLayoutChangeListener(this);
+                                    }
+                                }
+                            });
+                        } else {
+                            setViewBasedHighlightFrame(view, resolvedView);
                         }
-                    });
+                    } else {
+                        Log.e("HighlighterView", "was not able to resolve highlightViewTag: " + highlightViewTag.toString());
+                    }
                 } else {
-                    setViewBasedHighlightFrame(view, resolvedView);
+                    Log.e("HighlighterView", "was not able to resolve get uiManager for highlightViewTag: " + highlightViewTag.toString());
                 }
+            } catch (IllegalViewOperationException e) {
+                Log.e("HighlighterView", "invalid highlightViewTag: " + highlightViewTag.toString() + " " + e.toString());
             }
-        }
-        catch (IllegalViewOperationException e) {
-            Log.e("HighlighterView", "invalid highlightViewTag: " + highlightViewTag.toString() + " " + e.toString());
+        } else {
+            Log.e("HighlighterView", "highlightViewTag is null");
         }
     }
 

package/lib/android/src/main/java/com/wix/reactnativeuilib/keyboardinput/utils/RuntimeUtils.java

@@ -9,7 +9,7 @@ public class RuntimeUtils {
     private static final Runnable sUIUpdateClosure = new Runnable() {
         @Override
         public void run() {
-            ReactContextHolder.getContext().getNativeModule(UIManagerModule.class).onBatchComplete();
+            // ReactContextHolder.getContext().getNativeModule(UIManagerModule.class).onBatchComplete();
         }
     };
 

package/lib/components/Keyboard/KeyboardInput/CustomKeyboardView/CustomKeyboardView.android.d.ts

@@ -3,5 +3,8 @@ import CustomKeyboardViewBase, { CustomKeyboardViewBaseProps } from '../CustomKe
 export default class CustomKeyboardView extends CustomKeyboardViewBase<CustomKeyboardViewBaseProps> {
     static displayName: string;
     componentDidUpdate(prevProps: CustomKeyboardViewBaseProps): Promise<void>;
-    render(): React.JSX.Element;
+    getStyle: () => {
+        height: number | undefined;
+    };
+    render(): React.JSX.Element | null;
 }

package/lib/components/Keyboard/KeyboardInput/CustomKeyboardView/CustomKeyboardView.android.js

@@ -1,28 +1,51 @@
 import React from 'react';
-import { requireNativeComponent } from 'react-native';
-import TextInputKeyboardManager from "../TextInputKeyboardManager/TextInputKeyboardManager.android";
+import { Keyboard, View } from 'react-native';
 import KeyboardRegistry from "../KeyboardRegistry";
 import CustomKeyboardViewBase from "../CustomKeyboardViewBase";
-const CustomKeyboardViewNativeAndroid = requireNativeComponent('CustomKeyboardViewNativeTemp');
 export default class CustomKeyboardView extends CustomKeyboardViewBase {
   static displayName = 'IGNORE';
   async componentDidUpdate(prevProps) {
     const {
-      component
+      component,
+      inputRef,
+      shouldFocus,
+      onKeyboardDismiss
     } = this.props;
-    if (prevProps.component !== component && !component) {
-      await TextInputKeyboardManager.reset();
+    if (prevProps.component !== component) {
+      if (!component) {
+        if (shouldFocus) {
+          if (inputRef?.current) {
+            inputRef.current.focus?.();
+          } else {
+            inputRef?.focus?.();
+          }
+        }
+      } else {
+        Keyboard.dismiss();
+      }
+      onKeyboardDismiss?.();
     }
     super.componentDidUpdate(prevProps);
   }
+  getStyle = () => {
+    const {
+      keyboardHeight
+    } = this.props;
+    return {
+      height: keyboardHeight
+    };
+  };
   render() {
     const {
       component,
       initialProps
     } = this.props;
     const KeyboardComponent = component && KeyboardRegistry.getKeyboard(component);
-    return <CustomKeyboardViewNativeAndroid>
-        {KeyboardComponent && <KeyboardComponent {...initialProps} />}
-      </CustomKeyboardViewNativeAndroid>;
+    if (!KeyboardComponent) {
+      return null;
+    }
+    return <View style={this.getStyle()}>
+        <KeyboardComponent {...initialProps} />
+      </View>;
   }
 }

package/lib/components/Keyboard/KeyboardInput/CustomKeyboardViewBase.d.ts

@@ -3,6 +3,9 @@ import { EventSubscription } from 'react-native';
 export type CustomKeyboardViewBaseProps = {
     inputRef?: any;
     initialProps?: any;
+    keyboardHeight?: number;
+    onKeyboardDismiss?: () => void;
+    shouldFocus?: boolean;
     component?: string;
     onItemSelected?: (component?: string, args?: any) => void;
     onRequestShowKeyboard?: (keyboardId: string) => void;

package/lib/components/Keyboard/KeyboardInput/KeyboardAccessoryView.d.ts

@@ -58,9 +58,16 @@ declare class KeyboardAccessoryView extends Component<KeyboardAccessoryViewProps
         allowHitsOutsideBounds: boolean;
         scrollBehavior: any;
     };
+    static currentId: number;
     customInputControllerEventsSubscriber: any;
     trackingViewRef: any;
+    subscription: any;
+    id: number;
     constructor(props: KeyboardAccessoryViewProps);
+    state: {
+        keyboardHeight: number;
+        shouldFocus: boolean;
+    };
     componentWillUnmount(): void;
     onContainerComponentHeightChanged(event: LayoutChangeEvent): void;
     onAndroidBackPressed(): boolean;
@@ -69,6 +76,9 @@ declare class KeyboardAccessoryView extends Component<KeyboardAccessoryViewProps
     registerAndroidBackHandler(): void;
     processInitialProps(): any;
     scrollToStart(): void;
+    onKeyboardHeightChange: (keyboardHeight: number) => void;
+    onDismiss: () => void;
+    onKeyboardDismiss: () => void;
     render(): React.JSX.Element;
 }
 export default KeyboardAccessoryView;

package/lib/components/Keyboard/KeyboardInput/KeyboardAccessoryView.js

@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { StyleSheet, Platform, NativeModules, NativeEventEmitter, DeviceEventEmitter, processColor, BackHandler } from 'react-native';
 import KeyboardTrackingView from "../KeyboardTracking/KeyboardTrackingView";
 import CustomKeyboardView from "./CustomKeyboardView";
-import KeyboardUtils from "./utils/KeyboardUtils";
+import KeyboardUtils, { KeyboardHeightListener } from "./utils/KeyboardUtils";
 const IsIOS = Platform.OS === 'ios';
 const IsAndroid = Platform.OS === 'android';
 /**
@@ -20,9 +20,11 @@ class KeyboardAccessoryView extends Component {
     allowHitsOutsideBounds: false,
     scrollBehavior: KeyboardTrackingView.scrollBehaviors.FIXED_OFFSET
   };
+  static currentId = 0;
 
   // TODO: fix
 
+  id = ++KeyboardAccessoryView.currentId;
   constructor(props) {
     super(props);
     this.onContainerComponentHeightChanged = this.onContainerComponentHeightChanged.bind(this);
@@ -33,12 +35,16 @@ class KeyboardAccessoryView extends Component {
     this.registerForKeyboardResignedEvent();
     this.registerAndroidBackHandler();
   }
+  state = {
+    keyboardHeight: 0,
+    shouldFocus: true
+  };
   componentWillUnmount() {
     if (this.customInputControllerEventsSubscriber) {
       this.customInputControllerEventsSubscriber.remove();
     }
     if (IsAndroid) {
-      BackHandler.removeEventListener('hardwareBackPress', this.onAndroidBackPressed);
+      this.subscription.remove();
     }
   }
   onContainerComponentHeightChanged(event) {
@@ -87,7 +93,7 @@ class KeyboardAccessoryView extends Component {
   }
   registerAndroidBackHandler() {
     if (IsAndroid) {
-      BackHandler.addEventListener('hardwareBackPress', this.onAndroidBackPressed);
+      this.subscription = BackHandler.addEventListener('hardwareBackPress', this.onAndroidBackPressed);
     }
   }
   processInitialProps() {
@@ -106,7 +112,26 @@ class KeyboardAccessoryView extends Component {
       this.trackingViewRef.scrollToStart();
     }
   }
+  onKeyboardHeightChange = keyboardHeight => {
+    this.setState({
+      keyboardHeight
+    });
+  };
+  onDismiss = () => {
+    this.setState({
+      shouldFocus: false
+    });
+  };
+  onKeyboardDismiss = () => {
+    this.setState({
+      shouldFocus: true
+    });
+  };
   render() {
+    const {
+      keyboardHeight,
+      shouldFocus
+    } = this.state;
     const {
       renderContent,
       kbInputRef,
@@ -117,8 +142,9 @@ class KeyboardAccessoryView extends Component {
       ...others
     } = this.props;
     return <KeyboardTrackingView {...others} scrollBehavior={scrollBehavior} ref={r => this.trackingViewRef = r} style={styles.trackingToolbarContainer} onLayout={this.onContainerComponentHeightChanged}>
+        <KeyboardHeightListener id={`${this.id}`} onDismiss={this.onDismiss} onKeyboardHeightChange={this.onKeyboardHeightChange} />
         <>{renderContent?.()}</>
-        <CustomKeyboardView inputRef={kbInputRef} component={kbComponent} initialProps={this.processInitialProps()} onItemSelected={onItemSelected} onRequestShowKeyboard={onRequestShowKeyboard} useSafeArea={others.useSafeArea} />
+        <CustomKeyboardView keyboardHeight={keyboardHeight} shouldFocus={shouldFocus} onKeyboardDismiss={this.onKeyboardDismiss} inputRef={kbInputRef} component={kbComponent} initialProps={this.processInitialProps()} onItemSelected={onItemSelected} onRequestShowKeyboard={onRequestShowKeyboard} useSafeArea={others.useSafeArea} />
       </KeyboardTrackingView>;
   }
 }

package/lib/components/Keyboard/KeyboardInput/utils/KeyboardUtils.d.ts

@@ -1,11 +1,26 @@
-/**
- * @description: util for managing the keyboard.
- * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/nativeComponentScreens/keyboardInput/KeyboardInputViewScreen.js
- */
 export default class KeyboardUtils {
     static displayName: string;
+    private static listeners;
+    private static addListener;
+    private static removeListener;
     /**
      * Used to dismiss (close) the keyboard.
      */
     static dismiss: () => void;
 }
+interface KeyboardHeightProps {
+    id: string;
+    onDismiss: () => void;
+}
+declare const useKeyboardHeight: ({ id, onDismiss }: KeyboardHeightProps) => {
+    keyboardHeight: number;
+    isKeyboardVisible: boolean;
+};
+export interface KeyboardHeightListenerProps {
+    id: string;
+    onDismiss: () => void;
+    onKeyboardHeightChange?: (height: number) => void;
+    onKeyboardVisibilityChange?: (isKeyboardVisible: boolean) => void;
+}
+declare const KeyboardHeightListener: ({ id, onDismiss, onKeyboardHeightChange, onKeyboardVisibilityChange }: KeyboardHeightListenerProps) => null;
+export { useKeyboardHeight, KeyboardHeightListener };

package/lib/components/Keyboard/KeyboardInput/utils/KeyboardUtils.js

@@ -1,17 +1,91 @@
-import { Keyboard } from 'react-native';
+import { useCallback, useEffect, useState } from 'react';
+import { Keyboard, Platform } from 'react-native';
 import TextInputKeyboardManager from "../TextInputKeyboardManager";
+const IS_IOS = Platform.OS === 'ios';
+const DEFAULT_KEYBOARD_HEIGHT = IS_IOS ? 216 : 312; // TODO: verify this value for iOS
 
-/**
- * @description: util for managing the keyboard.
- * @example: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/nativeComponentScreens/keyboardInput/KeyboardInputViewScreen.js
- */
 export default class KeyboardUtils {
   static displayName = 'KeyboardUtils';
+  static listeners = {};
+  static addListener = (id, onDismiss) => {
+    if (id && onDismiss && !KeyboardUtils.listeners[id]) {
+      KeyboardUtils.listeners[id] = onDismiss;
+    }
+  };
+  static removeListener = id => {
+    if (id && KeyboardUtils.listeners[id]) {
+      delete KeyboardUtils.listeners[id];
+    }
+  };
+
   /**
    * Used to dismiss (close) the keyboard.
    */
   static dismiss = () => {
     Keyboard.dismiss();
     TextInputKeyboardManager.dismissKeyboard();
+    Object.keys(KeyboardUtils.listeners).forEach(key => {
+      KeyboardUtils.listeners[key]();
+    });
+  };
+}
+const useKeyboardHeight = ({
+  id,
+  onDismiss
+}) => {
+  const [isInitialized, setIsInitialized] = useState(false);
+  const [keyboardHeight, setKeyboardHeight] = useState(DEFAULT_KEYBOARD_HEIGHT);
+  const [isVisible, setIsVisible] = useState(false);
+  const keyboardDidShow = useCallback(e => {
+    if (!isInitialized) {
+      setIsInitialized(true);
+      setKeyboardHeight(e.endCoordinates.height);
+    }
+    setIsVisible(true);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const keyboardDidHide = useCallback(() => {
+    setIsVisible(false);
+  }, []);
+  useEffect(() => {
+    const keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', keyboardDidShow);
+    const keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', keyboardDidHide);
+    // @ts-ignore
+    KeyboardUtils.addListener(id, onDismiss);
+    return () => {
+      keyboardDidShowListener.remove();
+      keyboardDidHideListener.remove();
+      // @ts-ignore
+      KeyboardUtils.removeListener(id);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  return {
+    keyboardHeight,
+    isKeyboardVisible: isVisible
   };
-}
+};
+const KeyboardHeightListener = ({
+  id,
+  onDismiss,
+  onKeyboardHeightChange,
+  onKeyboardVisibilityChange
+}) => {
+  const {
+    keyboardHeight,
+    isKeyboardVisible
+  } = useKeyboardHeight({
+    id,
+    onDismiss
+  });
+  useEffect(() => {
+    onKeyboardHeightChange?.(keyboardHeight);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [keyboardHeight]);
+  useEffect(() => {
+    onKeyboardVisibilityChange?.(isKeyboardVisible);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isKeyboardVisible]);
+  return null;
+};
+export { useKeyboardHeight, KeyboardHeightListener };

package/lib/components/Keyboard/KeyboardTracking/KeyboardTrackingView/index.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ViewStyle, ViewProps } from 'react-native';
+import { StyleProp, ViewStyle, ViewProps } from 'react-native';
 declare const SCROLL_BEHAVIORS: {
     NONE: any;
     SCROLL_TO_BOTTOM_INVERTED_ONLY: any;
@@ -72,7 +72,7 @@ export type KeyboardTrackingViewProps = ViewProps & {
      */
     usesBottomTabs?: boolean;
     ref?: any;
-    style?: ViewStyle;
+    style?: StyleProp<ViewStyle>;
     children?: React.ReactChild | React.ReactChild[];
 };
 declare const _default: React.ForwardRefExoticComponent<Omit<KeyboardTrackingViewProps, "ref"> & React.RefAttributes<unknown>> & {

package/lib/components/Keyboard/index.d.ts

@@ -26,7 +26,7 @@ declare const _default: {
             useSafeArea?: boolean | undefined;
             usesBottomTabs?: boolean | undefined;
             ref?: any;
-            style?: import("react-native/types").ViewStyle | undefined;
+            style?: import("react-native/types").StyleProp<import("react-native/types").ViewStyle>;
             children?: import("react").ReactChild | import("react").ReactChild[] | undefined;
         } & {
             offset?: number | undefined;

package/lib/react-native.config.js

@@ -10,11 +10,9 @@ module.exports = {
         sourceDir: './android/',
         packageImportPath: `import com.wix.reactnativeuilib.dynamicfont.DynamicFontPackage;
 import com.wix.reactnativeuilib.highlighterview.HighlighterViewPackage;
-import com.wix.reactnativeuilib.keyboardinput.KeyboardInputPackage;
-import com.wix.reactnativeuilib.textinput.TextInputDelKeyHandlerPackage;`,
+import com.wix.reactnativeuilib.keyboardinput.KeyboardInputPackage;`,
         packageInstance: `new DynamicFontPackage(),
       new HighlighterViewPackage(),
-      new TextInputDelKeyHandlerPackage(),
       new KeyboardInputPackage(getApplication())`
       }
     }

package/metro.config.js

@@ -5,9 +5,9 @@ const {assetExts, sourceExts} = defaultConfig.resolver;
 
 /**
  * Metro configuration
- * https://facebook.github.io/metro/docs/configuration
+ * https://reactnative.dev/docs/metro
  *
- * @type {import('metro-config').MetroConfig}
+ * @type {import('@react-native/metro-config').MetroConfig}
  */
 
 const config = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-ui-lib",
-  "version": "7.43.0-snapshot.7073",
+  "version": "7.43.0-snapshot.7087",
   "main": "src/index.js",
   "types": "src/index.d.ts",
   "author": "Ethan Sharabi <ethan.shar@gmail.com>",
@@ -62,9 +62,9 @@
   },
   "devDependencies": {
     "@babel/cli": "^7.16.8",
-    "@babel/core": "^7.24.4",
+    "@babel/core": "^7.25.2",
     "@babel/plugin-transform-modules-commonjs": "^7.17.9",
-    "@babel/preset-env": "^7.20.0",
+    "@babel/preset-env": "^7.25.3",
     "@babel/preset-react": "^7.10.1",
     "@babel/runtime": "^7.20.0",
     "@formatjs/intl-datetimeformat": "^6.0.3",
@@ -73,28 +73,29 @@
     "@formatjs/intl-numberformat": "^8.0.4",
     "@formatjs/intl-pluralrules": "^5.0.3",
     "@react-native-community/blur": "4.4.1",
+    "@react-native-community/cli": "15.0.1",
+    "@react-native-community/cli-platform-android": "15.0.1",
+    "@react-native-community/cli-platform-ios": "15.0.1",
     "@react-native-community/datetimepicker": "^3.4.6",
-    "@react-native-community/netinfo": "^5.6.2",
-    "@react-native/babel-preset": "0.73.21",
-    "@react-native/eslint-config": "0.73.2",
-    "@react-native/metro-config": "0.73.5",
-    "@react-native/typescript-config": "0.73.1",
+    "@react-native-community/netinfo": "11.3.3",
+    "@react-native/babel-preset": "0.77.2",
+    "@react-native/eslint-config": "0.77.2",
+    "@react-native/metro-config": "0.77.2",
+    "@react-native/typescript-config": "0.77.2",
     "@shopify/flash-list": "1.7.6",
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/react-native": "^11.5.1",
     "@types/hoist-non-react-statics": "^3.3.1",
-    "@types/jest": "^29.2.1",
+    "@types/jest": "^29.5.13",
     "@types/lodash": "^4.0.0",
     "@types/prop-types": "^15.5.3",
     "@types/react": "18.3.7",
-    "@types/react-native": "0.73.0",
     "@types/react-test-renderer": "^18.3.0",
     "@types/tinycolor2": "^1.4.2",
     "@types/url-parse": "^1.4.3",
     "@typescript-eslint/eslint-plugin": "^5.3.1",
     "@typescript-eslint/parser": "^5.3.1",
     "@welldone-software/why-did-you-render": "^3.2.1",
-    "babel-jest": "^29.6.3",
     "babel-plugin-lodash": "^3.3.4",
     "babel-plugin-module-resolver": "^5.0.0",
     "eslint": "8.19.0",
@@ -104,7 +105,6 @@
     "eslint-plugin-react-native": "^4.0.0",
     "jest": "^29.6.3",
     "light-date": "^1.2.0",
-    "metro-react-native-babel-preset": "0.73.10",
     "moment": "^2.24.0",
     "object-hash": "^3.0.0",
     "postcss": "^8.4.21",
@@ -114,27 +114,28 @@
     "react": "18.2.0",
     "react-autobind": "^1.0.6",
     "react-dom": "^18.2.0",
-    "react-native": "0.73.9",
+    "react-native": "0.77.2",
     "react-native-fs": "^2.20.0",
-    "react-native-gesture-handler": "2.14.1",
+    "react-native-gesture-handler": "2.22.1",
     "react-native-haptic-feedback": "^1.11.0",
     "react-native-linear-gradient": "2.6.2",
-    "react-native-mmkv": "2.11.0",
-    "react-native-navigation": "7.40.1",
+    "react-native-mmkv": "3.2.0",
+    "react-native-navigation": "8.1.0-rc01-snapshot.1710",
     "react-native-reanimated": "3.16.7",
     "react-native-shimmer-placeholder": "^2.0.6",
-    "react-native-svg": "15.2.0",
+    "react-native-svg": "15.11.2",
     "react-native-svg-transformer": "1.5.0",
-    "react-test-renderer": "18.2.0",
+    "react-test-renderer": "18.3.1",
     "reassure": "^0.4.1",
+    "setimmediate": "^1.0.5",
     "shell-utils": "^1.0.10",
     "typescript": "5.0.4"
   },
   "peerDependencies": {
     "react": ">=17.0.1",
-    "react-native": ">=0.64.1",
-    "react-native-gesture-handler": ">=2.5.0",
-    "react-native-reanimated": ">=2.0.0",
+    "react-native": ">=0.76.0",
+    "react-native-gesture-handler": ">=2.22.0",
+    "react-native-reanimated": ">=3.16.7",
     "react-native-ui-lib": "*"
   },
   "jest": {
@@ -162,7 +163,6 @@
   "engines": {
     "node": ">=18"
   },
-  "packageManager": "yarn@3.4.1",
   "files": [
     "*.js",
     "*.d.ts",

package/panView.d.ts

@@ -0,0 +1,2 @@
+import {PanView} from './src';
+export default PanView;

package/panView.js

@@ -0,0 +1 @@
+module.exports = require('./src/components/panView').default;

package/react-native.config.js

@@ -10,11 +10,9 @@ module.exports = {
         sourceDir: '../uilib-native/android/',
         packageImportPath: `import com.wix.reactnativeuilib.dynamicfont.DynamicFontPackage;
 import com.wix.reactnativeuilib.highlighterview.HighlighterViewPackage;
-import com.wix.reactnativeuilib.keyboardinput.KeyboardInputPackage;
-import com.wix.reactnativeuilib.textinput.TextInputDelKeyHandlerPackage;`,
+import com.wix.reactnativeuilib.keyboardinput.KeyboardInputPackage;`,
         packageInstance: `new DynamicFontPackage(),
       new HighlighterViewPackage(),
-      new TextInputDelKeyHandlerPackage(),
       new KeyboardInputPackage(getApplication())`
       }
     }