react-native-keyboard-controller 1.12.2 → 1.12.3

package/src/bindings.native.ts

@@ -6,6 +6,7 @@ import type {
   KeyboardControllerProps,
   KeyboardEventsModule,
   KeyboardGestureAreaProps,
+  WindowDimensionsEventsModule,
 } from "./types";
 
 const LINKING_ERROR =
@@ -44,6 +45,10 @@ export const FocusedInputEvents: FocusedInputEventsModule = {
   addListener: (name, cb) =>
     eventEmitter.addListener(KEYBOARD_CONTROLLER_NAMESPACE + name, cb),
 };
+export const WindowDimensionsEvents: WindowDimensionsEventsModule = {
+  addListener: (name, cb) =>
+    eventEmitter.addListener(KEYBOARD_CONTROLLER_NAMESPACE + name, cb),
+};
 export const KeyboardControllerView: React.FC<KeyboardControllerProps> =
   require("./specs/KeyboardControllerViewNativeComponent").default;
 export const KeyboardGestureArea: React.FC<KeyboardGestureAreaProps> =

package/src/bindings.ts

@@ -6,6 +6,7 @@ import type {
   KeyboardControllerProps,
   KeyboardEventsModule,
   KeyboardGestureAreaProps,
+  WindowDimensionsEventsModule,
 } from "./types";
 import type { EmitterSubscription } from "react-native";
 
@@ -28,6 +29,9 @@ export const KeyboardEvents: KeyboardEventsModule = {
 export const FocusedInputEvents: FocusedInputEventsModule = {
   addListener: () => ({ remove: NOOP } as EmitterSubscription),
 };
+export const WindowDimensionsEvents: WindowDimensionsEventsModule = {
+  addListener: () => ({ remove: NOOP } as EmitterSubscription),
+};
 export const KeyboardControllerView =
   View as unknown as React.FC<KeyboardControllerProps>;
 export const KeyboardGestureArea =

package/src/components/KeyboardAvoidingView/index.tsx

@@ -1,5 +1,5 @@
 import React, { forwardRef, useCallback, useMemo } from "react";
-import { View, useWindowDimensions } from "react-native";
+import { View } from "react-native";
 import Reanimated, {
   interpolate,
   runOnUI,
@@ -8,6 +8,8 @@ import Reanimated, {
   useSharedValue,
 } from "react-native-reanimated";
 
+import { useWindowDimensions } from "react-native-keyboard-controller";
+
 import { useKeyboardAnimation } from "./hooks";
 
 import type { LayoutRectangle, ViewProps } from "react-native";

package/src/components/KeyboardAwareScrollView/index.tsx

@@ -1,5 +1,5 @@
 import React, { forwardRef, useCallback, useMemo } from "react";
-import { findNodeHandle, useWindowDimensions } from "react-native";
+import { findNodeHandle } from "react-native";
 import Reanimated, {
   interpolate,
   scrollTo,
@@ -12,10 +12,11 @@ import Reanimated, {
 import {
   useFocusedInputHandler,
   useReanimatedFocusedInput,
+  useWindowDimensions,
 } from "react-native-keyboard-controller";
 
 import { useSmoothKeyboardHandler } from "./useSmoothKeyboardHandler";
-import { debounce } from "./utils";
+import { debounce, scrollDistanceWithRespectToSnapPoints } from "./utils";
 
 import type {
   LayoutChangeEvent,
@@ -154,10 +155,18 @@ const KeyboardAwareScrollView = forwardRef<
         const point = absoluteY + inputHeight;
 
         if (visibleRect - point <= bottomOffset) {
+          const relativeScrollTo =
+            keyboardHeight.value - (height - point) + bottomOffset;
           const interpolatedScrollTo = interpolate(
             e,
             [initialKeyboardSize.value, keyboardHeight.value],
-            [0, keyboardHeight.value - (height - point) + bottomOffset],
+            [
+              0,
+              scrollDistanceWithRespectToSnapPoints(
+                relativeScrollTo + scrollPosition.value,
+                rest.snapToOffsets,
+              ) - scrollPosition.value,
+            ],
           );
           const targetScrollY =
             Math.max(interpolatedScrollTo, 0) + scrollPosition.value;
@@ -180,7 +189,7 @@ const KeyboardAwareScrollView = forwardRef<
 
         return 0;
       },
-      [bottomOffset, enabled],
+      [bottomOffset, enabled, rest.snapToOffsets],
     );
 
     const onChangeText = useCallback(() => {

package/src/components/KeyboardAwareScrollView/utils.ts

@@ -24,3 +24,18 @@ export const debounce = <F extends (...args: Parameters<F>) => ReturnType<F>>(
     return worklet(...args);
   };
 };
+
+export const scrollDistanceWithRespectToSnapPoints = (
+  defaultScrollValue: number,
+  snapPoints?: number[],
+) => {
+  "worklet";
+
+  let snapPoint: number | undefined;
+
+  if (snapPoints) {
+    snapPoint = snapPoints.find((offset) => offset >= defaultScrollValue);
+  }
+
+  return snapPoint ?? defaultScrollValue;
+};

package/src/{hooks.ts → hooks/index.ts}

@@ -1,12 +1,12 @@
 import { useEffect } from "react";
 
-import { KeyboardController } from "./bindings";
-import { AndroidSoftInputModes } from "./constants";
-import { useKeyboardContext } from "./context";
-import { uuid } from "./utils";
+import { KeyboardController } from "../bindings";
+import { AndroidSoftInputModes } from "../constants";
+import { useKeyboardContext } from "../context";
+import { uuid } from "../utils";
 
-import type { AnimatedContext, ReanimatedContext } from "./context";
-import type { FocusedInputHandler, KeyboardHandler } from "./types";
+import type { AnimatedContext, ReanimatedContext } from "../context";
+import type { FocusedInputHandler, KeyboardHandler } from "../types";
 import type { DependencyList } from "react";
 
 export const useResizeMode = () => {
@@ -86,3 +86,5 @@ export function useFocusedInputHandler(
     };
   }, deps);
 }
+
+export * from "./useWindowDimensions";

package/src/hooks/useWindowDimensions/index.android.ts

@@ -0,0 +1,33 @@
+import { useEffect, useState } from "react";
+
+import { WindowDimensionsEvents } from "../../bindings";
+
+import type { WindowDimensionsEventData } from "../../types";
+
+let initialDimensions: WindowDimensionsEventData = {
+  width: 0,
+  height: 0,
+};
+
+WindowDimensionsEvents.addListener("windowDidResize", (e) => {
+  initialDimensions = e;
+});
+
+export const useWindowDimensions = () => {
+  const [dimensions, setDimensions] = useState(initialDimensions);
+
+  useEffect(() => {
+    const subscription = WindowDimensionsEvents.addListener(
+      "windowDidResize",
+      (e) => {
+        setDimensions(e);
+      },
+    );
+
+    return () => {
+      subscription.remove();
+    };
+  }, []);
+
+  return dimensions;
+};

package/src/hooks/useWindowDimensions/index.ts

@@ -0,0 +1 @@
+export { useWindowDimensions } from "react-native";

package/src/types.ts

@@ -145,6 +145,17 @@ export type FocusedInputEventsModule = {
     cb: (e: FocusedInputEventData) => void,
   ) => EmitterSubscription;
 };
+export type WindowDimensionsAvailableEvents = "windowDidResize";
+export type WindowDimensionsEventData = {
+  width: number;
+  height: number;
+};
+export type WindowDimensionsEventsModule = {
+  addListener: (
+    name: WindowDimensionsAvailableEvents,
+    cb: (e: WindowDimensionsEventData) => void,
+  ) => EmitterSubscription;
+};
 
 // reanimated hook declaration
 export type KeyboardHandlerHook<TContext, Event> = (

package/lib/commonjs/hooks.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","require","_bindings","_constants","_context","_utils","useResizeMode","useEffect","KeyboardController","setInputMode","AndroidSoftInputModes","SOFT_INPUT_ADJUST_RESIZE","setDefaultMode","exports","useKeyboardAnimation","context","useKeyboardContext","animated","useReanimatedKeyboardAnimation","reanimated","useGenericKeyboardHandler","handler","deps","key","uuid","setKeyboardHandlers","undefined","useKeyboardHandler","useKeyboardController","setEnabled","enabled","useReanimatedFocusedInput","input","layout","useFocusedInputHandler","setInputHandlers"],"sources":["hooks.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { KeyboardController } from \"./bindings\";\nimport { AndroidSoftInputModes } from \"./constants\";\nimport { useKeyboardContext } from \"./context\";\nimport { uuid } from \"./utils\";\n\nimport type { AnimatedContext, ReanimatedContext } from \"./context\";\nimport type { FocusedInputHandler, KeyboardHandler } from \"./types\";\nimport type { DependencyList } from \"react\";\n\nexport const useResizeMode = () => {\n  useEffect(() => {\n    KeyboardController.setInputMode(\n      AndroidSoftInputModes.SOFT_INPUT_ADJUST_RESIZE,\n    );\n\n    return () => KeyboardController.setDefaultMode();\n  }, []);\n};\n\nexport const useKeyboardAnimation = (): AnimatedContext => {\n  useResizeMode();\n  const context = useKeyboardContext();\n\n  return context.animated;\n};\n\nexport const useReanimatedKeyboardAnimation = (): ReanimatedContext => {\n  useResizeMode();\n  const context = useKeyboardContext();\n\n  return context.reanimated;\n};\n\nexport function useGenericKeyboardHandler(\n  handler: KeyboardHandler,\n  deps?: DependencyList,\n) {\n  const context = useKeyboardContext();\n\n  useEffect(() => {\n    const key = uuid();\n\n    context.setKeyboardHandlers({ [key]: handler });\n\n    return () => {\n      context.setKeyboardHandlers({ [key]: undefined });\n    };\n  }, deps);\n}\n\nexport function useKeyboardHandler(\n  handler: KeyboardHandler,\n  deps?: DependencyList,\n) {\n  useResizeMode();\n  useGenericKeyboardHandler(handler, deps);\n}\n\nexport function useKeyboardController() {\n  const context = useKeyboardContext();\n\n  return { setEnabled: context.setEnabled, enabled: context.enabled };\n}\n\nexport function useReanimatedFocusedInput() {\n  const context = useKeyboardContext();\n\n  return { input: context.layout };\n}\n\nexport function useFocusedInputHandler(\n  handler?: FocusedInputHandler,\n  deps?: DependencyList,\n) {\n  const context = useKeyboardContext();\n\n  useEffect(() => {\n    const key = uuid();\n\n    context.setInputHandlers({ [key]: handler });\n\n    return () => {\n      context.setInputHandlers({ [key]: undefined });\n    };\n  }, deps);\n}\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAMO,MAAMK,aAAa,GAAGA,CAAA,KAAM;EACjC,IAAAC,gBAAS,EAAC,MAAM;IACdC,4BAAkB,CAACC,YAAY,CAC7BC,gCAAqB,CAACC,wBACxB,CAAC;IAED,OAAO,MAAMH,4BAAkB,CAACI,cAAc,CAAC,CAAC;EAClD,CAAC,EAAE,EAAE,CAAC;AACR,CAAC;AAACC,OAAA,CAAAP,aAAA,GAAAA,aAAA;AAEK,MAAMQ,oBAAoB,GAAGA,CAAA,KAAuB;EACzDR,aAAa,CAAC,CAAC;EACf,MAAMS,OAAO,GAAG,IAAAC,2BAAkB,EAAC,CAAC;EAEpC,OAAOD,OAAO,CAACE,QAAQ;AACzB,CAAC;AAACJ,OAAA,CAAAC,oBAAA,GAAAA,oBAAA;AAEK,MAAMI,8BAA8B,GAAGA,CAAA,KAAyB;EACrEZ,aAAa,CAAC,CAAC;EACf,MAAMS,OAAO,GAAG,IAAAC,2BAAkB,EAAC,CAAC;EAEpC,OAAOD,OAAO,CAACI,UAAU;AAC3B,CAAC;AAACN,OAAA,CAAAK,8BAAA,GAAAA,8BAAA;AAEK,SAASE,yBAAyBA,CACvCC,OAAwB,EACxBC,IAAqB,EACrB;EACA,MAAMP,OAAO,GAAG,IAAAC,2BAAkB,EAAC,CAAC;EAEpC,IAAAT,gBAAS,EAAC,MAAM;IACd,MAAMgB,GAAG,GAAG,IAAAC,WAAI,EAAC,CAAC;IAElBT,OAAO,CAACU,mBAAmB,CAAC;MAAE,CAACF,GAAG,GAAGF;IAAQ,CAAC,CAAC;IAE/C,OAAO,MAAM;MACXN,OAAO,CAACU,mBAAmB,CAAC;QAAE,CAACF,GAAG,GAAGG;MAAU,CAAC,CAAC;IACnD,CAAC;EACH,CAAC,EAAEJ,IAAI,CAAC;AACV;AAEO,SAASK,kBAAkBA,CAChCN,OAAwB,EACxBC,IAAqB,EACrB;EACAhB,aAAa,CAAC,CAAC;EACfc,yBAAyB,CAACC,OAAO,EAAEC,IAAI,CAAC;AAC1C;AAEO,SAASM,qBAAqBA,CAAA,EAAG;EACtC,MAAMb,OAAO,GAAG,IAAAC,2BAAkB,EAAC,CAAC;EAEpC,OAAO;IAAEa,UAAU,EAAEd,OAAO,CAACc,UAAU;IAAEC,OAAO,EAAEf,OAAO,CAACe;EAAQ,CAAC;AACrE;AAEO,SAASC,yBAAyBA,CAAA,EAAG;EAC1C,MAAMhB,OAAO,GAAG,IAAAC,2BAAkB,EAAC,CAAC;EAEpC,OAAO;IAAEgB,KAAK,EAAEjB,OAAO,CAACkB;EAAO,CAAC;AAClC;AAEO,SAASC,sBAAsBA,CACpCb,OAA6B,EAC7BC,IAAqB,EACrB;EACA,MAAMP,OAAO,GAAG,IAAAC,2BAAkB,EAAC,CAAC;EAEpC,IAAAT,gBAAS,EAAC,MAAM;IACd,MAAMgB,GAAG,GAAG,IAAAC,WAAI,EAAC,CAAC;IAElBT,OAAO,CAACoB,gBAAgB,CAAC;MAAE,CAACZ,GAAG,GAAGF;IAAQ,CAAC,CAAC;IAE5C,OAAO,MAAM;MACXN,OAAO,CAACoB,gBAAgB,CAAC;QAAE,CAACZ,GAAG,GAAGG;MAAU,CAAC,CAAC;IAChD,CAAC;EACH,CAAC,EAAEJ,IAAI,CAAC;AACV","ignoreList":[]}

package/lib/module/hooks.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useEffect","KeyboardController","AndroidSoftInputModes","useKeyboardContext","uuid","useResizeMode","setInputMode","SOFT_INPUT_ADJUST_RESIZE","setDefaultMode","useKeyboardAnimation","context","animated","useReanimatedKeyboardAnimation","reanimated","useGenericKeyboardHandler","handler","deps","key","setKeyboardHandlers","undefined","useKeyboardHandler","useKeyboardController","setEnabled","enabled","useReanimatedFocusedInput","input","layout","useFocusedInputHandler","setInputHandlers"],"sources":["hooks.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { KeyboardController } from \"./bindings\";\nimport { AndroidSoftInputModes } from \"./constants\";\nimport { useKeyboardContext } from \"./context\";\nimport { uuid } from \"./utils\";\n\nimport type { AnimatedContext, ReanimatedContext } from \"./context\";\nimport type { FocusedInputHandler, KeyboardHandler } from \"./types\";\nimport type { DependencyList } from \"react\";\n\nexport const useResizeMode = () => {\n  useEffect(() => {\n    KeyboardController.setInputMode(\n      AndroidSoftInputModes.SOFT_INPUT_ADJUST_RESIZE,\n    );\n\n    return () => KeyboardController.setDefaultMode();\n  }, []);\n};\n\nexport const useKeyboardAnimation = (): AnimatedContext => {\n  useResizeMode();\n  const context = useKeyboardContext();\n\n  return context.animated;\n};\n\nexport const useReanimatedKeyboardAnimation = (): ReanimatedContext => {\n  useResizeMode();\n  const context = useKeyboardContext();\n\n  return context.reanimated;\n};\n\nexport function useGenericKeyboardHandler(\n  handler: KeyboardHandler,\n  deps?: DependencyList,\n) {\n  const context = useKeyboardContext();\n\n  useEffect(() => {\n    const key = uuid();\n\n    context.setKeyboardHandlers({ [key]: handler });\n\n    return () => {\n      context.setKeyboardHandlers({ [key]: undefined });\n    };\n  }, deps);\n}\n\nexport function useKeyboardHandler(\n  handler: KeyboardHandler,\n  deps?: DependencyList,\n) {\n  useResizeMode();\n  useGenericKeyboardHandler(handler, deps);\n}\n\nexport function useKeyboardController() {\n  const context = useKeyboardContext();\n\n  return { setEnabled: context.setEnabled, enabled: context.enabled };\n}\n\nexport function useReanimatedFocusedInput() {\n  const context = useKeyboardContext();\n\n  return { input: context.layout };\n}\n\nexport function useFocusedInputHandler(\n  handler?: FocusedInputHandler,\n  deps?: DependencyList,\n) {\n  const context = useKeyboardContext();\n\n  useEffect(() => {\n    const key = uuid();\n\n    context.setInputHandlers({ [key]: handler });\n\n    return () => {\n      context.setInputHandlers({ [key]: undefined });\n    };\n  }, deps);\n}\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AAEjC,SAASC,kBAAkB,QAAQ,YAAY;AAC/C,SAASC,qBAAqB,QAAQ,aAAa;AACnD,SAASC,kBAAkB,QAAQ,WAAW;AAC9C,SAASC,IAAI,QAAQ,SAAS;AAM9B,OAAO,MAAMC,aAAa,GAAGA,CAAA,KAAM;EACjCL,SAAS,CAAC,MAAM;IACdC,kBAAkB,CAACK,YAAY,CAC7BJ,qBAAqB,CAACK,wBACxB,CAAC;IAED,OAAO,MAAMN,kBAAkB,CAACO,cAAc,CAAC,CAAC;EAClD,CAAC,EAAE,EAAE,CAAC;AACR,CAAC;AAED,OAAO,MAAMC,oBAAoB,GAAGA,CAAA,KAAuB;EACzDJ,aAAa,CAAC,CAAC;EACf,MAAMK,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpC,OAAOO,OAAO,CAACC,QAAQ;AACzB,CAAC;AAED,OAAO,MAAMC,8BAA8B,GAAGA,CAAA,KAAyB;EACrEP,aAAa,CAAC,CAAC;EACf,MAAMK,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpC,OAAOO,OAAO,CAACG,UAAU;AAC3B,CAAC;AAED,OAAO,SAASC,yBAAyBA,CACvCC,OAAwB,EACxBC,IAAqB,EACrB;EACA,MAAMN,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpCH,SAAS,CAAC,MAAM;IACd,MAAMiB,GAAG,GAAGb,IAAI,CAAC,CAAC;IAElBM,OAAO,CAACQ,mBAAmB,CAAC;MAAE,CAACD,GAAG,GAAGF;IAAQ,CAAC,CAAC;IAE/C,OAAO,MAAM;MACXL,OAAO,CAACQ,mBAAmB,CAAC;QAAE,CAACD,GAAG,GAAGE;MAAU,CAAC,CAAC;IACnD,CAAC;EACH,CAAC,EAAEH,IAAI,CAAC;AACV;AAEA,OAAO,SAASI,kBAAkBA,CAChCL,OAAwB,EACxBC,IAAqB,EACrB;EACAX,aAAa,CAAC,CAAC;EACfS,yBAAyB,CAACC,OAAO,EAAEC,IAAI,CAAC;AAC1C;AAEA,OAAO,SAASK,qBAAqBA,CAAA,EAAG;EACtC,MAAMX,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpC,OAAO;IAAEmB,UAAU,EAAEZ,OAAO,CAACY,UAAU;IAAEC,OAAO,EAAEb,OAAO,CAACa;EAAQ,CAAC;AACrE;AAEA,OAAO,SAASC,yBAAyBA,CAAA,EAAG;EAC1C,MAAMd,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpC,OAAO;IAAEsB,KAAK,EAAEf,OAAO,CAACgB;EAAO,CAAC;AAClC;AAEA,OAAO,SAASC,sBAAsBA,CACpCZ,OAA6B,EAC7BC,IAAqB,EACrB;EACA,MAAMN,OAAO,GAAGP,kBAAkB,CAAC,CAAC;EAEpCH,SAAS,CAAC,MAAM;IACd,MAAMiB,GAAG,GAAGb,IAAI,CAAC,CAAC;IAElBM,OAAO,CAACkB,gBAAgB,CAAC;MAAE,CAACX,GAAG,GAAGF;IAAQ,CAAC,CAAC;IAE5C,OAAO,MAAM;MACXL,OAAO,CAACkB,gBAAgB,CAAC;QAAE,CAACX,GAAG,GAAGE;MAAU,CAAC,CAAC;IAChD,CAAC;EACH,CAAC,EAAEH,IAAI,CAAC;AACV","ignoreList":[]}