react-native-keyboard-controller 1.9.5 → 1.10.0

package/lib/module/animated.js

@@ -5,7 +5,7 @@ import { KeyboardControllerView } from './bindings';
 import { KeyboardContext } from './context';
 import { useAnimatedValue, useSharedHandlers } from './internal';
 import { applyMonkeyPatch, revertMonkeyPatch } from './monkey-patch';
-import { useAnimatedKeyboardHandler, useFocusedInputHandler } from './reanimated';
+import { useAnimatedKeyboardHandler, useFocusedInputLayoutHandler, useFocusedInputTextHandler } from './reanimated';
 const KeyboardControllerViewAnimated = Reanimated.createAnimatedComponent(Animated.createAnimatedComponent(KeyboardControllerView));
 const styles = StyleSheet.create({
   container: {
@@ -23,6 +23,7 @@ export const KeyboardProvider = _ref => {
     navigationBarTranslucent,
     enabled: initiallyEnabled = true
   } = _ref;
+  // state
   const [enabled, setEnabled] = useState(initiallyEnabled);
   // animated values
   const progress = useAnimatedValue(0);
@@ -31,10 +32,8 @@ export const KeyboardProvider = _ref => {
   const progressSV = useSharedValue(0);
   const heightSV = useSharedValue(0);
   const layout = useSharedValue(null);
-  const {
-    setHandlers,
-    broadcast
-  } = useSharedHandlers();
+  const [setKeyboardHandlers, broadcastKeyboardEvents] = useSharedHandlers();
+  const [setInputHandlers, broadcastInputEvents] = useSharedHandlers();
   // memo
   const context = useMemo(() => ({
     enabled,
@@ -47,7 +46,8 @@ export const KeyboardProvider = _ref => {
       height: heightSV
     },
     layout,
-    setHandlers,
+    setKeyboardHandlers,
+    setInputHandlers,
     setEnabled
   }), [enabled]);
   const style = useMemo(() => [styles.hidden, {
@@ -78,28 +78,28 @@ export const KeyboardProvider = _ref => {
     onKeyboardMoveStart: event => {
       'worklet';
 
-      broadcast('onStart', event);
+      broadcastKeyboardEvents('onStart', event);
       updateSharedValues(event, ['ios']);
     },
     onKeyboardMove: event => {
       'worklet';
 
-      broadcast('onMove', event);
+      broadcastKeyboardEvents('onMove', event);
       updateSharedValues(event, ['android']);
     },
     onKeyboardMoveEnd: event => {
       'worklet';
 
-      broadcast('onEnd', event);
+      broadcastKeyboardEvents('onEnd', event);
     },
     onKeyboardMoveInteractive: event => {
       'worklet';
 
       updateSharedValues(event, ['android', 'ios']);
-      broadcast('onInteractive', event);
+      broadcastKeyboardEvents('onInteractive', event);
     }
   }, []);
-  const inputHandler = useFocusedInputHandler({
+  const inputLayoutHandler = useFocusedInputLayoutHandler({
     onFocusedInputLayoutChanged: e => {
       'worklet';
 
@@ -110,6 +110,13 @@ export const KeyboardProvider = _ref => {
       }
     }
   }, []);
+  const inputTextHandler = useFocusedInputTextHandler({
+    onFocusedInputTextChanged: e => {
+      'worklet';
+
+      broadcastInputEvents('onChangeText', e);
+    }
+  }, []);
   // effects
   useEffect(() => {
     if (enabled) {
@@ -126,11 +133,10 @@ export const KeyboardProvider = _ref => {
     onKeyboardMoveStart: Platform.OS === 'ios' ? onKeyboardMove : undefined,
     onKeyboardMove: Platform.OS === 'android' ? onKeyboardMove : undefined,
     onKeyboardMoveInteractive: onKeyboardMove,
-    onFocusedInputLayoutChangedReanimated: inputHandler,
+    onFocusedInputLayoutChangedReanimated: inputLayoutHandler,
+    onFocusedInputTextChangedReanimated: inputTextHandler,
     navigationBarTranslucent: navigationBarTranslucent,
-    statusBarTranslucent: statusBarTranslucent
-    // @ts-expect-error https://github.com/software-mansion/react-native-reanimated/pull/4923
-    ,
+    statusBarTranslucent: statusBarTranslucent,
     style: styles.container
   }, children), /*#__PURE__*/React.createElement(Animated.View, {
     // we are using this small hack, because if the component (where

package/lib/module/animated.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useMemo","useState","Animated","Platform","StyleSheet","Reanimated","useSharedValue","KeyboardControllerView","KeyboardContext","useAnimatedValue","useSharedHandlers","applyMonkeyPatch","revertMonkeyPatch","useAnimatedKeyboardHandler","useFocusedInputHandler","KeyboardControllerViewAnimated","createAnimatedComponent","styles","create","container","flex","hidden","display","position","KeyboardProvider","children","statusBarTranslucent","navigationBarTranslucent","enabled","initiallyEnabled","setEnabled","progress","height","progressSV","heightSV","layout","setHandlers","broadcast","context","animated","multiply","reanimated","style","transform","translateX","translateY","onKeyboardMove","event","nativeEvent","useNativeDriver","updateSharedValues","platforms","includes","OS","value","keyboardHandler","onKeyboardMoveStart","onKeyboardMoveEnd","onKeyboardMoveInteractive","inputHandler","onFocusedInputLayoutChanged","e","target","undefined"],"sources":["animated.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport { Animated, Platform, StyleSheet } from 'react-native';\nimport Reanimated, { useSharedValue } from 'react-native-reanimated';\n\nimport { KeyboardControllerView } from './bindings';\nimport { KeyboardContext } from './context';\nimport { useAnimatedValue, useSharedHandlers } from './internal';\nimport { applyMonkeyPatch, revertMonkeyPatch } from './monkey-patch';\nimport {\n  useAnimatedKeyboardHandler,\n  useFocusedInputHandler,\n} from './reanimated';\n\nimport type { KeyboardAnimationContext } from './context';\nimport type {\n  FocusedInputLayoutChangedEvent,\n  KeyboardControllerProps,\n  KeyboardHandler,\n  NativeEvent,\n} from './types';\nimport type { ViewStyle } from 'react-native';\n\nconst KeyboardControllerViewAnimated = Reanimated.createAnimatedComponent(\n  Animated.createAnimatedComponent(\n    KeyboardControllerView\n  ) as React.FC<KeyboardControllerProps>\n);\n\ntype Styles = {\n  container: ViewStyle;\n  hidden: ViewStyle;\n};\n\nconst styles = StyleSheet.create<Styles>({\n  container: {\n    flex: 1,\n  },\n  hidden: {\n    display: 'none',\n    position: 'absolute',\n  },\n});\n\ntype KeyboardProviderProps = {\n  children: React.ReactNode;\n  /**\n   * Set the value to `true`, if you use translucent status bar on Android.\n   * If you already control status bar translucency via `react-native-screens`\n   * or `StatusBar` component from `react-native`, you can ignore it.\n   * Defaults to `false`.\n   *\n   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/14\n   * @platform android\n   */\n  statusBarTranslucent?: boolean;\n  /**\n   * Set the value to `true`, if you use translucent navigation bar on Android.\n   * Defaults to `false`.\n   *\n   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/119\n   * @platform android\n   */\n  navigationBarTranslucent?: boolean;\n  /**\n   * A boolean prop indicating whether the module is enabled. It indicate only initial state,\n   * i. e. if you try to change this prop after component mount it will not have any effect.\n   * To change the property in runtime use `useKeyboardController` hook and `setEnabled` method.\n   * Defaults to `true`.\n   */\n  enabled?: boolean;\n};\n\nexport const KeyboardProvider = ({\n  children,\n  statusBarTranslucent,\n  navigationBarTranslucent,\n  enabled: initiallyEnabled = true,\n}: KeyboardProviderProps) => {\n  const [enabled, setEnabled] = useState(initiallyEnabled);\n  // animated values\n  const progress = useAnimatedValue(0);\n  const height = useAnimatedValue(0);\n  // shared values\n  const progressSV = useSharedValue(0);\n  const heightSV = useSharedValue(0);\n  const layout = useSharedValue<FocusedInputLayoutChangedEvent | null>(null);\n  const { setHandlers, broadcast } = useSharedHandlers<KeyboardHandler>();\n  // memo\n  const context = useMemo<KeyboardAnimationContext>(\n    () => ({\n      enabled,\n      animated: { progress: progress, height: Animated.multiply(height, -1) },\n      reanimated: { progress: progressSV, height: heightSV },\n      layout,\n      setHandlers,\n      setEnabled,\n    }),\n    [enabled]\n  );\n  const style = useMemo(\n    () => [\n      styles.hidden,\n      { transform: [{ translateX: height }, { translateY: progress }] },\n    ],\n    []\n  );\n  const onKeyboardMove = useMemo(\n    () =>\n      Animated.event(\n        [\n          {\n            nativeEvent: {\n              progress,\n              height,\n            },\n          },\n        ],\n        { useNativeDriver: true }\n      ),\n    []\n  );\n  // handlers\n  const updateSharedValues = (event: NativeEvent, platforms: string[]) => {\n    'worklet';\n\n    if (platforms.includes(Platform.OS)) {\n      progressSV.value = event.progress;\n      heightSV.value = -event.height;\n    }\n  };\n  const keyboardHandler = useAnimatedKeyboardHandler(\n    {\n      onKeyboardMoveStart: (event: NativeEvent) => {\n        'worklet';\n\n        broadcast('onStart', event);\n        updateSharedValues(event, ['ios']);\n      },\n      onKeyboardMove: (event: NativeEvent) => {\n        'worklet';\n\n        broadcast('onMove', event);\n        updateSharedValues(event, ['android']);\n      },\n      onKeyboardMoveEnd: (event: NativeEvent) => {\n        'worklet';\n\n        broadcast('onEnd', event);\n      },\n      onKeyboardMoveInteractive: (event: NativeEvent) => {\n        'worklet';\n\n        updateSharedValues(event, ['android', 'ios']);\n        broadcast('onInteractive', event);\n      },\n    },\n    []\n  );\n  const inputHandler = useFocusedInputHandler(\n    {\n      onFocusedInputLayoutChanged: (e) => {\n        'worklet';\n\n        if (e.target !== -1) {\n          layout.value = e;\n        } else {\n          layout.value = null;\n        }\n      },\n    },\n    []\n  );\n  // effects\n  useEffect(() => {\n    if (enabled) {\n      applyMonkeyPatch();\n    } else {\n      revertMonkeyPatch();\n    }\n  }, [enabled]);\n\n  return (\n    <KeyboardContext.Provider value={context}>\n      <KeyboardControllerViewAnimated\n        enabled={enabled}\n        onKeyboardMoveReanimated={keyboardHandler}\n        onKeyboardMoveStart={Platform.OS === 'ios' ? onKeyboardMove : undefined}\n        onKeyboardMove={Platform.OS === 'android' ? onKeyboardMove : undefined}\n        onKeyboardMoveInteractive={onKeyboardMove}\n        onFocusedInputLayoutChangedReanimated={inputHandler}\n        navigationBarTranslucent={navigationBarTranslucent}\n        statusBarTranslucent={statusBarTranslucent}\n        // @ts-expect-error https://github.com/software-mansion/react-native-reanimated/pull/4923\n        style={styles.container}\n      >\n        {children}\n      </KeyboardControllerViewAnimated>\n      <Animated.View\n        // we are using this small hack, because if the component (where\n        // animated value has been used) is unmounted, then animation will\n        // stop receiving events (seems like it's react-native optimization).\n        // So we need to keep a reference to the animated value, to keep it's\n        // always mounted (keep a reference to an animated value).\n        //\n        // To test why it's needed, try to open screen which consumes Animated.Value\n        // then close it and open it again (for example 'Animated transition').\n        style={style}\n      />\n    </KeyboardContext.Provider>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"names":["React","useEffect","useMemo","useState","Animated","Platform","StyleSheet","Reanimated","useSharedValue","KeyboardControllerView","KeyboardContext","useAnimatedValue","useSharedHandlers","applyMonkeyPatch","revertMonkeyPatch","useAnimatedKeyboardHandler","useFocusedInputLayoutHandler","useFocusedInputTextHandler","KeyboardControllerViewAnimated","createAnimatedComponent","styles","create","container","flex","hidden","display","position","KeyboardProvider","children","statusBarTranslucent","navigationBarTranslucent","enabled","initiallyEnabled","setEnabled","progress","height","progressSV","heightSV","layout","setKeyboardHandlers","broadcastKeyboardEvents","setInputHandlers","broadcastInputEvents","context","animated","multiply","reanimated","style","transform","translateX","translateY","onKeyboardMove","event","nativeEvent","useNativeDriver","updateSharedValues","platforms","includes","OS","value","keyboardHandler","onKeyboardMoveStart","onKeyboardMoveEnd","onKeyboardMoveInteractive","inputLayoutHandler","onFocusedInputLayoutChanged","e","target","inputTextHandler","onFocusedInputTextChanged","undefined"],"sources":["animated.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport { Animated, Platform, StyleSheet } from 'react-native';\nimport Reanimated, { useSharedValue } from 'react-native-reanimated';\n\nimport { KeyboardControllerView } from './bindings';\nimport { KeyboardContext } from './context';\nimport { useAnimatedValue, useSharedHandlers } from './internal';\nimport { applyMonkeyPatch, revertMonkeyPatch } from './monkey-patch';\nimport {\n  useAnimatedKeyboardHandler,\n  useFocusedInputLayoutHandler,\n  useFocusedInputTextHandler,\n} from './reanimated';\n\nimport type { KeyboardAnimationContext } from './context';\nimport type {\n  FocusedInputHandler,\n  FocusedInputLayoutChangedEvent,\n  KeyboardControllerProps,\n  KeyboardHandler,\n  NativeEvent,\n} from './types';\nimport type { ViewStyle } from 'react-native';\n\nconst KeyboardControllerViewAnimated = Reanimated.createAnimatedComponent(\n  Animated.createAnimatedComponent(\n    KeyboardControllerView\n  ) as React.FC<KeyboardControllerProps>\n);\n\ntype Styles = {\n  container: ViewStyle;\n  hidden: ViewStyle;\n};\n\nconst styles = StyleSheet.create<Styles>({\n  container: {\n    flex: 1,\n  },\n  hidden: {\n    display: 'none',\n    position: 'absolute',\n  },\n});\n\ntype KeyboardProviderProps = {\n  children: React.ReactNode;\n  /**\n   * Set the value to `true`, if you use translucent status bar on Android.\n   * If you already control status bar translucency via `react-native-screens`\n   * or `StatusBar` component from `react-native`, you can ignore it.\n   * Defaults to `false`.\n   *\n   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/14\n   * @platform android\n   */\n  statusBarTranslucent?: boolean;\n  /**\n   * Set the value to `true`, if you use translucent navigation bar on Android.\n   * Defaults to `false`.\n   *\n   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/119\n   * @platform android\n   */\n  navigationBarTranslucent?: boolean;\n  /**\n   * A boolean prop indicating whether the module is enabled. It indicate only initial state,\n   * i. e. if you try to change this prop after component mount it will not have any effect.\n   * To change the property in runtime use `useKeyboardController` hook and `setEnabled` method.\n   * Defaults to `true`.\n   */\n  enabled?: boolean;\n};\n\nexport const KeyboardProvider = ({\n  children,\n  statusBarTranslucent,\n  navigationBarTranslucent,\n  enabled: initiallyEnabled = true,\n}: KeyboardProviderProps) => {\n  // state\n  const [enabled, setEnabled] = useState(initiallyEnabled);\n  // animated values\n  const progress = useAnimatedValue(0);\n  const height = useAnimatedValue(0);\n  // shared values\n  const progressSV = useSharedValue(0);\n  const heightSV = useSharedValue(0);\n  const layout = useSharedValue<FocusedInputLayoutChangedEvent | null>(null);\n  const [setKeyboardHandlers, broadcastKeyboardEvents] =\n    useSharedHandlers<KeyboardHandler>();\n  const [setInputHandlers, broadcastInputEvents] =\n    useSharedHandlers<FocusedInputHandler>();\n  // memo\n  const context = useMemo<KeyboardAnimationContext>(\n    () => ({\n      enabled,\n      animated: { progress: progress, height: Animated.multiply(height, -1) },\n      reanimated: { progress: progressSV, height: heightSV },\n      layout,\n      setKeyboardHandlers,\n      setInputHandlers,\n      setEnabled,\n    }),\n    [enabled]\n  );\n  const style = useMemo(\n    () => [\n      styles.hidden,\n      { transform: [{ translateX: height }, { translateY: progress }] },\n    ],\n    []\n  );\n  const onKeyboardMove = useMemo(\n    () =>\n      Animated.event(\n        [\n          {\n            nativeEvent: {\n              progress,\n              height,\n            },\n          },\n        ],\n        { useNativeDriver: true }\n      ),\n    []\n  );\n  // handlers\n  const updateSharedValues = (event: NativeEvent, platforms: string[]) => {\n    'worklet';\n\n    if (platforms.includes(Platform.OS)) {\n      progressSV.value = event.progress;\n      heightSV.value = -event.height;\n    }\n  };\n  const keyboardHandler = useAnimatedKeyboardHandler(\n    {\n      onKeyboardMoveStart: (event: NativeEvent) => {\n        'worklet';\n\n        broadcastKeyboardEvents('onStart', event);\n        updateSharedValues(event, ['ios']);\n      },\n      onKeyboardMove: (event: NativeEvent) => {\n        'worklet';\n\n        broadcastKeyboardEvents('onMove', event);\n        updateSharedValues(event, ['android']);\n      },\n      onKeyboardMoveEnd: (event: NativeEvent) => {\n        'worklet';\n\n        broadcastKeyboardEvents('onEnd', event);\n      },\n      onKeyboardMoveInteractive: (event: NativeEvent) => {\n        'worklet';\n\n        updateSharedValues(event, ['android', 'ios']);\n        broadcastKeyboardEvents('onInteractive', event);\n      },\n    },\n    []\n  );\n  const inputLayoutHandler = useFocusedInputLayoutHandler(\n    {\n      onFocusedInputLayoutChanged: (e) => {\n        'worklet';\n\n        if (e.target !== -1) {\n          layout.value = e;\n        } else {\n          layout.value = null;\n        }\n      },\n    },\n    []\n  );\n  const inputTextHandler = useFocusedInputTextHandler(\n    {\n      onFocusedInputTextChanged: (e) => {\n        'worklet';\n\n        broadcastInputEvents('onChangeText', e);\n      },\n    },\n    []\n  );\n  // effects\n  useEffect(() => {\n    if (enabled) {\n      applyMonkeyPatch();\n    } else {\n      revertMonkeyPatch();\n    }\n  }, [enabled]);\n\n  return (\n    <KeyboardContext.Provider value={context}>\n      <KeyboardControllerViewAnimated\n        enabled={enabled}\n        onKeyboardMoveReanimated={keyboardHandler}\n        onKeyboardMoveStart={Platform.OS === 'ios' ? onKeyboardMove : undefined}\n        onKeyboardMove={Platform.OS === 'android' ? onKeyboardMove : undefined}\n        onKeyboardMoveInteractive={onKeyboardMove}\n        onFocusedInputLayoutChangedReanimated={inputLayoutHandler}\n        onFocusedInputTextChangedReanimated={inputTextHandler}\n        navigationBarTranslucent={navigationBarTranslucent}\n        statusBarTranslucent={statusBarTranslucent}\n        style={styles.container}\n      >\n        {children}\n      </KeyboardControllerViewAnimated>\n      <Animated.View\n        // we are using this small hack, because if the component (where\n        // animated value has been used) is unmounted, then animation will\n        // stop receiving events (seems like it's react-native optimization).\n        // So we need to keep a reference to the animated value, to keep it's\n        // always mounted (keep a reference to an animated value).\n        //\n        // To test why it's needed, try to open screen which consumes Animated.Value\n        // then close it and open it again (for example 'Animated transition').\n        style={style}\n      />\n    </KeyboardContext.Provider>\n  );\n};\n"],"mappings":"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"}

package/lib/module/bindings.js

@@ -3,6 +3,7 @@ const NOOP = () => {};
 export const KeyboardController = {
   setDefaultMode: NOOP,
   setInputMode: NOOP,
+  dismiss: NOOP,
   addListener: NOOP,
   removeListeners: NOOP
 };

package/lib/module/bindings.js.map

@@ -1 +1 @@
-{"version":3,"names":["View","NOOP","KeyboardController","setDefaultMode","setInputMode","addListener","removeListeners","KeyboardEvents","remove","KeyboardControllerView","KeyboardGestureArea"],"sources":["bindings.ts"],"sourcesContent":["import { View } from 'react-native';\n\nimport type {\n  KeyboardControllerModule,\n  KeyboardControllerProps,\n  KeyboardEventsModule,\n  KeyboardGestureAreaProps,\n} from './types';\nimport type { EmitterSubscription } from 'react-native';\n\nconst NOOP = () => {};\nexport const KeyboardController: KeyboardControllerModule = {\n  setDefaultMode: NOOP,\n  setInputMode: NOOP,\n  addListener: NOOP,\n  removeListeners: NOOP,\n};\nexport const KeyboardEvents: KeyboardEventsModule = {\n  addListener: () => ({ remove: NOOP } as EmitterSubscription),\n};\nexport const KeyboardControllerView =\n  View as unknown as React.FC<KeyboardControllerProps>;\nexport const KeyboardGestureArea =\n  View as unknown as React.FC<KeyboardGestureAreaProps>;\n"],"mappings":"AAAA,SAASA,IAAI,QAAQ,cAAc;AAUnC,MAAMC,IAAI,GAAG,MAAM,CAAC,CAAC;AACrB,OAAO,MAAMC,kBAA4C,GAAG;EAC1DC,cAAc,EAAEF,IAAI;EACpBG,YAAY,EAAEH,IAAI;EAClBI,WAAW,EAAEJ,IAAI;EACjBK,eAAe,EAAEL;AACnB,CAAC;AACD,OAAO,MAAMM,cAAoC,GAAG;EAClDF,WAAW,EAAE,OAAO;IAAEG,MAAM,EAAEP;EAAK,CAAC;AACtC,CAAC;AACD,OAAO,MAAMQ,sBAAsB,GACjCT,IAAoD;AACtD,OAAO,MAAMU,mBAAmB,GAC9BV,IAAqD"}
+{"version":3,"names":["View","NOOP","KeyboardController","setDefaultMode","setInputMode","dismiss","addListener","removeListeners","KeyboardEvents","remove","KeyboardControllerView","KeyboardGestureArea"],"sources":["bindings.ts"],"sourcesContent":["import { View } from 'react-native';\n\nimport type {\n  KeyboardControllerModule,\n  KeyboardControllerProps,\n  KeyboardEventsModule,\n  KeyboardGestureAreaProps,\n} from './types';\nimport type { EmitterSubscription } from 'react-native';\n\nconst NOOP = () => {};\nexport const KeyboardController: KeyboardControllerModule = {\n  setDefaultMode: NOOP,\n  setInputMode: NOOP,\n  dismiss: NOOP,\n  addListener: NOOP,\n  removeListeners: NOOP,\n};\nexport const KeyboardEvents: KeyboardEventsModule = {\n  addListener: () => ({ remove: NOOP } as EmitterSubscription),\n};\nexport const KeyboardControllerView =\n  View as unknown as React.FC<KeyboardControllerProps>;\nexport const KeyboardGestureArea =\n  View as unknown as React.FC<KeyboardGestureAreaProps>;\n"],"mappings":"AAAA,SAASA,IAAI,QAAQ,cAAc;AAUnC,MAAMC,IAAI,GAAG,MAAM,CAAC,CAAC;AACrB,OAAO,MAAMC,kBAA4C,GAAG;EAC1DC,cAAc,EAAEF,IAAI;EACpBG,YAAY,EAAEH,IAAI;EAClBI,OAAO,EAAEJ,IAAI;EACbK,WAAW,EAAEL,IAAI;EACjBM,eAAe,EAAEN;AACnB,CAAC;AACD,OAAO,MAAMO,cAAoC,GAAG;EAClDF,WAAW,EAAE,OAAO;IAAEG,MAAM,EAAER;EAAK,CAAC;AACtC,CAAC;AACD,OAAO,MAAMS,sBAAsB,GACjCV,IAAoD;AACtD,OAAO,MAAMW,mBAAmB,GAC9BX,IAAqD"}

package/lib/module/components/KeyboardAvoidingView/index.js

@@ -1,7 +1,7 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { forwardRef, useCallback, useMemo } from 'react';
 import { View, useWindowDimensions } from 'react-native';
-import Reanimated, { interpolate, runOnUI, useAnimatedStyle, useDerivedValue, useSharedValue, useWorkletCallback } from 'react-native-reanimated';
+import Reanimated, { interpolate, runOnUI, useAnimatedStyle, useDerivedValue, useSharedValue } from 'react-native-reanimated';
 import { useKeyboardAnimation } from './hooks';
 const defaultLayout = {
   x: 0,
@@ -31,15 +31,19 @@ const KeyboardAvoidingView = /*#__PURE__*/forwardRef((_ref, ref) => {
   const {
     height: screenHeight
   } = useWindowDimensions();
-  const relativeKeyboardHeight = useWorkletCallback(() => {
+  const relativeKeyboardHeight = useCallback(() => {
+    'worklet';
+
     const keyboardY = screenHeight - keyboard.heightWhenOpened.value - keyboardVerticalOffset;
     return Math.max(frame.value.y + frame.value.height - keyboardY, 0);
   }, [screenHeight, keyboardVerticalOffset]);
-  const onLayoutWorklet = useWorkletCallback(layout => {
+  const onLayoutWorklet = useCallback(layout => {
+    'worklet';
+
     if (keyboard.isClosed.value) {
       initialFrame.value = layout;
     }
-  });
+  }, []);
   const onLayout = useCallback(e => {
     runOnUI(onLayoutWorklet)(e.nativeEvent.layout);
     onLayoutProps === null || onLayoutProps === void 0 ? void 0 : onLayoutProps(e);
@@ -81,7 +85,6 @@ const KeyboardAvoidingView = /*#__PURE__*/forwardRef((_ref, ref) => {
     }, children));
   }
   return /*#__PURE__*/React.createElement(Reanimated.View, _extends({
-    // @ts-expect-error because `ref` from reanimated is not compatible with react-native
     ref: ref,
     onLayout: onLayout,
     style: combinedStyles

package/lib/module/components/KeyboardAvoidingView/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","forwardRef","useCallback","useMemo","View","useWindowDimensions","Reanimated","interpolate","runOnUI","useAnimatedStyle","useDerivedValue","useSharedValue","useWorkletCallback","useKeyboardAnimation","defaultLayout","x","y","width","height","KeyboardAvoidingView","ref","behavior","children","contentContainerStyle","enabled","keyboardVerticalOffset","style","onLayout","onLayoutProps","props","initialFrame","frame","value","keyboard","screenHeight","relativeKeyboardHeight","keyboardY","heightWhenOpened","Math","max","onLayoutWorklet","layout","isClosed","e","nativeEvent","animatedStyle","bottom","progress","bottomHeight","flex","paddingBottom","isPositionBehavior","containerStyle","combinedStyles"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from 'react';\nimport { View, useWindowDimensions } from 'react-native';\nimport Reanimated, {\n  interpolate,\n  runOnUI,\n  useAnimatedStyle,\n  useDerivedValue,\n  useSharedValue,\n  useWorkletCallback,\n} from 'react-native-reanimated';\n\nimport { useKeyboardAnimation } from './hooks';\n\nimport type { LayoutRectangle, ViewProps } from 'react-native';\n\ntype Props = {\n  /**\n   * Specify how to react to the presence of the keyboard.\n   */\n  behavior?: 'height' | 'position' | 'padding';\n\n  /**\n   * Style of the content container when `behavior` is 'position'.\n   */\n  contentContainerStyle?: ViewProps['style'];\n\n  /**\n   * Controls whether this `KeyboardAvoidingView` instance should take effect.\n   * This is useful when more than one is on the screen. Defaults to true.\n   */\n  enabled?: boolean;\n\n  /**\n   * Distance between the top of the user screen and the React Native view. This\n   * may be non-zero in some cases. Defaults to 0.\n   */\n  keyboardVerticalOffset?: number;\n} & ViewProps;\n\nconst defaultLayout: LayoutRectangle = {\n  x: 0,\n  y: 0,\n  width: 0,\n  height: 0,\n};\n\n/**\n * View that moves out of the way when the keyboard appears by automatically\n * adjusting its height, position, or bottom padding.\n */\nconst KeyboardAvoidingView = forwardRef<View, React.PropsWithChildren<Props>>(\n  (\n    {\n      behavior,\n      children,\n      contentContainerStyle,\n      enabled = true,\n      keyboardVerticalOffset = 0,\n      style,\n      onLayout: onLayoutProps,\n      ...props\n    },\n    ref\n  ) => {\n    const initialFrame = useSharedValue<LayoutRectangle | null>(null);\n    const frame = useDerivedValue(() => initialFrame.value || defaultLayout);\n\n    const keyboard = useKeyboardAnimation();\n    const { height: screenHeight } = useWindowDimensions();\n\n    const relativeKeyboardHeight = useWorkletCallback(() => {\n      const keyboardY =\n        screenHeight - keyboard.heightWhenOpened.value - keyboardVerticalOffset;\n\n      return Math.max(frame.value.y + frame.value.height - keyboardY, 0);\n    }, [screenHeight, keyboardVerticalOffset]);\n\n    const onLayoutWorklet = useWorkletCallback((layout: LayoutRectangle) => {\n      if (keyboard.isClosed.value) {\n        initialFrame.value = layout;\n      }\n    });\n    const onLayout = useCallback<NonNullable<ViewProps['onLayout']>>(\n      (e) => {\n        runOnUI(onLayoutWorklet)(e.nativeEvent.layout);\n        onLayoutProps?.(e);\n      },\n      [onLayoutProps]\n    );\n\n    const animatedStyle = useAnimatedStyle(() => {\n      const bottom = interpolate(\n        keyboard.progress.value,\n        [0, 1],\n        [0, relativeKeyboardHeight()]\n      );\n      const bottomHeight = enabled ? bottom : 0;\n\n      switch (behavior) {\n        case 'height':\n          if (!keyboard.isClosed.value) {\n            return {\n              height: frame.value.height - bottomHeight,\n              flex: 0,\n            };\n          }\n\n          return {};\n\n        case 'position':\n          return { bottom: bottomHeight };\n\n        case 'padding':\n          return { paddingBottom: bottomHeight };\n\n        default:\n          return {};\n      }\n    }, [behavior, enabled, relativeKeyboardHeight]);\n    const isPositionBehavior = behavior === 'position';\n    const containerStyle = isPositionBehavior ? contentContainerStyle : style;\n    const combinedStyles = useMemo(\n      () => [containerStyle, animatedStyle],\n      [containerStyle, animatedStyle]\n    );\n\n    if (isPositionBehavior) {\n      return (\n        <View ref={ref} style={style} onLayout={onLayout} {...props}>\n          <Reanimated.View style={combinedStyles}>{children}</Reanimated.View>\n        </View>\n      );\n    }\n\n    return (\n      <Reanimated.View\n        // @ts-expect-error because `ref` from reanimated is not compatible with react-native\n        ref={ref}\n        onLayout={onLayout}\n        style={combinedStyles}\n        {...props}\n      >\n        {children}\n      </Reanimated.View>\n    );\n  }\n);\n\nexport default KeyboardAvoidingView;\n"],"mappings":"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"}
+{"version":3,"names":["React","forwardRef","useCallback","useMemo","View","useWindowDimensions","Reanimated","interpolate","runOnUI","useAnimatedStyle","useDerivedValue","useSharedValue","useKeyboardAnimation","defaultLayout","x","y","width","height","KeyboardAvoidingView","ref","behavior","children","contentContainerStyle","enabled","keyboardVerticalOffset","style","onLayout","onLayoutProps","props","initialFrame","frame","value","keyboard","screenHeight","relativeKeyboardHeight","keyboardY","heightWhenOpened","Math","max","onLayoutWorklet","layout","isClosed","e","nativeEvent","animatedStyle","bottom","progress","bottomHeight","flex","paddingBottom","isPositionBehavior","containerStyle","combinedStyles"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from 'react';\nimport { View, useWindowDimensions } from 'react-native';\nimport Reanimated, {\n  interpolate,\n  runOnUI,\n  useAnimatedStyle,\n  useDerivedValue,\n  useSharedValue,\n} from 'react-native-reanimated';\n\nimport { useKeyboardAnimation } from './hooks';\n\nimport type { LayoutRectangle, ViewProps } from 'react-native';\n\ntype Props = {\n  /**\n   * Specify how to react to the presence of the keyboard.\n   */\n  behavior?: 'height' | 'position' | 'padding';\n\n  /**\n   * Style of the content container when `behavior` is 'position'.\n   */\n  contentContainerStyle?: ViewProps['style'];\n\n  /**\n   * Controls whether this `KeyboardAvoidingView` instance should take effect.\n   * This is useful when more than one is on the screen. Defaults to true.\n   */\n  enabled?: boolean;\n\n  /**\n   * Distance between the top of the user screen and the React Native view. This\n   * may be non-zero in some cases. Defaults to 0.\n   */\n  keyboardVerticalOffset?: number;\n} & ViewProps;\n\nconst defaultLayout: LayoutRectangle = {\n  x: 0,\n  y: 0,\n  width: 0,\n  height: 0,\n};\n\n/**\n * View that moves out of the way when the keyboard appears by automatically\n * adjusting its height, position, or bottom padding.\n */\nconst KeyboardAvoidingView = forwardRef<View, React.PropsWithChildren<Props>>(\n  (\n    {\n      behavior,\n      children,\n      contentContainerStyle,\n      enabled = true,\n      keyboardVerticalOffset = 0,\n      style,\n      onLayout: onLayoutProps,\n      ...props\n    },\n    ref\n  ) => {\n    const initialFrame = useSharedValue<LayoutRectangle | null>(null);\n    const frame = useDerivedValue(() => initialFrame.value || defaultLayout);\n\n    const keyboard = useKeyboardAnimation();\n    const { height: screenHeight } = useWindowDimensions();\n\n    const relativeKeyboardHeight = useCallback(() => {\n      'worklet';\n\n      const keyboardY =\n        screenHeight - keyboard.heightWhenOpened.value - keyboardVerticalOffset;\n\n      return Math.max(frame.value.y + frame.value.height - keyboardY, 0);\n    }, [screenHeight, keyboardVerticalOffset]);\n\n    const onLayoutWorklet = useCallback((layout: LayoutRectangle) => {\n      'worklet';\n\n      if (keyboard.isClosed.value) {\n        initialFrame.value = layout;\n      }\n    }, []);\n    const onLayout = useCallback<NonNullable<ViewProps['onLayout']>>(\n      (e) => {\n        runOnUI(onLayoutWorklet)(e.nativeEvent.layout);\n        onLayoutProps?.(e);\n      },\n      [onLayoutProps]\n    );\n\n    const animatedStyle = useAnimatedStyle(() => {\n      const bottom = interpolate(\n        keyboard.progress.value,\n        [0, 1],\n        [0, relativeKeyboardHeight()]\n      );\n      const bottomHeight = enabled ? bottom : 0;\n\n      switch (behavior) {\n        case 'height':\n          if (!keyboard.isClosed.value) {\n            return {\n              height: frame.value.height - bottomHeight,\n              flex: 0,\n            };\n          }\n\n          return {};\n\n        case 'position':\n          return { bottom: bottomHeight };\n\n        case 'padding':\n          return { paddingBottom: bottomHeight };\n\n        default:\n          return {};\n      }\n    }, [behavior, enabled, relativeKeyboardHeight]);\n    const isPositionBehavior = behavior === 'position';\n    const containerStyle = isPositionBehavior ? contentContainerStyle : style;\n    const combinedStyles = useMemo(\n      () => [containerStyle, animatedStyle],\n      [containerStyle, animatedStyle]\n    );\n\n    if (isPositionBehavior) {\n      return (\n        <View ref={ref} style={style} onLayout={onLayout} {...props}>\n          <Reanimated.View style={combinedStyles}>{children}</Reanimated.View>\n        </View>\n      );\n    }\n\n    return (\n      <Reanimated.View\n        ref={ref}\n        onLayout={onLayout}\n        style={combinedStyles}\n        {...props}\n      >\n        {children}\n      </Reanimated.View>\n    );\n  }\n);\n\nexport default KeyboardAvoidingView;\n"],"mappings":"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"}

package/lib/module/components/KeyboardAwareScrollView/index.js

@@ -0,0 +1,190 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import React, { useCallback, useMemo } from 'react';
+import { useWindowDimensions } from 'react-native';
+import Reanimated, { interpolate, scrollTo, useAnimatedReaction, useAnimatedRef, useAnimatedScrollHandler, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';
+import { useFocusedInputHandler, useReanimatedFocusedInput } from 'react-native-keyboard-controller';
+import { useSmoothKeyboardHandler } from './useSmoothKeyboardHandler';
+import { debounce } from './utils';
+/**
+ * Everything begins from `onStart` handler. This handler is called every time,
+ * when keyboard changes its size or when focused `TextInput` was changed. In
+ * this handler we are calculating/memoizing values which later will be used
+ * during layout movement. For that we calculate:
+ * - layout of focused field (`layout`) - to understand whether there will be overlap
+ * - initial keyboard size (`initialKeyboardSize`) - used in scroll interpolation
+ * - future keyboard height (`keyboardHeight`) - used in scroll interpolation
+ * - current scroll position (`scrollPosition`) - used to scroll from this point
+ *
+ * Once we've calculated all necessary variables - we can actually start to use them.
+ * It happens in `onMove` handler - this function simply calls `maybeScroll` with
+ * current keyboard frame height. This functions makes the smooth transition.
+ *
+ * When the transition has finished we go to `onEnd` handler. In this handler
+ * we verify, that the current field is not overlapped within a keyboard frame.
+ * For full `onStart`/`onMove`/`onEnd` flow it may look like a redundant thing,
+ * however there could be some cases, when `onMove` is not called:
+ * - on iOS when TextInput was changed - keyboard transition is instant
+ * - on Android when TextInput was changed and keyboard size wasn't changed
+ * So `onEnd` handler handle the case, when `onMove` wasn't triggered.
+ *
+ * ====================================================================================================================+
+ * -----------------------------------------------------Flow chart-----------------------------------------------------+
+ * ====================================================================================================================+
+ *
+ * +============================+       +============================+        +==================================+
+ * +  User Press on TextInput   +   =>  +  Keyboard starts showing   +   =>   + As keyboard moves frame by frame +  =>
+ * +                            +       +       (run `onStart`)      +        +    `onMove` is getting called    +
+ * +============================+       +============================+        +==================================+
+ *
+ *
+ * +============================+       +============================+        +=====================================+
+ * + Keyboard is shown and we   +   =>  +    User moved focus to     +   =>   + Only `onStart`/`onEnd` maybe called +
+ * +    call `onEnd` handler    +       +     another `TextInput`    +        +    (without involving `onMove`)     +
+ * +============================+       +============================+        +=====================================+
+ *
+ */
+const KeyboardAwareScrollView = _ref => {
+  let {
+    children,
+    bottomOffset = 0,
+    ...rest
+  } = _ref;
+  const scrollViewAnimatedRef = useAnimatedRef();
+  const scrollPosition = useSharedValue(0);
+  const position = useSharedValue(0);
+  const keyboardHeight = useSharedValue(0);
+  const tag = useSharedValue(-1);
+  const initialKeyboardSize = useSharedValue(0);
+  const scrollBeforeKeyboardMovement = useSharedValue(0);
+  const {
+    input
+  } = useReanimatedFocusedInput();
+  const layout = useSharedValue(null);
+  const {
+    height
+  } = useWindowDimensions();
+  const onScroll = useAnimatedScrollHandler({
+    onScroll: e => {
+      position.value = e.contentOffset.y;
+    }
+  }, []);
+
+  /**
+   * Function that will scroll a ScrollView as keyboard gets moving
+   */
+  const maybeScroll = useCallback(function (e) {
+    'worklet';
+
+    var _layout$value, _layout$value2;
+    let animated = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    const visibleRect = height - keyboardHeight.value;
+    const absoluteY = ((_layout$value = layout.value) === null || _layout$value === void 0 ? void 0 : _layout$value.layout.absoluteY) || 0;
+    const inputHeight = ((_layout$value2 = layout.value) === null || _layout$value2 === void 0 ? void 0 : _layout$value2.layout.height) || 0;
+    const point = absoluteY + inputHeight;
+    if (visibleRect - point <= bottomOffset) {
+      const interpolatedScrollTo = interpolate(e, [initialKeyboardSize.value, keyboardHeight.value], [0, keyboardHeight.value - (height - point) + bottomOffset]);
+      const targetScrollY = Math.max(interpolatedScrollTo, 0) + scrollPosition.value;
+      scrollTo(scrollViewAnimatedRef, 0, targetScrollY, animated);
+      return interpolatedScrollTo;
+    }
+    if (absoluteY < 0) {
+      const positionOnScreen = visibleRect - inputHeight - bottomOffset;
+      const topOfScreen = scrollPosition.value + absoluteY;
+      scrollTo(scrollViewAnimatedRef, 0, topOfScreen - positionOnScreen, animated);
+    }
+    return 0;
+  }, [bottomOffset]);
+  const onChangeText = useCallback(() => {
+    'worklet';
+
+    // if typing a text caused layout shift, then we need to ignore this handler
+    // because this event will be handled in `useAnimatedReaction` below
+    var _layout$value3, _input$value;
+    if (((_layout$value3 = layout.value) === null || _layout$value3 === void 0 ? void 0 : _layout$value3.layout.height) !== ((_input$value = input.value) === null || _input$value === void 0 ? void 0 : _input$value.layout.height)) {
+      return;
+    }
+    const prevScrollPosition = scrollPosition.value;
+    const prevLayout = layout.value;
+    scrollPosition.value = position.value;
+    layout.value = input.value;
+    maybeScroll(keyboardHeight.value, true);
+    scrollPosition.value = prevScrollPosition;
+    layout.value = prevLayout;
+  }, [maybeScroll]);
+  const onChangeTextHandler = useMemo(() => debounce(onChangeText, 200), [onChangeText]);
+  useFocusedInputHandler({
+    onChangeText: onChangeTextHandler
+  }, [onChangeTextHandler]);
+  useSmoothKeyboardHandler({
+    onStart: e => {
+      'worklet';
+
+      const keyboardWillChangeSize = keyboardHeight.value !== e.height && e.height > 0;
+      const keyboardWillAppear = e.height > 0 && keyboardHeight.value === 0;
+      const keyboardWillHide = e.height === 0;
+      const focusWasChanged = tag.value !== e.target && e.target !== -1 || keyboardWillChangeSize;
+      if (keyboardWillChangeSize) {
+        initialKeyboardSize.value = keyboardHeight.value;
+      }
+      if (keyboardWillHide) {
+        // on back transition need to interpolate as [0, keyboardHeight]
+        initialKeyboardSize.value = 0;
+        scrollPosition.value = scrollBeforeKeyboardMovement.value;
+      }
+      if (keyboardWillAppear || keyboardWillChangeSize || focusWasChanged) {
+        // persist scroll value
+        scrollPosition.value = position.value;
+        // just persist height - later will be used in interpolation
+        keyboardHeight.value = e.height;
+      }
+
+      // focus was changed
+      if (focusWasChanged) {
+        tag.value = e.target;
+
+        // save position of focused text input when keyboard starts to move
+        layout.value = input.value;
+        // save current scroll position - when keyboard will hide we'll reuse
+        // this value to achieve smooth hide effect
+        scrollBeforeKeyboardMovement.value = position.value;
+      }
+      if (focusWasChanged && !keyboardWillAppear) {
+        // update position on scroll value, so `onEnd` handler
+        // will pick up correct values
+        position.value += maybeScroll(e.height, true);
+      }
+    },
+    onMove: e => {
+      'worklet';
+
+      maybeScroll(e.height);
+    },
+    onEnd: e => {
+      'worklet';
+
+      keyboardHeight.value = e.height;
+      scrollPosition.value = position.value;
+    }
+  }, [height, maybeScroll]);
+  useAnimatedReaction(() => input.value, (current, previous) => {
+    if ((current === null || current === void 0 ? void 0 : current.target) === (previous === null || previous === void 0 ? void 0 : previous.target) && (current === null || current === void 0 ? void 0 : current.layout.height) !== (previous === null || previous === void 0 ? void 0 : previous.layout.height)) {
+      const prevLayout = layout.value;
+      layout.value = input.value;
+      scrollPosition.value += maybeScroll(keyboardHeight.value, true);
+      layout.value = prevLayout;
+    }
+  }, []);
+  const view = useAnimatedStyle(() => ({
+    paddingBottom: keyboardHeight.value
+  }), []);
+  return /*#__PURE__*/React.createElement(Reanimated.ScrollView, _extends({
+    ref: scrollViewAnimatedRef
+  }, rest, {
+    onScroll: onScroll,
+    scrollEventThrottle: 16
+  }), /*#__PURE__*/React.createElement(Reanimated.View, {
+    style: view
+  }, children));
+};
+export default KeyboardAwareScrollView;
+//# sourceMappingURL=index.js.map

package/lib/module/components/KeyboardAwareScrollView/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useMemo","useWindowDimensions","Reanimated","interpolate","scrollTo","useAnimatedReaction","useAnimatedRef","useAnimatedScrollHandler","useAnimatedStyle","useSharedValue","useFocusedInputHandler","useReanimatedFocusedInput","useSmoothKeyboardHandler","debounce","KeyboardAwareScrollView","children","bottomOffset","rest","scrollViewAnimatedRef","scrollPosition","position","keyboardHeight","tag","initialKeyboardSize","scrollBeforeKeyboardMovement","input","layout","height","onScroll","e","value","contentOffset","y","maybeScroll","animated","visibleRect","absoluteY","inputHeight","point","interpolatedScrollTo","targetScrollY","Math","max","positionOnScreen","topOfScreen","onChangeText","prevScrollPosition","prevLayout","onChangeTextHandler","onStart","keyboardWillChangeSize","keyboardWillAppear","keyboardWillHide","focusWasChanged","target","onMove","onEnd","current","previous","view","paddingBottom"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { useWindowDimensions } from 'react-native';\nimport Reanimated, {\n  interpolate,\n  scrollTo,\n  useAnimatedReaction,\n  useAnimatedRef,\n  useAnimatedScrollHandler,\n  useAnimatedStyle,\n  useSharedValue,\n} from 'react-native-reanimated';\n\nimport {\n  useFocusedInputHandler,\n  useReanimatedFocusedInput,\n} from 'react-native-keyboard-controller';\n\nimport { useSmoothKeyboardHandler } from './useSmoothKeyboardHandler';\nimport { debounce } from './utils';\n\nimport type { FC } from 'react';\nimport type { ScrollViewProps } from 'react-native';\nimport type { FocusedInputLayoutChangedEvent } from 'react-native-keyboard-controller';\n\ntype KeyboardAwareScrollViewProps = {\n  bottomOffset?: number;\n} & ScrollViewProps;\n\n/**\n * Everything begins from `onStart` handler. This handler is called every time,\n * when keyboard changes its size or when focused `TextInput` was changed. In\n * this handler we are calculating/memoizing values which later will be used\n * during layout movement. For that we calculate:\n * - layout of focused field (`layout`) - to understand whether there will be overlap\n * - initial keyboard size (`initialKeyboardSize`) - used in scroll interpolation\n * - future keyboard height (`keyboardHeight`) - used in scroll interpolation\n * - current scroll position (`scrollPosition`) - used to scroll from this point\n *\n * Once we've calculated all necessary variables - we can actually start to use them.\n * It happens in `onMove` handler - this function simply calls `maybeScroll` with\n * current keyboard frame height. This functions makes the smooth transition.\n *\n * When the transition has finished we go to `onEnd` handler. In this handler\n * we verify, that the current field is not overlapped within a keyboard frame.\n * For full `onStart`/`onMove`/`onEnd` flow it may look like a redundant thing,\n * however there could be some cases, when `onMove` is not called:\n * - on iOS when TextInput was changed - keyboard transition is instant\n * - on Android when TextInput was changed and keyboard size wasn't changed\n * So `onEnd` handler handle the case, when `onMove` wasn't triggered.\n *\n * ====================================================================================================================+\n * -----------------------------------------------------Flow chart-----------------------------------------------------+\n * ====================================================================================================================+\n *\n * +============================+       +============================+        +==================================+\n * +  User Press on TextInput   +   =>  +  Keyboard starts showing   +   =>   + As keyboard moves frame by frame +  =>\n * +                            +       +       (run `onStart`)      +        +    `onMove` is getting called    +\n * +============================+       +============================+        +==================================+\n *\n *\n * +============================+       +============================+        +=====================================+\n * + Keyboard is shown and we   +   =>  +    User moved focus to     +   =>   + Only `onStart`/`onEnd` maybe called +\n * +    call `onEnd` handler    +       +     another `TextInput`    +        +    (without involving `onMove`)     +\n * +============================+       +============================+        +=====================================+\n *\n */\nconst KeyboardAwareScrollView: FC<KeyboardAwareScrollViewProps> = ({\n  children,\n  bottomOffset = 0,\n  ...rest\n}) => {\n  const scrollViewAnimatedRef = useAnimatedRef<Reanimated.ScrollView>();\n  const scrollPosition = useSharedValue(0);\n  const position = useSharedValue(0);\n  const keyboardHeight = useSharedValue(0);\n  const tag = useSharedValue(-1);\n  const initialKeyboardSize = useSharedValue(0);\n  const scrollBeforeKeyboardMovement = useSharedValue(0);\n  const { input } = useReanimatedFocusedInput();\n  const layout = useSharedValue<FocusedInputLayoutChangedEvent | null>(null);\n\n  const { height } = useWindowDimensions();\n\n  const onScroll = useAnimatedScrollHandler(\n    {\n      onScroll: (e) => {\n        position.value = e.contentOffset.y;\n      },\n    },\n    []\n  );\n\n  /**\n   * Function that will scroll a ScrollView as keyboard gets moving\n   */\n  const maybeScroll = useCallback(\n    (e: number, animated: boolean = false) => {\n      'worklet';\n\n      const visibleRect = height - keyboardHeight.value;\n      const absoluteY = layout.value?.layout.absoluteY || 0;\n      const inputHeight = layout.value?.layout.height || 0;\n      const point = absoluteY + inputHeight;\n\n      if (visibleRect - point <= bottomOffset) {\n        const interpolatedScrollTo = interpolate(\n          e,\n          [initialKeyboardSize.value, keyboardHeight.value],\n          [0, keyboardHeight.value - (height - point) + bottomOffset]\n        );\n        const targetScrollY =\n          Math.max(interpolatedScrollTo, 0) + scrollPosition.value;\n        scrollTo(scrollViewAnimatedRef, 0, targetScrollY, animated);\n\n        return interpolatedScrollTo;\n      }\n\n      if (absoluteY < 0) {\n        const positionOnScreen = visibleRect - inputHeight - bottomOffset;\n        const topOfScreen = scrollPosition.value + absoluteY;\n\n        scrollTo(\n          scrollViewAnimatedRef,\n          0,\n          topOfScreen - positionOnScreen,\n          animated\n        );\n      }\n\n      return 0;\n    },\n    [bottomOffset]\n  );\n\n  const onChangeText = useCallback(() => {\n    'worklet';\n\n    // if typing a text caused layout shift, then we need to ignore this handler\n    // because this event will be handled in `useAnimatedReaction` below\n    if (layout.value?.layout.height !== input.value?.layout.height) {\n      return;\n    }\n\n    const prevScrollPosition = scrollPosition.value;\n    const prevLayout = layout.value;\n\n    scrollPosition.value = position.value;\n    layout.value = input.value;\n    maybeScroll(keyboardHeight.value, true);\n    scrollPosition.value = prevScrollPosition;\n    layout.value = prevLayout;\n  }, [maybeScroll]);\n  const onChangeTextHandler = useMemo(\n    () => debounce(onChangeText, 200),\n    [onChangeText]\n  );\n\n  useFocusedInputHandler(\n    {\n      onChangeText: onChangeTextHandler,\n    },\n    [onChangeTextHandler]\n  );\n\n  useSmoothKeyboardHandler(\n    {\n      onStart: (e) => {\n        'worklet';\n\n        const keyboardWillChangeSize =\n          keyboardHeight.value !== e.height && e.height > 0;\n        const keyboardWillAppear = e.height > 0 && keyboardHeight.value === 0;\n        const keyboardWillHide = e.height === 0;\n        const focusWasChanged =\n          (tag.value !== e.target && e.target !== -1) || keyboardWillChangeSize;\n\n        if (keyboardWillChangeSize) {\n          initialKeyboardSize.value = keyboardHeight.value;\n        }\n\n        if (keyboardWillHide) {\n          // on back transition need to interpolate as [0, keyboardHeight]\n          initialKeyboardSize.value = 0;\n          scrollPosition.value = scrollBeforeKeyboardMovement.value;\n        }\n\n        if (keyboardWillAppear || keyboardWillChangeSize || focusWasChanged) {\n          // persist scroll value\n          scrollPosition.value = position.value;\n          // just persist height - later will be used in interpolation\n          keyboardHeight.value = e.height;\n        }\n\n        // focus was changed\n        if (focusWasChanged) {\n          tag.value = e.target;\n\n          // save position of focused text input when keyboard starts to move\n          layout.value = input.value;\n          // save current scroll position - when keyboard will hide we'll reuse\n          // this value to achieve smooth hide effect\n          scrollBeforeKeyboardMovement.value = position.value;\n        }\n\n        if (focusWasChanged && !keyboardWillAppear) {\n          // update position on scroll value, so `onEnd` handler\n          // will pick up correct values\n          position.value += maybeScroll(e.height, true);\n        }\n      },\n      onMove: (e) => {\n        'worklet';\n\n        maybeScroll(e.height);\n      },\n      onEnd: (e) => {\n        'worklet';\n\n        keyboardHeight.value = e.height;\n        scrollPosition.value = position.value;\n      },\n    },\n    [height, maybeScroll]\n  );\n\n  useAnimatedReaction(\n    () => input.value,\n    (current, previous) => {\n      if (\n        current?.target === previous?.target &&\n        current?.layout.height !== previous?.layout.height\n      ) {\n        const prevLayout = layout.value;\n\n        layout.value = input.value;\n        scrollPosition.value += maybeScroll(keyboardHeight.value, true);\n        layout.value = prevLayout;\n      }\n    },\n    []\n  );\n\n  const view = useAnimatedStyle(\n    () => ({\n      paddingBottom: keyboardHeight.value,\n    }),\n    []\n  );\n\n  return (\n    <Reanimated.ScrollView\n      ref={scrollViewAnimatedRef}\n      {...rest}\n      onScroll={onScroll}\n      scrollEventThrottle={16}\n    >\n      <Reanimated.View style={view}>{children}</Reanimated.View>\n    </Reanimated.ScrollView>\n  );\n};\n\nexport default KeyboardAwareScrollView;\n"],"mappings":"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"}

package/lib/module/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.js

@@ -0,0 +1,93 @@
+import { Platform } from 'react-native';
+import { Easing, useAnimatedReaction, useSharedValue, withTiming } from 'react-native-reanimated';
+import { useKeyboardHandler } from 'react-native-keyboard-controller';
+const IS_ANDROID_ELEVEN_OR_HIGHER = Platform.OS === 'android' && Platform.Version >= 30;
+// on these platforms keyboard transitions will be smooth
+const IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS = IS_ANDROID_ELEVEN_OR_HIGHER || Platform.OS === 'ios';
+// on Android Telegram is not using androidx.core values and uses custom interpolation
+// duration is taken from here: https://github.com/DrKLO/Telegram/blob/e9a35cea54c06277c69d41b8e25d94b5d7ede065/TMessagesProj/src/main/java/org/telegram/ui/ActionBar/AdjustPanLayoutHelper.java#L39
+// and bezier is taken from: https://github.com/DrKLO/Telegram/blob/e9a35cea54c06277c69d41b8e25d94b5d7ede065/TMessagesProj/src/main/java/androidx/recyclerview/widget/ChatListItemAnimator.java#L40
+const TELEGRAM_ANDROID_TIMING_CONFIG = {
+  duration: 250,
+  easing: Easing.bezier(0.19919472913616398, 0.010644531250000006, 0.27920937042459737, 0.91025390625)
+};
+
+/**
+ * Hook that uses default transitions for iOS and Android > 11, and uses
+ * custom interpolation on Android < 11 to achieve more smooth animation
+ */
+export const useSmoothKeyboardHandler = (handler, deps) => {
+  const target = useSharedValue(-1);
+  const persistedHeight = useSharedValue(0);
+  const animatedKeyboardHeight = useSharedValue(0);
+  useAnimatedReaction(() => {
+    if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {
+      return;
+    }
+    const event = {
+      // it'll be always 250, since we're running animation via `withTiming` where
+      // duration in config (TELEGRAM_ANDROID_TIMING_CONFIG.duration) = 250ms
+      duration: 250,
+      target: target.value,
+      height: animatedKeyboardHeight.value,
+      progress: animatedKeyboardHeight.value / persistedHeight.value
+    };
+    return event;
+  }, evt => {
+    var _handler$onMove;
+    if (!evt) {
+      return;
+    }
+    (_handler$onMove = handler.onMove) === null || _handler$onMove === void 0 ? void 0 : _handler$onMove.call(handler, evt);
+
+    // dispatch `onEnd`
+    if (evt.height === persistedHeight.value) {
+      var _handler$onEnd;
+      (_handler$onEnd = handler.onEnd) === null || _handler$onEnd === void 0 ? void 0 : _handler$onEnd.call(handler, evt);
+    }
+  }, [handler]);
+  useKeyboardHandler({
+    onStart: e => {
+      'worklet';
+
+      // immediately dispatch onStart/onEnd events if onStart dispatched with the same height
+      // and don't wait for animation 250ms
+      var _handler$onStart2;
+      if (!IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS && e.height === persistedHeight.value) {
+        var _handler$onStart, _handler$onEnd2;
+        (_handler$onStart = handler.onStart) === null || _handler$onStart === void 0 ? void 0 : _handler$onStart.call(handler, e);
+        (_handler$onEnd2 = handler.onEnd) === null || _handler$onEnd2 === void 0 ? void 0 : _handler$onEnd2.call(handler, e);
+        return;
+      }
+      target.value = e.target;
+      if (e.height > 0) {
+        persistedHeight.value = e.height;
+      }
+      // if we are running on Android < 9, then we are using custom interpolation
+      // to achieve smoother animation and use `animatedKeyboardHeight` as animation
+      // driver
+      if (!IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {
+        animatedKeyboardHeight.value = withTiming(e.height, TELEGRAM_ANDROID_TIMING_CONFIG);
+      }
+      (_handler$onStart2 = handler.onStart) === null || _handler$onStart2 === void 0 ? void 0 : _handler$onStart2.call(handler, e);
+    },
+    onMove: e => {
+      'worklet';
+
+      if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {
+        var _handler$onMove2;
+        (_handler$onMove2 = handler.onMove) === null || _handler$onMove2 === void 0 ? void 0 : _handler$onMove2.call(handler, e);
+      }
+    },
+    onEnd: e => {
+      'worklet';
+
+      if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {
+        var _handler$onEnd3;
+        (_handler$onEnd3 = handler.onEnd) === null || _handler$onEnd3 === void 0 ? void 0 : _handler$onEnd3.call(handler, e);
+      }
+      persistedHeight.value = e.height;
+    }
+  }, deps);
+};
+//# sourceMappingURL=useSmoothKeyboardHandler.js.map

package/lib/module/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Platform","Easing","useAnimatedReaction","useSharedValue","withTiming","useKeyboardHandler","IS_ANDROID_ELEVEN_OR_HIGHER","OS","Version","IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS","TELEGRAM_ANDROID_TIMING_CONFIG","duration","easing","bezier","useSmoothKeyboardHandler","handler","deps","target","persistedHeight","animatedKeyboardHeight","event","value","height","progress","evt","onMove","onEnd","onStart","e"],"sources":["useSmoothKeyboardHandler.ts"],"sourcesContent":["import { Platform } from 'react-native';\nimport {\n  Easing,\n  useAnimatedReaction,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { useKeyboardHandler } from 'react-native-keyboard-controller';\n\nconst IS_ANDROID_ELEVEN_OR_HIGHER =\n  Platform.OS === 'android' && Platform.Version >= 30;\n// on these platforms keyboard transitions will be smooth\nconst IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS =\n  IS_ANDROID_ELEVEN_OR_HIGHER || Platform.OS === 'ios';\n// on Android Telegram is not using androidx.core values and uses custom interpolation\n// duration is taken from here: https://github.com/DrKLO/Telegram/blob/e9a35cea54c06277c69d41b8e25d94b5d7ede065/TMessagesProj/src/main/java/org/telegram/ui/ActionBar/AdjustPanLayoutHelper.java#L39\n// and bezier is taken from: https://github.com/DrKLO/Telegram/blob/e9a35cea54c06277c69d41b8e25d94b5d7ede065/TMessagesProj/src/main/java/androidx/recyclerview/widget/ChatListItemAnimator.java#L40\nconst TELEGRAM_ANDROID_TIMING_CONFIG = {\n  duration: 250,\n  easing: Easing.bezier(\n    0.19919472913616398,\n    0.010644531250000006,\n    0.27920937042459737,\n    0.91025390625\n  ),\n};\n\n/**\n * Hook that uses default transitions for iOS and Android > 11, and uses\n * custom interpolation on Android < 11 to achieve more smooth animation\n */\nexport const useSmoothKeyboardHandler: typeof useKeyboardHandler = (\n  handler,\n  deps\n) => {\n  const target = useSharedValue(-1);\n  const persistedHeight = useSharedValue(0);\n  const animatedKeyboardHeight = useSharedValue(0);\n\n  useAnimatedReaction(\n    () => {\n      if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n        return;\n      }\n      const event = {\n        // it'll be always 250, since we're running animation via `withTiming` where\n        // duration in config (TELEGRAM_ANDROID_TIMING_CONFIG.duration) = 250ms\n        duration: 250,\n        target: target.value,\n        height: animatedKeyboardHeight.value,\n        progress: animatedKeyboardHeight.value / persistedHeight.value,\n      };\n      return event;\n    },\n    (evt) => {\n      if (!evt) {\n        return;\n      }\n      handler.onMove?.(evt);\n\n      // dispatch `onEnd`\n      if (evt.height === persistedHeight.value) {\n        handler.onEnd?.(evt);\n      }\n    },\n    [handler]\n  );\n\n  useKeyboardHandler(\n    {\n      onStart: (e) => {\n        'worklet';\n\n        // immediately dispatch onStart/onEnd events if onStart dispatched with the same height\n        // and don't wait for animation 250ms\n        if (\n          !IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS &&\n          e.height === persistedHeight.value\n        ) {\n          handler.onStart?.(e);\n          handler.onEnd?.(e);\n\n          return;\n        }\n\n        target.value = e.target;\n\n        if (e.height > 0) {\n          persistedHeight.value = e.height;\n        }\n        // if we are running on Android < 9, then we are using custom interpolation\n        // to achieve smoother animation and use `animatedKeyboardHeight` as animation\n        // driver\n        if (!IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n          animatedKeyboardHeight.value = withTiming(\n            e.height,\n            TELEGRAM_ANDROID_TIMING_CONFIG\n          );\n        }\n\n        handler.onStart?.(e);\n      },\n      onMove: (e) => {\n        'worklet';\n\n        if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n          handler.onMove?.(e);\n        }\n      },\n      onEnd: (e) => {\n        'worklet';\n\n        if (IS_ANDROID_ELEVEN_OR_HIGHER_OR_IOS) {\n          handler.onEnd?.(e);\n        }\n\n        persistedHeight.value = e.height;\n      },\n    },\n    deps\n  );\n};\n"],"mappings":"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"}

package/lib/module/components/KeyboardAwareScrollView/utils.js

@@ -0,0 +1,21 @@
+export const debounce = function (worklet) {
+  'worklet';
+
+  let wait = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  const value = {
+    time: 0
+  };
+  return function () {
+    'worklet';
+
+    const t = Date.now();
+    const now = t - value.time;
+    if (now < wait) {
+      value.time = t;
+      return;
+    }
+    value.time = t;
+    return worklet(...arguments);
+  };
+};
+//# sourceMappingURL=utils.js.map

package/lib/module/components/KeyboardAwareScrollView/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["debounce","worklet","wait","value","time","t","Date","now"],"sources":["utils.ts"],"sourcesContent":["export const debounce = <F extends (...args: Parameters<F>) => ReturnType<F>>(\n  worklet: F,\n  wait = 0\n) => {\n  'worklet';\n\n  const value = {\n    time: 0,\n  };\n\n  return (...args: Parameters<F>): ReturnType<F> | void => {\n    'worklet';\n\n    const t = Date.now();\n    const now = t - value.time;\n\n    if (now < wait) {\n      value.time = t;\n      return;\n    }\n\n    value.time = t;\n\n    return worklet(...args);\n  };\n};\n"],"mappings":"AAAA,OAAO,MAAMA,QAAQ,GAAG,UACtBC,OAAU,EAEP;EACH,SAAS;;EAAC,IAFVC,IAAI,uEAAG,CAAC;EAIR,MAAMC,KAAK,GAAG;IACZC,IAAI,EAAE;EACR,CAAC;EAED,OAAO,YAAkD;IACvD,SAAS;;IAET,MAAMC,CAAC,GAAGC,IAAI,CAACC,GAAG,EAAE;IACpB,MAAMA,GAAG,GAAGF,CAAC,GAAGF,KAAK,CAACC,IAAI;IAE1B,IAAIG,GAAG,GAAGL,IAAI,EAAE;MACdC,KAAK,CAACC,IAAI,GAAGC,CAAC;MACd;IACF;IAEAF,KAAK,CAACC,IAAI,GAAGC,CAAC;IAEd,OAAOJ,OAAO,CAAC,YAAO,CAAC;EACzB,CAAC;AACH,CAAC"}