react-native-keyboard-controller 1.17.1 → 1.17.3

package/src/animated.tsx

@@ -56,29 +56,29 @@ type KeyboardProviderProps = {
    * or `StatusBar` component from `react-native`, you can ignore it.
    * Defaults to `false`.
    *
-   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/14
    * @platform android
+   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/14
    */
   statusBarTranslucent?: boolean;
   /**
    * Set the value to `true`, if you use translucent navigation bar on Android.
    * Defaults to `false`.
    *
-   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/119
    * @platform android
+   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/119
    */
   navigationBarTranslucent?: boolean;
   /**
    * A boolean property indicating whether to keep edge-to-edge mode always enabled (even when you disable the module).
    * Defaults to `false`.
    *
-   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/592
    * @platform android
+   * @see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/592
    */
   preserveEdgeToEdge?: boolean;
   /**
-   * A boolean prop indicating whether the module is enabled. It indicate only initial state,
-   * i. e. if you try to change this prop after component mount it will not have any effect.
+   * A boolean prop indicating whether the module is enabled. It indicate only initial state
+   * (if you try to change this prop after component mount it will not have any effect).
    * To change the property in runtime use `useKeyboardController` hook and `setEnabled` method.
    * Defaults to `true`.
    */
@@ -89,13 +89,28 @@ type KeyboardProviderProps = {
 // see https://github.com/kirillzyusko/react-native-keyboard-controller/issues/393 and https://github.com/kirillzyusko/react-native-keyboard-controller/issues/294 for more details
 const OS = Platform.OS;
 
-export const KeyboardProvider = ({
-  children,
-  statusBarTranslucent,
-  navigationBarTranslucent,
-  preserveEdgeToEdge,
-  enabled: initiallyEnabled = true,
-}: KeyboardProviderProps) => {
+/**
+ * A component that wrap your app. Under the hood it works with {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller-view|KeyboardControllerView} to receive events during keyboard movements,
+ * maps these events to `Animated`/`Reanimated` values and store them in context.
+ *
+ * @param props - Provider props, such as `statusBarTranslucent`, `navigationBarTranslucent`, etc.
+ * @returns A component that should be mounted in root of your App layout.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-provider|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * <KeyboardProvider>
+ *   <NavigationContainer />
+ * </KeyboardProvider>
+ * ```
+ */
+export const KeyboardProvider = (props: KeyboardProviderProps) => {
+  const {
+    children,
+    statusBarTranslucent,
+    navigationBarTranslucent,
+    preserveEdgeToEdge,
+    enabled: initiallyEnabled = true,
+  } = props;
   // ref
   const viewTagRef = useRef<React.Component<KeyboardControllerProps>>(null);
   // state

package/src/bindings.ts

@@ -21,6 +21,15 @@ export const KeyboardControllerNative: KeyboardControllerNativeModule = {
   addListener: NOOP,
   removeListeners: NOOP,
 };
+/**
+ * An event emitter that provides a way to subscribe to next keyboard events:
+ * - `keyboardWillShow`;
+ * - `keyboardDidShow`;
+ * - `keyboardWillHide`;
+ * - `keyboardDidHide`.
+ *
+ * Use `addListener` function to add your event listener for a specific keyboard event.
+ */
 export const KeyboardEvents: KeyboardEventsModule = {
   addListener: () => ({ remove: NOOP } as EmitterSubscription),
 };
@@ -34,8 +43,18 @@ export const FocusedInputEvents: FocusedInputEventsModule = {
 export const WindowDimensionsEvents: WindowDimensionsEventsModule = {
   addListener: () => ({ remove: NOOP } as EmitterSubscription),
 };
+/**
+ * A view that sends events whenever keyboard or focused events are happening.
+ *
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller-view|Documentation} page for more details.
+ */
 export const KeyboardControllerView =
   View as unknown as React.FC<KeyboardControllerProps>;
+/**
+ * A view that defines a region on the screen, where gestures will control the keyboard position.
+ *
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-gesture-area|Documentation} page for more details.
+ */
 export const KeyboardGestureArea =
   View as unknown as React.FC<KeyboardGestureAreaProps>;
 export const RCTOverKeyboardView =

package/src/components/KeyboardAvoidingView/index.tsx

@@ -62,8 +62,17 @@ const defaultLayout: LayoutRectangle = {
 };
 
 /**
- * View that moves out of the way when the keyboard appears by automatically
- * adjusting its height, position, or bottom padding.
+ * A View component that automatically adjusts its height, position, or bottom padding
+ * when the keyboard appears to ensure that the content remains visible.
+ *
+ * @returns A View component that adjusts to keyboard visibility.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-avoiding-view|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * <KeyboardAvoidingView behavior="padding">
+ *   <TextInput />
+ * </KeyboardAvoidingView>
+ * ```
  */
 const KeyboardAvoidingView = forwardRef<
   View,
@@ -136,12 +145,13 @@ const KeyboardAvoidingView = forwardRef<
       const translateY = interpolateToRelativeKeyboardHeight(translate.value);
       const paddingBottom = interpolateToRelativeKeyboardHeight(padding.value);
       const bottomHeight = enabled ? bottom : 0;
+      const height = frame.value.height - bottomHeight;
 
       switch (behavior) {
         case "height":
-          if (!keyboard.isClosed.value) {
+          if (!keyboard.isClosed.value && height > 0) {
             return {
-              height: frame.value.height - bottomHeight,
+              height,
               flex: 0,
             };
           }

package/src/components/KeyboardAwareScrollView/index.tsx

@@ -1,6 +1,7 @@
-import React, { forwardRef, useCallback, useMemo } from "react";
+import React, { forwardRef, useCallback, useEffect, useMemo } from "react";
 import Reanimated, {
   interpolate,
+  runOnUI,
   scrollTo,
   useAnimatedReaction,
   useAnimatedRef,
@@ -35,51 +36,66 @@ export type KeyboardAwareScrollViewProps = {
   bottomOffset?: number;
   /** Prevents automatic scrolling of the `ScrollView` when the keyboard gets hidden, maintaining the current screen position. Default is `false`. */
   disableScrollOnKeyboardHide?: boolean;
-  /** Controls whether this `KeyboardAwareScrollView` instance should take effect. Default is `true` */
+  /** Controls whether this `KeyboardAwareScrollView` instance should take effect. Default is `true`. */
   enabled?: boolean;
-  /** Adjusting the bottom spacing of KeyboardAwareScrollView. Default is `0` */
+  /** Adjusting the bottom spacing of KeyboardAwareScrollView. Default is `0`. */
   extraKeyboardSpace?: number;
-  /** Custom component for `ScrollView`. Default is `ScrollView` */
+  /** Custom component for `ScrollView`. Default is `ScrollView`. */
   ScrollViewComponent?: React.ComponentType<ScrollViewProps>;
 } & ScrollViewProps;
 
-/*
- * 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
+// 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`)     +
+// +============================+       +============================+        +=====================================+
+//
+
+/**
+ * A ScrollView component that automatically handles keyboard appearance and disappearance
+ * by adjusting its content position to ensure the focused input remains visible.
  *
- * 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`)     +
- * +============================+       +============================+        +=====================================+
+ * The component uses a sophisticated animation system to smoothly handle keyboard transitions
+ * and maintain proper scroll position during keyboard interactions.
  *
+ * @returns A ScrollView component that handles keyboard interactions.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-aware-scroll-view|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * <KeyboardAwareScrollView bottomOffset={20}>
+ *   <TextInput placeholder="Enter text" />
+ *   <TextInput placeholder="Another input" />
+ * </KeyboardAwareScrollView>
+ * ```
  */
 const KeyboardAwareScrollView = forwardRef<
   ScrollView,
@@ -133,7 +149,7 @@ const KeyboardAwareScrollView = forwardRef<
     );
 
     /**
-     * Function that will scroll a ScrollView as keyboard gets moving
+     * Function that will scroll a ScrollView as keyboard gets moving.
      */
     const maybeScroll = useCallback(
       (e: number, animated: boolean = false) => {
@@ -342,6 +358,10 @@ const KeyboardAwareScrollView = forwardRef<
       [maybeScroll, disableScrollOnKeyboardHide, syncKeyboardFrame],
     );
 
+    useEffect(() => {
+      runOnUI(maybeScroll)(keyboardHeight.value, true);
+    }, [bottomOffset]);
+
     useAnimatedReaction(
       () => input.value,
       (current, previous) => {

package/src/components/KeyboardAwareScrollView/useSmoothKeyboardHandler.ts

@@ -28,7 +28,23 @@ const TELEGRAM_ANDROID_TIMING_CONFIG = {
 
 /**
  * Hook that uses default transitions for iOS and Android > 11, and uses
- * custom interpolation on Android < 11 to achieve more smooth animation
+ * custom interpolation on Android < 11 to achieve more smooth animation.
+ *
+ * @param handler - Object containing keyboard event handlers.
+ * @param [deps] - Dependencies array for the effect.
+ * @example
+ * ```ts
+ * useSmoothKeyboardHandler(
+ *   {
+ *     onStart: (e) => {
+ *       "worklet";
+ *
+ *       // your handler for keyboard start
+ *     },
+ *   },
+ *   [],
+ * );
+ * ```
  */
 export const useSmoothKeyboardHandler: typeof useKeyboardHandler = (
   handler,

package/src/components/KeyboardStickyView/index.tsx

@@ -20,10 +20,23 @@ export type KeyboardStickyViewProps = {
     opened?: number;
   };
 
-  /** Controls whether this `KeyboardStickyView` instance should take effect. Default is `true` */
+  /** Controls whether this `KeyboardStickyView` instance should take effect. Default is `true`. */
   enabled?: boolean;
 } & ViewProps;
 
+/**
+ * A View component that sticks to the keyboard and moves with it when it appears or disappears.
+ * The view can be configured with custom offsets for both closed and open keyboard states.
+ *
+ * @returns An animated View component that sticks to the keyboard.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-sticky-view|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * <KeyboardStickyView offset={{ closed: 0, opened: 20 }}>
+ *   <Button title="Submit" />
+ * </KeyboardStickyView>
+ * ```
+ */
 const KeyboardStickyView = forwardRef<
   View,
   React.PropsWithChildren<KeyboardStickyViewProps>

package/src/components/KeyboardToolbar/index.tsx

@@ -59,6 +59,9 @@ export type KeyboardToolbarProps = Omit<
    * A value for container opacity in hexadecimal format (e.g. `ff`). Default value is `ff`.
    */
   opacity?: HEX;
+  /**
+   * A object containing `left`/`right` properties. Used to specify proper container padding in landscape mode.
+   */
   insets?: SafeAreaInsets;
 } & Pick<KeyboardStickyViewProps, "offset" | "enabled">;
 
@@ -72,26 +75,35 @@ const KEYBOARD_TOOLBAR_HEIGHT = 42;
 const DEFAULT_OPACITY: HEX = "FF";
 
 /**
- * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` and
- * `Done` buttons.
+ * `KeyboardToolbar` is a component that is shown above the keyboard with `Prev`/`Next` buttons from left and
+ * `Done` button from the right (to dismiss the keyboard). Allows to add customizable content (yours UI elements) in the middle.
+ *
+ * @param props - Component props.
+ * @returns A component that is shown above the keyboard with `Prev`/`Next` and `Done` buttons.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/components/keyboard-toolbar|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * <KeyboardToolbar doneText="Close" />
+ * ```
  */
-const KeyboardToolbar: React.FC<KeyboardToolbarProps> = ({
-  content,
-  theme = colors,
-  doneText = "Done",
-  button,
-  icon,
-  showArrows = true,
-  onNextCallback,
-  onPrevCallback,
-  onDoneCallback,
-  blur = null,
-  opacity = DEFAULT_OPACITY,
-  offset: { closed = 0, opened = 0 } = {},
-  enabled = true,
-  insets,
-  ...rest
-}) => {
+const KeyboardToolbar: React.FC<KeyboardToolbarProps> = (props) => {
+  const {
+    content,
+    theme = colors,
+    doneText = "Done",
+    button,
+    icon,
+    showArrows = true,
+    onNextCallback,
+    onPrevCallback,
+    onDoneCallback,
+    blur = null,
+    opacity = DEFAULT_OPACITY,
+    offset: { closed = 0, opened = 0 } = {},
+    enabled = true,
+    insets,
+    ...rest
+  } = props;
   const colorScheme = useColorScheme();
   const [inputs, setInputs] = useState({
     current: 0,

package/src/context.ts

@@ -10,20 +10,37 @@ import type React from "react";
 import type { SharedValue } from "react-native-reanimated";
 
 export type AnimatedContext = {
+  /**
+   * A value between `0` and `1` indicating keyboard position, where `0` means keyboard is closed and `1` means keyboard is fully visible.
+   * Represented as `Animated.Value`.
+   */
   progress: Animated.Value;
+  /** Height of the keyboard. Represented as `Animated.Value`. */
   height: Animated.AnimatedMultiplication<number>;
 };
 export type ReanimatedContext = {
+  /**
+   * A value between `0` and `1` indicating keyboard position, where `0` means keyboard is closed and `1` means keyboard is fully visible.
+   * Represented as `SharedValue`.
+   */
   progress: SharedValue<number>;
+  /** Height of the keyboard. Represented as `SharedValue`. */
   height: SharedValue<number>;
 };
 export type KeyboardAnimationContext = {
+  /** Whether KeyboardController library is active or not. */
   enabled: boolean;
+  /** Object that stores animated values that reflect the keyboard’s current position and movement. */
   animated: AnimatedContext;
+  /** Object that stores reanimated values that reflect the keyboard’s current position and movement. */
   reanimated: ReanimatedContext;
+  /** Layout of the focused `TextInput` represented as `SharedValue`. */
   layout: SharedValue<FocusedInputLayoutChangedEvent | null>;
+  /** Method for setting workletized keyboard handlers. */
   setKeyboardHandlers: (handlers: KeyboardHandler) => () => void;
+  /** Method for setting workletized handlers for tracking focused input events. */
   setInputHandlers: (handlers: FocusedInputHandler) => () => void;
+  /** Method to enable/disable KeyboardController library. */
   setEnabled: React.Dispatch<React.SetStateAction<boolean>>;
 };
 const NOOP = () => {};
@@ -57,6 +74,22 @@ const defaultContext: KeyboardAnimationContext = {
 };
 
 export const KeyboardContext = createContext(defaultContext);
+
+/**
+ * A hook that returns a reference to {@link KeyboardAnimationContext} object.
+ *
+ * @returns Object {@link KeyboardAnimationContext|containing} keyboard-controller context.
+ * @example
+ * ```ts
+ *   const context = useKeyboardContext();
+ *
+ *   useLayoutEffect(() => {
+ *     const cleanup = context.setInputHandlers(handler);
+ *
+ *     return () => cleanup();
+ *   }, deps);
+ * ```
+ */
 export const useKeyboardContext = () => {
   const context = useContext(KeyboardContext);
 

package/src/hooks/index.ts

@@ -8,6 +8,20 @@ import type { AnimatedContext, ReanimatedContext } from "../context";
 import type { FocusedInputHandler, KeyboardHandler } from "../types";
 import type { DependencyList } from "react";
 
+/**
+ * Hook that sets the Android soft input mode to adjust resize on mount and
+ * restores default mode on unmount. This ensures the keyboard behavior is consistent
+ * on all Android versions.
+ *
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/keyboard-controller#setinputmode-|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   useResizeMode();
+ *   return <View />;
+ * }
+ * ```
+ */
 export const useResizeMode = () => {
   useEffect(() => {
     KeyboardController.setInputMode(
@@ -18,6 +32,20 @@ export const useResizeMode = () => {
   }, []);
 };
 
+/**
+ * Hook that provides animated (`height`/`progress`) values for tracking keyboard movement.
+ * Automatically sets the resize mode for Android.
+ *
+ * @returns Object {@link AnimatedContext|containing} animated values for keyboard movement.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-keyboard-animation|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { height, progress } = useKeyboardAnimation();
+ *   return <Animated.View style={{ transform: [{ translateY: height }] }} />;
+ * }
+ * ```
+ */
 export const useKeyboardAnimation = (): AnimatedContext => {
   useResizeMode();
   const context = useKeyboardContext();
@@ -25,6 +53,20 @@ export const useKeyboardAnimation = (): AnimatedContext => {
   return context.animated;
 };
 
+/**
+ * Hook that provides reanimated (`height`/`progress`) values for tracking keyboard movement.
+ * Automatically sets the resize mode for Android.
+ *
+ * @returns Object {@link ReanimatedContext|containing} reanimated values for keyboard movement.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-reanimated-keyboard-animation|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { height, progress } = useReanimatedKeyboardAnimation();
+ *   return <Reanimated.View style={{ transform: [{ translateY: height }] }} />;
+ * }
+ * ```
+ */
 export const useReanimatedKeyboardAnimation = (): ReanimatedContext => {
   useResizeMode();
   const context = useKeyboardContext();
@@ -32,6 +74,37 @@ export const useReanimatedKeyboardAnimation = (): ReanimatedContext => {
   return context.reanimated;
 };
 
+/**
+ * An alternative to {@link useKeyboardHandler} that doesn't set resize mode on mount. If your
+ * app already uses `adjustResize`, then you can use this hook instead of `useKeyboardHandler`.
+ *
+ * @param handler - Object containing keyboard event handlers.
+ * @param [deps] - Dependencies array for the effect.
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const height = useSharedValue(0);
+ *   const progress = useSharedValue(0);
+ *
+ *   useGenericKeyboardHandler({
+ *     onMove: (e) => {
+ *       "worklet";
+ *
+ *       height.value = e.height;
+ *       progress.value = e.progress;
+ *     },
+ *     onEnd: (e) => {
+ *       "worklet";
+ *
+ *       height.value = e.height;
+ *       progress.value = e.progress;
+ *     },
+ *   }, []);
+ *
+ *   return <Reanimated.View style={{ height: height }] }} />;
+ * }
+ * ```
+ */
 export function useGenericKeyboardHandler(
   handler: KeyboardHandler,
   deps?: DependencyList,
@@ -45,6 +118,37 @@ export function useGenericKeyboardHandler(
   }, deps);
 }
 
+/**
+ * Hook that gives an access to each aspect of keyboard movement with workletized `onStart`/`onMove`/`onInteractive`/`onEnd` handlers.
+ *
+ * @param handler - Object containing keyboard event handlers.
+ * @param [deps] - Dependencies array for the effect.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/keyboard/use-keyboard-handler|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const height = useSharedValue(0);
+ *   const progress = useSharedValue(0);
+ *
+ *   useKeyboardHandler({
+ *     onMove: (e) => {
+ *       "worklet";
+ *
+ *       height.value = e.height;
+ *       progress.value = e.progress;
+ *     },
+ *     onEnd: (e) => {
+ *       "worklet";
+ *
+ *       height.value = e.height;
+ *       progress.value = e.progress;
+ *     },
+ *   }, []);
+ *
+ *   return <Reanimated.View style={{ height: height }] }} />;
+ * }
+ * ```
+ */
 export function useKeyboardHandler(
   handler: KeyboardHandler,
   deps?: DependencyList,
@@ -53,18 +157,71 @@ export function useKeyboardHandler(
   useGenericKeyboardHandler(handler, deps);
 }
 
+/**
+ * Hook for controlling keyboard controller module.
+ * Allows to disable/enable it and check the actual state (whether it's enabled or not).
+ * When disabled it fallbacks to default android keyboard handling and stops tracking all
+ * the events that are exposed from this library.
+ *
+ * @property {Function} setEnabled - Function to enable/disable keyboard handling.
+ * @property {boolean} enabled - Current enabled state.
+ * @returns Object containing keyboard control functions and state.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/module/use-keyboard-controller|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { setEnabled, enabled } = useKeyboardController();
+ *   return (
+ *     <Button
+ *       title={enabled ? 'Disable' : 'Enable'}
+ *       onPress={() => setEnabled(!enabled)}
+ *     />
+ *   );
+ * }
+ * ```
+ */
 export function useKeyboardController() {
   const context = useKeyboardContext();
 
   return { setEnabled: context.setEnabled, enabled: context.enabled };
 }
 
+/**
+ * Hook that provides access to the layout of the currently focused input.
+ *
+ * @returns Object containing reanimated values for focused input.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/input/use-reanimated-focused-input|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { input } = useReanimatedFocusedInput();
+ *   return <Reanimated.View style={{ height: input.value?.layout.height }} />;
+ * }
+ * ```
+ */
 export function useReanimatedFocusedInput() {
   const context = useKeyboardContext();
 
   return { input: context.layout };
 }
 
+/**
+ * Hook for handling focused input events, such as changes of selection, text etc.
+ *
+ * @param handler - Object containing focused input event handlers.
+ * @param [deps] - Dependencies array for the effect.
+ * @see {@link https://kirillzyusko.github.io/react-native-keyboard-controller/docs/api/hooks/input/use-focused-input-handler|Documentation} page for more details.
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   useFocusedInputHandler({
+ *     onChangeText: (e) => console.log('Text changed:', e.text),
+ *     onSelectionChange: (e) => console.log('Selection changed:', e.selection)
+ *   });
+ *   return <View />;
+ * }
+ * ```
+ */
 export function useFocusedInputHandler(
   handler: FocusedInputHandler,
   deps?: DependencyList,