react-native-keyboard-toolkit 1.0.0 → 1.0.2

package/dist/components/KeyboardAwareScrollView.js

@@ -11,8 +11,8 @@ const useKeyboardState_1 = require("../hooks/useKeyboardState");
 const constants_1 = require("../utils/constants");
 const platform_1 = require("../utils/platform");
 /** A ScrollView that adds keyboard space and scrolls a covered focused input into view. */
-exports.KeyboardAwareScrollView = (0, react_1.forwardRef)(function KeyboardAwareScrollViewComponent({ behavior = 'smart', keyboardSpacing = constants_1.DEFAULT_KEYBOARD_SPACING, enabled = true, contentContainerStyle, onScroll, onScrollBeginDrag, onContentSizeChange, onLayout, onFocusCapture, scrollEventThrottle = 16, ...props }, forwardedRef) {
-    const keyboard = (0, useKeyboardState_1.useKeyboardState)();
+exports.KeyboardAwareScrollView = (0, react_1.forwardRef)(function KeyboardAwareScrollViewComponent({ behavior = 'smart', keyboardSpacing = constants_1.DEFAULT_KEYBOARD_SPACING, enabled = true, isFocused, contentContainerStyle, onScroll, onScrollBeginDrag, onContentSizeChange, onLayout, onFocusCapture, scrollEventThrottle = 16, ...props }, forwardedRef) {
+    const keyboard = (0, useKeyboardState_1.useKeyboardState)({ isFocused });
     const debug = (0, KeyboardContext_1.useKeyboardDebug)();
     const scrollRef = (0, react_1.useRef)(null);
     (0, react_1.useImperativeHandle)(forwardedRef, () => scrollRef.current, []);

package/dist/components/KeyboardAwareView.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { KeyboardAwareViewProps } from '../types';
 import type { KeyboardAwareViewRef } from '../types';
-/** A lightweight view that adds bottom space while the keyboard is visible. */
+/** Adds keyboard spacing to in-flow content and keeps absolute footers visible. */
 export declare const KeyboardAwareView: React.ForwardRefExoticComponent<KeyboardAwareViewProps & React.RefAttributes<KeyboardAwareViewRef>>;
 export default KeyboardAwareView;

package/dist/components/KeyboardAwareView.js

@@ -7,14 +7,20 @@ const react_native_1 = require("react-native");
 const constants_1 = require("../utils/constants");
 const useKeyboardState_1 = require("../hooks/useKeyboardState");
 const scrollManager_1 = require("../utils/scrollManager");
-/** A lightweight view that adds bottom space while the keyboard is visible. */
-exports.KeyboardAwareView = (0, react_1.forwardRef)(function KeyboardAwareViewComponent({ behavior = 'smart', keyboardSpacing = constants_1.DEFAULT_KEYBOARD_SPACING, enabled = true, style, onLayout, ...props }, forwardedRef) {
-    const keyboard = (0, useKeyboardState_1.useKeyboardState)();
+/** Adds keyboard spacing to in-flow content and keeps absolute footers visible. */
+exports.KeyboardAwareView = (0, react_1.forwardRef)(function KeyboardAwareViewComponent({ behavior = 'smart', keyboardSpacing = constants_1.DEFAULT_KEYBOARD_SPACING, enabled = true, isFocused, style, onLayout, ...props }, forwardedRef) {
+    const keyboard = (0, useKeyboardState_1.useKeyboardState)({ isFocused });
     const viewRef = (0, react_1.useRef)(null);
     (0, react_1.useImperativeHandle)(forwardedRef, () => viewRef.current, []);
     const measurementSequence = (0, react_1.useRef)(0);
     const [keyboardOverlap, setKeyboardOverlap] = (0, react_1.useState)(0);
+    const [keyboardDisplacement, setKeyboardDisplacement] = (0, react_1.useState)(0);
+    const animatedDisplacement = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
     const flattenedStyle = react_native_1.StyleSheet.flatten(style);
+    const isAbsolutelyPositioned = flattenedStyle?.position === 'absolute';
+    const spacing = Number.isFinite(keyboardSpacing)
+        ? Math.max(0, keyboardSpacing)
+        : 0;
     const basePadding = typeof flattenedStyle?.paddingBottom === 'number'
         ? flattenedStyle.paddingBottom
         : 0;
@@ -28,36 +34,79 @@ exports.KeyboardAwareView = (0, react_1.forwardRef)(function KeyboardAwareViewCo
             if (sequence !== measurementSequence.current || !keyboard.isVisible) {
                 return;
             }
-            setKeyboardOverlap((0, scrollManager_1.calculateKeyboardOverlap)({ y, height }, keyboard.height, keyboard.screenY));
+            if (!isAbsolutelyPositioned) {
+                setKeyboardOverlap((0, scrollManager_1.calculateKeyboardOverlap)({ y, height }, keyboard.height, keyboard.screenY));
+            }
+            setKeyboardDisplacement(isAbsolutelyPositioned && typeof keyboard.screenY === 'number'
+                ? (0, scrollManager_1.calculateKeyboardDisplacement)({ y, height }, keyboard.screenY, spacing)
+                : 0);
         });
-    }, [keyboard.height, keyboard.isVisible, keyboard.screenY]);
+    }, [
+        isAbsolutelyPositioned,
+        keyboard.height,
+        keyboard.isVisible,
+        keyboard.screenY,
+        spacing,
+    ]);
     (0, react_1.useEffect)(() => {
         if (!keyboard.isVisible) {
             measurementSequence.current += 1;
             setKeyboardOverlap(0);
+            setKeyboardDisplacement(0);
             return;
         }
         const frame = requestAnimationFrame(measureOverlap);
         return () => cancelAnimationFrame(frame);
     }, [keyboard.isVisible, keyboard.height, keyboard.screenY, measureOverlap]);
+    const shouldAdjust = enabled &&
+        keyboard.isVisible &&
+        behavior !== 'none' &&
+        behavior !== 'resize';
+    (0, react_1.useEffect)(() => {
+        if (!isAbsolutelyPositioned) {
+            animatedDisplacement.setValue(0);
+            return;
+        }
+        const animation = react_native_1.Animated.timing(animatedDisplacement, {
+            toValue: shouldAdjust ? -keyboardDisplacement : 0,
+            duration: keyboard.animationDuration,
+            useNativeDriver: true,
+        });
+        animation.start();
+        return () => animation.stop();
+    }, [
+        animatedDisplacement,
+        isAbsolutelyPositioned,
+        keyboard.animationDuration,
+        keyboardDisplacement,
+        shouldAdjust,
+    ]);
     const handleLayout = (0, react_1.useCallback)((event) => {
         onLayout?.(event);
         measureOverlap();
     }, [measureOverlap, onLayout]);
-    const adjust = enabled &&
-        keyboard.isVisible &&
-        behavior !== 'none' &&
-        behavior !== 'resize' &&
+    const adjustPadding = shouldAdjust &&
+        !isAbsolutelyPositioned &&
         keyboardOverlap > 0 &&
         typeof flattenedStyle?.paddingBottom !== 'string';
-    return ((0, jsx_runtime_1.jsx)(react_native_1.View, { ...props, ref: viewRef, onLayout: handleLayout, style: adjust
+    const stickyTransform = isAbsolutelyPositioned
+        ? [
+            ...(Array.isArray(flattenedStyle?.transform)
+                ? flattenedStyle.transform
+                : []),
+            { translateY: animatedDisplacement },
+        ]
+        : undefined;
+    return ((0, jsx_runtime_1.jsx)(react_native_1.Animated.View, { ...props, ref: viewRef, onLayout: handleLayout, style: adjustPadding
             ? [
                 style,
                 {
-                    paddingBottom: Math.max(basePadding, keyboardOverlap + Math.max(0, keyboardSpacing)),
+                    paddingBottom: Math.max(basePadding, keyboardOverlap + spacing),
                 },
             ]
-            : style }));
+            : isAbsolutelyPositioned
+                ? [style, { transform: stickyTransform }]
+                : style }));
 });
 exports.KeyboardAwareView.displayName = 'KeyboardAwareView';
 exports.default = exports.KeyboardAwareView;

package/dist/hooks/useKeyboardState.d.ts

@@ -1,2 +1,4 @@
 /** Subscribe to the shared, normalized keyboard state. A provider is optional. */
-export declare function useKeyboardState(): import("..").KeyboardState;
+export declare function useKeyboardState(options?: {
+    isFocused?: boolean;
+}): import("..").KeyboardState;

package/dist/hooks/useKeyboardState.js

@@ -4,6 +4,10 @@ exports.useKeyboardState = useKeyboardState;
 const react_1 = require("react");
 const keyboardEvents_1 = require("../utils/keyboardEvents");
 /** Subscribe to the shared, normalized keyboard state. A provider is optional. */
-function useKeyboardState() {
-    return (0, react_1.useSyncExternalStore)(keyboardEvents_1.subscribeKeyboardState, keyboardEvents_1.getKeyboardState, keyboardEvents_1.getKeyboardState);
+function useKeyboardState(options = {}) {
+    const keyboard = (0, react_1.useSyncExternalStore)(keyboardEvents_1.subscribeKeyboardState, keyboardEvents_1.getKeyboardState, keyboardEvents_1.getKeyboardState);
+    (0, react_1.useEffect)(() => {
+        (0, keyboardEvents_1.synchronizeKeyboardState)(options.isFocused !== false);
+    }, [options.isFocused]);
+    return keyboard;
 }

package/dist/types/index.d.ts

@@ -21,14 +21,18 @@ export interface KeyboardAwareScrollViewProps extends ScrollViewProps {
     keyboardSpacing?: number;
     /** Disable keyboard-driven padding and focus scrolling. */
     enabled?: boolean;
+    /** Pass the navigation focus state to resync keyboard metrics on refocus. */
+    isFocused?: boolean;
 }
 export interface KeyboardAwareViewProps extends ViewProps {
-    /** Defaults to `smart`. `resize` relies on the platform window resize behavior. */
+    /** Defaults to `smart`; absolute-positioned views are moved above the keyboard. */
     behavior?: KeyboardBehavior;
     /** Extra space between the view content and the keyboard, in points. */
     keyboardSpacing?: number;
     /** Disable keyboard-driven layout changes. */
     enabled?: boolean;
+    /** Pass the navigation focus state to resync keyboard metrics on refocus. */
+    isFocused?: boolean;
 }
 export interface KeyboardProviderProps {
     children: ReactNode;

package/dist/utils/keyboardEvents.d.ts

@@ -1,4 +1,6 @@
 import type { KeyboardState } from '../types';
+/** Reconcile the shared snapshot with the platform's current keyboard metrics. */
+export declare function synchronizeKeyboardState(isFocused?: boolean): void;
 /** Subscribe to the shared keyboard event stream. */
 export declare function subscribeKeyboardState(subscriber: () => void): () => void;
 /** Return the stable current snapshot used by `useSyncExternalStore`. */

package/dist/utils/keyboardEvents.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.synchronizeKeyboardState = synchronizeKeyboardState;
 exports.subscribeKeyboardState = subscribeKeyboardState;
 exports.getKeyboardState = getKeyboardState;
 exports.resetKeyboardStateForTests = resetKeyboardStateForTests;
@@ -15,9 +16,20 @@ const initialState = {
 let state = initialState;
 let listeners = [];
 const subscribers = new Set();
+function publish(nextState) {
+    if (state.isVisible === nextState.isVisible &&
+        state.height === nextState.height &&
+        state.progress === nextState.progress &&
+        state.animationDuration === nextState.animationDuration &&
+        state.screenY === nextState.screenY) {
+        return;
+    }
+    state = nextState;
+    subscribers.forEach(subscriber => subscriber());
+}
 function update(event, visible) {
     const coordinates = event.endCoordinates;
-    state = {
+    publish({
         isVisible: visible,
         height: visible ? Math.max(0, coordinates?.height ?? 0) : 0,
         progress: visible ? 1 : 0,
@@ -25,25 +37,32 @@ function update(event, visible) {
         ...(visible && typeof coordinates?.screenY === 'number'
             ? { screenY: coordinates.screenY }
             : {}),
-    };
-    subscribers.forEach(subscriber => subscriber());
+    });
 }
-function syncCurrentKeyboardState() {
+function resetKeyboardState() {
+    publish(initialState);
+}
+/** Reconcile the shared snapshot with the platform's current keyboard metrics. */
+function synchronizeKeyboardState(isFocused = true) {
+    if (!isFocused) {
+        resetKeyboardState();
+        return;
+    }
     const metrics = typeof react_native_1.Keyboard.metrics === 'function' ? react_native_1.Keyboard.metrics() : undefined;
     const isVisible = typeof react_native_1.Keyboard.isVisible === 'function'
         ? react_native_1.Keyboard.isVisible()
         : metrics != null;
     if (!isVisible || !metrics) {
+        resetKeyboardState();
         return;
     }
-    state = {
+    publish({
         isVisible: true,
         height: metrics.height,
         progress: 1,
         animationDuration: 0,
         screenY: metrics.screenY,
-    };
-    subscribers.forEach(subscriber => subscriber());
+    });
 }
 function startListening() {
     const names = (0, platform_1.getKeyboardEventNames)();
@@ -51,17 +70,31 @@ function startListening() {
         listeners = [
             react_native_1.Keyboard.addListener(names.frameChange, event => update(event, event.endCoordinates.height > 0)),
         ];
-        syncCurrentKeyboardState();
-        return;
     }
-    const showSubscription = react_native_1.Keyboard.addListener(names.show, event => update(event, true));
-    const hideSubscription = react_native_1.Keyboard.addListener(names.hide, event => update(event, false));
-    listeners = [showSubscription, hideSubscription];
-    syncCurrentKeyboardState();
+    else {
+        const showSubscription = react_native_1.Keyboard.addListener(names.show, event => update(event, true));
+        const hideSubscription = react_native_1.Keyboard.addListener(names.hide, event => update(event, false));
+        listeners = [showSubscription, hideSubscription];
+    }
+    listeners.push(react_native_1.AppState.addEventListener('change', nextState => {
+        if (nextState === 'active') {
+            synchronizeKeyboardState();
+        }
+        else {
+            resetKeyboardState();
+        }
+    }));
+    listeners.push(react_native_1.Dimensions.addEventListener('change', () => {
+        if (typeof react_native_1.Keyboard.metrics === 'function') {
+            synchronizeKeyboardState();
+        }
+    }));
+    synchronizeKeyboardState();
 }
 function stopListening() {
     listeners.forEach(subscription => subscription.remove());
     listeners = [];
+    resetKeyboardState();
 }
 /** Subscribe to the shared keyboard event stream. */
 function subscribeKeyboardState(subscriber) {

package/dist/utils/scrollManager.d.ts

@@ -10,6 +10,8 @@ export interface ScrollCalculation {
     offset: number;
     delta: number;
 }
+/** Return how far a bottom edge must move to clear the keyboard and spacing. */
+export declare function calculateKeyboardDisplacement(viewport: ScrollViewport, keyboardTop: number, spacing: number): number;
 /** Return the part of the measured view actually covered by the keyboard. */
 export declare function calculateKeyboardOverlap(viewport: ScrollViewport, keyboardHeight: number, keyboardTop?: number): number;
 /**

package/dist/utils/scrollManager.js

@@ -1,7 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.calculateKeyboardDisplacement = calculateKeyboardDisplacement;
 exports.calculateKeyboardOverlap = calculateKeyboardOverlap;
 exports.calculateScrollOffset = calculateScrollOffset;
+/** Return how far a bottom edge must move to clear the keyboard and spacing. */
+function calculateKeyboardDisplacement(viewport, keyboardTop, spacing) {
+    return Math.max(0, viewport.y + viewport.height - keyboardTop + Math.max(0, spacing));
+}
 /** Return the part of the measured view actually covered by the keyboard. */
 function calculateKeyboardOverlap(viewport, keyboardHeight, keyboardTop) {
     const viewportBottom = viewport.y + viewport.height;

package/docs/android.md

@@ -12,6 +12,11 @@ ended the viewport at that frame, the measured overlap is zero and no second
 keyboard-height inset is added. OEM keyboards and edge-to-edge configurations
 can still report coordinates relative to different window origins.
 
+For a sticky submit action, put an absolutely positioned
+`KeyboardAwareView` outside the scroll view. With `adjustResize`, Android may
+already move the footer as the window changes size; the measured keyboard frame
+is used to apply only any remaining displacement and configured spacing.
+
 ## Device checklist
 
 - Test Android 10+ devices/emulators and the app's minimum supported OS.

package/docs/api.md

@@ -11,6 +11,9 @@ Extends React Native `ScrollViewProps`.
   none disables keyboard adjustment.
 - `keyboardSpacing?: number` (default `16`): spacing in points.
 - `enabled?: boolean` (default `true`): disable keyboard adjustments.
+- `isFocused?: boolean`: optional navigation focus state. Pass `useIsFocused()`
+  from React Navigation to clear state on blur and resync native keyboard
+  metrics on focus; the library does not depend on React Navigation.
 
 The component measures its viewport and the focused native input. It adds
 scrollable bottom space based on measured viewport/keyboard-frame overlap,
@@ -20,10 +23,15 @@ underlying React Native `ScrollView`.
 
 ## `KeyboardAwareView`
 
-Extends `ViewProps`. Supports `behavior`, `keyboardSpacing`, and `enabled`.
+Extends `ViewProps`. Supports `behavior`, `keyboardSpacing`, `enabled`, and
+`isFocused` (with the same optional navigation integration as
+`KeyboardAwareScrollView`).
 Smart, scroll, and padding add bottom padding for the measured overlap. Resize
-and none do not add padding. This view does not scroll to reveal a hidden child.
-Its ref points to the underlying React Native `View`.
+and none do not adjust the layout. When `style.position` is `absolute`, the
+component animates the view upward by the distance from its measured bottom
+edge to the keyboard frame, plus `keyboardSpacing`. It returns to its original
+position when the keyboard hides. This view does not scroll to reveal a hidden
+child. Its ref points to the underlying React Native `View`.
 
 ## `KeyboardProvider`
 
@@ -56,8 +64,10 @@ before keyboard dismissal.
 
 ## Hooks
 
-- `useKeyboardState()` and its alias `useKeyboard()` return a stable
+- `useKeyboardState({ isFocused? })` and its alias `useKeyboard()` return a stable
   `KeyboardState`: `{ isVisible, height, progress, animationDuration, screenY? }`.
+  The optional focus flag resets state when false and re-reads current keyboard
+  metrics when true.
 - `useKeyboardAnimation()` returns `{ progress: Animated.Value,
 animationDuration }`.
 - `useFocusedInput()` returns `{ focusedInput, refresh }`; the layout is

package/docs/ios.md

@@ -7,6 +7,11 @@ temporary scroll range, so safe-area-constrained viewports do not blindly add
 the full keyboard height. The library does not set safe-area, navigation, or
 modal presentation configuration.
 
+An absolutely positioned `KeyboardAwareView` uses the same keyboard frame and
+event duration to animate a sticky footer above the keyboard. Place it outside
+the scroll view and account for its height in the scroll view's content padding
+and `keyboardSpacing`.
+
 ## Device checklist
 
 - Test iPhone and iPad layouts with safe areas and the home indicator.

package/docs/troubleshooting.md

@@ -9,6 +9,14 @@
 - If a custom input wrapper delays focus, call `refresh()` from
   `useFocusedInput` after its layout settles.
 
+## A sticky submit button is behind the keyboard
+
+Wrap the footer in `KeyboardAwareView` and set `position: 'absolute'` on that
+component's style. The view then measures its bottom edge and moves above the
+keyboard by the covered distance plus `keyboardSpacing`. Keep it outside the
+scroll view and give the scroll content enough bottom padding to scroll above
+the footer.
+
 ## Android content is moved twice
 
 Use `adjustResize` as the standard window mode and avoid adding a second
@@ -34,3 +42,30 @@ scroll view both respond to the same keyboard state; disable one with
 Place the scroll view inside the modal content and verify the modal's measured
 window frame. Presentation styles and window insets vary; test on the target
 platform rather than assuming the main screen's coordinates apply to a modal.
+
+## A navigation screen returns with stale keyboard spacing
+
+The shared keyboard state is reset when its last subscriber unmounts and is
+reconciled with `Keyboard.isVisible()` / `Keyboard.metrics()` when subscribers
+mount or the app returns to the foreground. For stack screens that stay mounted,
+pass the route's focus state to both aware components:
+
+```tsx
+const isFocused = useIsFocused();
+
+<KeyboardAwareScrollView isFocused={isFocused}>...</KeyboardAwareScrollView>
+<KeyboardAwareView isFocused={isFocused}>...</KeyboardAwareView>
+```
+
+`useIsFocused` comes from React Navigation; the toolkit itself does not require
+that package. Verify the lifecycle manually:
+
+1. Open the navigation regression demo, focus the Screen A input, and wait for
+   the scroll padding and sticky action to move.
+2. Press **Dismiss + open Screen B**, then **Go back to Screen A** without
+   focusing another input. The keyboard height and spacing should be zero.
+3. Repeat with a rapid navigation press and, on iOS, a cancelled swipe-back.
+4. Background and foreground the app while the keyboard is open; verify offsets
+   reflect the keyboard state after returning.
+5. Rotate the device or resize an Android split-screen window and check that
+   layout measurements are recalculated.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-native-keyboard-toolkit",
-  "version": "1.0.0",
-  "description": "Keyboard-aware ScrollView, keyboard avoiding view, input focus navigation, and keyboard state hooks for React Native on iOS and Android.",
+  "version": "1.0.2",
+  "description": "Keyboard-aware scrolling, views, sticky form actions, and keyboard hooks for React Native on iOS and Android.",
   "author": "Denish Dabhi <dabhidenish57@gmail.com>",
   "license": "MIT",
   "homepage": "https://github.com/DenishDabhi/react-native-keyboard-toolkit#readme",
@@ -44,7 +44,9 @@
     "android",
     "typescript",
     "keyboard-dismiss",
-    "keyboard-handling"
+    "keyboard-handling",
+    "sticky-button",
+    "sticky-footer"
   ],
   "publishConfig": {
     "access": "public"
@@ -67,8 +69,6 @@
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
-    "@babel/preset-env": "^7.25.3",
-    "@babel/runtime": "^7.25.0",
     "@react-native-community/cli": "20.2.0",
     "@react-native-community/cli-platform-android": "20.2.0",
     "@react-native-community/cli-platform-ios": "20.2.0",

package/src/components/KeyboardAwareScrollView.tsx

@@ -28,6 +28,7 @@ export const KeyboardAwareScrollView: React.ForwardRefExoticComponent<
       behavior = 'smart',
       keyboardSpacing = DEFAULT_KEYBOARD_SPACING,
       enabled = true,
+      isFocused,
       contentContainerStyle,
       onScroll,
       onScrollBeginDrag,
@@ -39,7 +40,7 @@ export const KeyboardAwareScrollView: React.ForwardRefExoticComponent<
     },
     forwardedRef,
   ): React.JSX.Element {
-    const keyboard = useKeyboardState();
+    const keyboard = useKeyboardState({ isFocused });
     const debug = useKeyboardDebug();
     const scrollRef = useRef<KeyboardAwareScrollViewRef>(null);
     useImperativeHandle(forwardedRef, () => scrollRef.current!, []);

package/src/components/KeyboardAwareView.tsx

@@ -6,14 +6,17 @@ import React, {
   useRef,
   useState,
 } from 'react';
-import { StyleSheet, View } from 'react-native';
+import { Animated, StyleSheet } from 'react-native';
 import type { KeyboardAwareViewProps } from '../types';
 import type { KeyboardAwareViewRef } from '../types';
 import { DEFAULT_KEYBOARD_SPACING } from '../utils/constants';
 import { useKeyboardState } from '../hooks/useKeyboardState';
-import { calculateKeyboardOverlap } from '../utils/scrollManager';
+import {
+  calculateKeyboardDisplacement,
+  calculateKeyboardOverlap,
+} from '../utils/scrollManager';
 
-/** A lightweight view that adds bottom space while the keyboard is visible. */
+/** Adds keyboard spacing to in-flow content and keeps absolute footers visible. */
 export const KeyboardAwareView: React.ForwardRefExoticComponent<
   KeyboardAwareViewProps & React.RefAttributes<KeyboardAwareViewRef>
 > = forwardRef<KeyboardAwareViewRef, KeyboardAwareViewProps>(
@@ -22,18 +25,25 @@ export const KeyboardAwareView: React.ForwardRefExoticComponent<
       behavior = 'smart',
       keyboardSpacing = DEFAULT_KEYBOARD_SPACING,
       enabled = true,
+      isFocused,
       style,
       onLayout,
       ...props
     },
     forwardedRef,
   ): React.JSX.Element {
-    const keyboard = useKeyboardState();
+    const keyboard = useKeyboardState({ isFocused });
     const viewRef = useRef<KeyboardAwareViewRef>(null);
     useImperativeHandle(forwardedRef, () => viewRef.current!, []);
     const measurementSequence = useRef(0);
     const [keyboardOverlap, setKeyboardOverlap] = useState(0);
+    const [keyboardDisplacement, setKeyboardDisplacement] = useState(0);
+    const animatedDisplacement = useRef(new Animated.Value(0)).current;
     const flattenedStyle = StyleSheet.flatten(style);
+    const isAbsolutelyPositioned = flattenedStyle?.position === 'absolute';
+    const spacing = Number.isFinite(keyboardSpacing)
+      ? Math.max(0, keyboardSpacing)
+      : 0;
     const basePadding =
       typeof flattenedStyle?.paddingBottom === 'number'
         ? flattenedStyle.paddingBottom
@@ -49,26 +59,69 @@ export const KeyboardAwareView: React.ForwardRefExoticComponent<
         if (sequence !== measurementSequence.current || !keyboard.isVisible) {
           return;
         }
-        setKeyboardOverlap(
-          calculateKeyboardOverlap(
-            { y, height },
-            keyboard.height,
-            keyboard.screenY,
-          ),
+        if (!isAbsolutelyPositioned) {
+          setKeyboardOverlap(
+            calculateKeyboardOverlap(
+              { y, height },
+              keyboard.height,
+              keyboard.screenY,
+            ),
+          );
+        }
+        setKeyboardDisplacement(
+          isAbsolutelyPositioned && typeof keyboard.screenY === 'number'
+            ? calculateKeyboardDisplacement(
+                { y, height },
+                keyboard.screenY,
+                spacing,
+              )
+            : 0,
         );
       });
-    }, [keyboard.height, keyboard.isVisible, keyboard.screenY]);
+    }, [
+      isAbsolutelyPositioned,
+      keyboard.height,
+      keyboard.isVisible,
+      keyboard.screenY,
+      spacing,
+    ]);
 
     useEffect(() => {
       if (!keyboard.isVisible) {
         measurementSequence.current += 1;
         setKeyboardOverlap(0);
+        setKeyboardDisplacement(0);
         return;
       }
       const frame = requestAnimationFrame(measureOverlap);
       return () => cancelAnimationFrame(frame);
     }, [keyboard.isVisible, keyboard.height, keyboard.screenY, measureOverlap]);
 
+    const shouldAdjust =
+      enabled &&
+      keyboard.isVisible &&
+      behavior !== 'none' &&
+      behavior !== 'resize';
+    useEffect(() => {
+      if (!isAbsolutelyPositioned) {
+        animatedDisplacement.setValue(0);
+        return;
+      }
+      const animation = Animated.timing(animatedDisplacement, {
+        toValue: shouldAdjust ? -keyboardDisplacement : 0,
+        duration: keyboard.animationDuration,
+        useNativeDriver: true,
+      });
+      animation.start();
+      return () => animation.stop();
+    }, [
+      animatedDisplacement,
+      isAbsolutelyPositioned,
+      keyboard.animationDuration,
+      keyboardDisplacement,
+      shouldAdjust,
+    ]);
+
     const handleLayout = useCallback(
       (event: Parameters<NonNullable<typeof onLayout>>[0]) => {
         onLayout?.(event);
@@ -76,30 +129,38 @@ export const KeyboardAwareView: React.ForwardRefExoticComponent<
       },
       [measureOverlap, onLayout],
     );
-    const adjust =
-      enabled &&
-      keyboard.isVisible &&
-      behavior !== 'none' &&
-      behavior !== 'resize' &&
+    const adjustPadding =
+      shouldAdjust &&
+      !isAbsolutelyPositioned &&
       keyboardOverlap > 0 &&
       typeof flattenedStyle?.paddingBottom !== 'string';
+    const stickyTransform = isAbsolutelyPositioned
+      ? [
+          ...(Array.isArray(flattenedStyle?.transform)
+            ? flattenedStyle.transform
+            : []),
+          { translateY: animatedDisplacement },
+        ]
+      : undefined;
 
     return (
-      <View
+      <Animated.View
         {...props}
         ref={viewRef}
         onLayout={handleLayout}
         style={
-          adjust
+          adjustPadding
             ? [
                 style,
                 {
                   paddingBottom: Math.max(
                     basePadding,
-                    keyboardOverlap + Math.max(0, keyboardSpacing),
+                    keyboardOverlap + spacing,
                   ),
                 },
               ]
+            : isAbsolutelyPositioned
+            ? [style, { transform: stickyTransform }]
             : style
         }
       />