react-native-external-keyboard 0.9.1 → 0.11.1

package/src/types/index.ts

@@ -1,5 +1,35 @@
 export type {
+  FocusViewProps,
   KeyboardFocusViewProps,
-  OnFocusChangeFn,
 } from './KeyboardFocusView.types';
-export type { FocusStateCallbackType, FocusStyle } from './FocusStyle';
+export type { KeyboardFocusLockProps } from './KeyboardFocusLock.types';
+export { LockComponentType } from './KeyboardFocusLock.types';
+export type {
+  OnFocusChangeFn,
+  KeyboardFocus,
+  BaseKeyboardViewType,
+  KeyboardFocusEvent,
+  NativeFocusChangeHandler,
+} from './focus.types';
+export type { OnKeyPress, OnKeyPressFn } from './keyPress.types';
+export type { FocusOrderProps, LockFocusType } from './focusOrder.types';
+export { LockFocusEnum } from './focusOrder.types';
+export type {
+  BaseFocusViewProps,
+  BaseKeyboardViewProps,
+} from './baseKeyboardView.types';
+export type { FocusStateCallbackType, FocusStyle } from './focusStyle.types';
+export type {
+  ExtraKeyboardProps,
+  KeyboardInputProps,
+  KeyboardInputPropsDeclaration,
+} from './keyboardInput.types';
+export type {
+  WithKeyboardFocusProps,
+  WithKeyboardFocusPropsWithRef,
+  KeyboardFocusableComponent,
+  KeyboardFocusableComponentDeclaration,
+  WithKeyboardProps,
+  KeyboardPressType,
+  ChildrenRenderState,
+} from './withKeyboardFocus.types';

package/src/types/keyPress.types.ts

@@ -0,0 +1,8 @@
+import type { NativeSyntheticEvent } from 'react-native';
+import type { KeyPress } from '../nativeSpec/ExternalKeyboardViewNativeComponent';
+
+/** Native event payload for a physical key press (key down / key up). */
+export type OnKeyPress = NativeSyntheticEvent<KeyPress>;
+
+/** Handler receiving a physical {@link OnKeyPress} event. */
+export type OnKeyPressFn = (e: OnKeyPress) => void;

package/src/types/keyboardInput.types.ts

@@ -0,0 +1,81 @@
+import {
+  type TextInputProps,
+  type StyleProp,
+  type ViewStyle,
+} from 'react-native';
+
+import type { FocusStyle } from './focusStyle.types';
+import type { FocusOrderProps } from './focusOrder.types';
+import type { CommonFocusProps } from './baseKeyboardView.types';
+
+/** Keyboard-focus props added on top of React Native's `TextInputProps`. */
+export type ExtraKeyboardProps = {
+  /**
+   * How the input acquires focus.
+   *
+   * - `'default'` — platform default (Android focuses the input; iOS requires a press).
+   * - `'press'` — press the spacebar to focus the input.
+   * - `'auto'` — focus automatically; keyboard focus targets the input.
+   */
+  focusType?: 'default' | 'press' | 'auto';
+  /**
+   * How the input blurs when keyboard focus moves away.
+   *
+   * - `'default'` — keep typing allowed while focus is on another component.
+   * - `'disable'` — blur the input when focus moves away.
+   * - `'auto'` — platform-managed blur behavior.
+   *
+   * @platform ios
+   */
+  blurType?: 'default' | 'disable' | 'auto';
+  /** Style for the container wrapping the input. */
+  containerStyle?: StyleProp<ViewStyle>;
+  /** Called when the input gains or loses keyboard focus. */
+  onFocusChange?: (isFocused: boolean) => void;
+  /** Style applied to the inner `TextInput` while focused. */
+  focusStyle?: FocusStyle;
+  /** Style applied to the container while focused. */
+  containerFocusStyle?: FocusStyle;
+  /** Behavior of the submit / return key. */
+  submitBehavior?: string;
+} & CommonFocusProps &
+  FocusOrderProps;
+
+/**
+ * `TextInput` props that differ across React Native versions and so are loosened
+ * to also accept `null` for backward/forward compatibility.
+ */
+type IgnoreForCompatibility =
+  | 'rejectResponderTermination'
+  | 'selectionHandleColor'
+  | 'cursorColor'
+  | 'maxFontSizeMultiplier';
+
+type CompatibleInputProp<
+  TextInputPropsType extends object,
+  CompatibilityProp extends IgnoreForCompatibility
+> = CompatibilityProp extends keyof TextInputPropsType
+  ? TextInputPropsType[CompatibilityProp]
+  : CompatibilityProp extends keyof TextInputProps
+  ? TextInputProps[CompatibilityProp]
+  : never;
+
+type ReactNativeInputCompatibility<
+  TextInputPropsType extends object = TextInputProps
+> = Omit<TextInputPropsType, IgnoreForCompatibility> & {
+  [CompatibilityProp in IgnoreForCompatibility]?: CompatibleInputProp<
+    TextInputPropsType,
+    CompatibilityProp
+  > | null;
+};
+
+/**
+ * Generic form of {@link KeyboardInputProps}. Combines a (version-compatible)
+ * `TextInputProps` shape with the library's {@link ExtraKeyboardProps}.
+ */
+export type KeyboardInputPropsDeclaration<
+  TextInputPropsType extends object = TextInputProps
+> = ReactNativeInputCompatibility<TextInputPropsType> & ExtraKeyboardProps;
+
+/** Props for `KeyboardExtendedInput` — RN `TextInputProps` plus keyboard-focus props. */
+export type KeyboardInputProps = KeyboardInputPropsDeclaration<TextInputProps>;

package/src/types/withKeyboardFocus.types.ts

@@ -0,0 +1,178 @@
+import type { PressableProps, View, ViewProps } from 'react-native';
+import type { FocusStyle } from './focusStyle.types';
+import type { KeyboardFocus } from './focus.types';
+import type { OnKeyPress } from './keyPress.types';
+import type { FocusViewProps } from './KeyboardFocusView.types';
+import type { RefAttributes } from 'react';
+
+/** Fallback press handler used when the wrapped component declares no matching prop. */
+type KeyboardPressHandler = (e?: OnKeyPress) => void;
+
+/**
+ * Resolves a press-handler prop type: reuses the wrapped component's own signature
+ * if it declares `PropName`, otherwise falls back to {@link KeyboardPressHandler}.
+ */
+type PressHandlerProp<
+  ComponentProps extends object,
+  PropName extends 'onPress' | 'onLongPress' | 'onPressIn' | 'onPressOut'
+> = PropName extends keyof ComponentProps
+  ? ComponentProps[PropName]
+  : KeyboardPressHandler;
+
+/** Picks the wrapped component's prop type for `PropName`, or `unknown` if absent. */
+type PickProp<
+  ComponentProps extends object,
+  PropName extends string
+> = PropName extends keyof ComponentProps ? ComponentProps[PropName] : unknown;
+
+/** A component constructor that {@link WithKeyboardFocusProps} can enhance. */
+export type KeyboardFocusableComponent<ComponentProps extends object> =
+  React.JSXElementConstructor<ComponentProps>;
+
+/**
+ * Press and focus callbacks layered onto the wrapped component. Press handlers reuse
+ * the wrapped component's own signatures where possible; `onComponent{Focus,Blur}`
+ * forward to the wrapped component's native `onFocus` / `onBlur`.
+ */
+export type KeyboardPressType<ComponentProps extends object> = {
+  /** Called on press (touch or physical key). */
+  onPress?: PressHandlerProp<ComponentProps, 'onPress'>;
+  /** Called on long press (touch or physical key). */
+  onLongPress?: PressHandlerProp<ComponentProps, 'onLongPress'>;
+  /** Called when a press begins. */
+  onPressIn?: PressHandlerProp<ComponentProps, 'onPressIn'>;
+  /** Called when a press ends. */
+  onPressOut?: PressHandlerProp<ComponentProps, 'onPressOut'>;
+  /** Forwarded to the wrapped component's own `onFocus`. */
+  onComponentFocus?: PickProp<ComponentProps, 'onFocus'>;
+  /** Forwarded to the wrapped component's own `onBlur`. */
+  onComponentBlur?: PickProp<ComponentProps, 'onBlur'>;
+};
+
+/** Extracts the state argument from a component's children render prop, or `never`. */
+type ExtractRenderPropState<T> = T extends (state: infer S) => any ? S : never;
+
+/** The render-prop state of the wrapped component's `children`, or `never` if it has none. */
+export type ChildrenRenderState<CP extends object> = 'children' extends keyof CP
+  ? ExtractRenderPropState<NonNullable<CP['children']>>
+  : never;
+
+/**
+ * `renderContent` signature — receives the wrapped component's own render-prop state
+ * merged with `{ focused }`. Resolves to `never` when the component has no render-prop children.
+ */
+type RenderContentProp<CP extends object> =
+  ChildrenRenderState<CP> extends never
+    ? never
+    : (
+        state: ChildrenRenderState<CP> & { focused: boolean }
+      ) => React.ReactNode;
+
+/**
+ * `renderFocusable` signature — receives only `{ focused }`. Use it on components
+ * (e.g. `TouchableOpacity`) that don't expose a render-prop `children`.
+ */
+type RenderFocusableProp = (state: { focused: boolean }) => React.ReactNode;
+
+// `renderContent` and `renderFocusable` are conceptually mutually exclusive, but
+// the public slot is kept as a plain (non-discriminated) object so consumer-side
+// `Omit`/`Pick` over the prop type don't collapse a union and break assignability.
+// If both are passed, `renderContent` wins at runtime (see useRenderedChildren).
+// `renderContent` still resolves to `never` for components without render-prop
+// children, so it remains unassignable on those.
+type RenderSlot<CP extends object> = {
+  renderContent?: RenderContentProp<CP>;
+  renderFocusable?: RenderFocusableProp;
+};
+
+type WithKeyboardBaseProps<ViewType, ViewStyleType> = {
+  /**
+   * Enables the `pressed` style handler for custom components. Always effectively
+   * `true` for the standard `Pressable`.
+   *
+   * @default false
+   */
+  withPressedStyle?: boolean;
+  /**
+   * Android only. Physical-keyboard activation (Enter / Space / DPad-center)
+   * does not flow through the touch responder, so the wrapped component's
+   * `pressed` state stays `false` for keyboard presses. When enabled, the
+   * press is tracked from the key down/up events and merged into the `pressed`
+   * value passed to `renderContent` and to the `style({ pressed })` function.
+   * No-op on iOS, where native focus already drives `pressed`.
+   */
+  androidKeyboardPressState?: boolean;
+  /** Style for the container wrapping the component. */
+  containerStyle?: ViewStyleType | ViewProps['style'];
+  /** Style applied to the container while focused. */
+  containerFocusStyle?: FocusStyle;
+  /** Ref to the wrapped component instance. */
+  componentRef?: React.RefObject<ViewType>;
+  /** Style for the wrapped component. */
+  style?: PressableProps['style'];
+  /** Called when the component loses keyboard focus. */
+  onBlur?: (() => void) | null;
+  /** Called when the component gains keyboard focus. */
+  onFocus?: (() => void) | null;
+};
+
+/**
+ * The keyboard-focus-specific props added by {@link WithKeyboardFocusProps}: container
+ * styling, refs, focus callbacks, and the mutually-exclusive `renderContent` /
+ * `renderFocusable` slot.
+ */
+export type WithKeyboardProps<
+  ViewType = View,
+  ViewStyleType = unknown,
+  ComponentProps extends object = {}
+> = WithKeyboardBaseProps<ViewType, ViewStyleType> & RenderSlot<ComponentProps>;
+
+type KeyboardFocusBaseProps = Omit<
+  FocusViewProps,
+  'onPress' | 'onLongPress' | 'onBlur' | 'onFocus'
+>;
+
+type MergeProps<BaseProps extends object, OverrideProps extends object> = Omit<
+  BaseProps,
+  keyof OverrideProps
+> &
+  OverrideProps;
+
+type KeyboardFocusOverrideProps<
+  ComponentProps extends object,
+  ViewStyleType,
+  ViewType = View
+> = KeyboardPressType<ComponentProps> &
+  KeyboardFocusBaseProps &
+  WithKeyboardProps<ViewType, ViewStyleType, ComponentProps>;
+
+/**
+ * Full prop type for a `withKeyboardFocus`-wrapped component: the wrapped component's
+ * own props, with the library's press/focus/order props merged in (library props win
+ * on conflict).
+ */
+export type WithKeyboardFocusProps<
+  ComponentProps extends object,
+  ViewStyleType,
+  ViewType = View
+> = MergeProps<
+  ComponentProps,
+  KeyboardFocusOverrideProps<ComponentProps, ViewStyleType, ViewType>
+>;
+
+/** {@link WithKeyboardFocusProps} plus a `ref` exposing the {@link KeyboardFocus} handle. */
+export type WithKeyboardFocusPropsWithRef<
+  ComponentProps extends object,
+  ViewStyleType,
+  ViewType = View
+> = WithKeyboardFocusProps<ComponentProps, ViewStyleType, ViewType> &
+  RefAttributes<KeyboardFocus>;
+
+/** Type of the component returned by `withKeyboardFocus`. */
+export type KeyboardFocusableComponentDeclaration<
+  ComponentProps extends object,
+  ViewStyleType,
+  ViewType = View
+> = React.JSXElementConstructor<
+  WithKeyboardFocusPropsWithRef<ComponentProps, ViewStyleType, ViewType>
+>;

package/src/utils/mapLockFocus.ts

@@ -0,0 +1,31 @@
+import { LockFocusEnum, type LockFocusType } from '../types';
+
+enum BITS {
+  BIT_01 = 0b1,
+  BIT_02 = 0b10,
+  BIT_03 = 0b100,
+  BIT_04 = 0b1000,
+  BIT_05 = 0b10000,
+  BIT_06 = 0b100000,
+  BIT_07 = 0b1000000,
+  BIT_08 = 0b10000000,
+  BIT_09 = 0b100000000,
+  BIT_10 = 0b1000000000,
+}
+
+const focusBinaryValue: Record<LockFocusEnum, number> = {
+  [LockFocusEnum.Up]: BITS.BIT_01,
+  [LockFocusEnum.Down]: BITS.BIT_02,
+  [LockFocusEnum.Left]: BITS.BIT_03,
+  [LockFocusEnum.Right]: BITS.BIT_04,
+  [LockFocusEnum.Forward]: BITS.BIT_05,
+  [LockFocusEnum.Backward]: BITS.BIT_06,
+  [LockFocusEnum.First]: BITS.BIT_09,
+  [LockFocusEnum.Last]: BITS.BIT_10,
+};
+
+export const mapLockFocus = (values: LockFocusType[] | undefined): number => {
+  if (!values || !values.length) return 0;
+  // eslint-disable-next-line no-bitwise
+  return values.reduce((acc, item) => acc | focusBinaryValue[item], 0);
+};

package/src/utils/useFocusStyle.tsx

@@ -1,36 +1,22 @@
 import { useState, useMemo, useCallback } from 'react';
-import { type ColorValue, type PressableProps, Pressable } from 'react-native';
+import type { PressableProps } from 'react-native';
 import type { FocusStyle } from '../types';
-import type { TintType } from '../types/WithKeyboardFocus';
 
-const backgroundTintMap: Partial<Record<TintType, boolean>> = {
-  background: true,
-};
-
-const DEFAULT_BACKGROUND_TINT = '#dce3f9';
-
-type UseFocusStyleProps<C> = {
+type UseFocusStyleProps = {
   focusStyle?: FocusStyle;
   containerFocusStyle?: FocusStyle;
   onFocusChange?: (isFocused: boolean) => void;
-  tintColor?: ColorValue;
-  tintType?: TintType;
   style?: PressableProps['style'];
-  Component?: React.ComponentType<C>;
-  withPressedStyle?: boolean;
-  defaultFocusHighlightEnabled?: boolean;
+  pressedStyleSignature?: boolean;
 };
 
-export const useFocusStyle = <C extends {}>({
+export const useFocusStyle = ({
   focusStyle,
   onFocusChange,
   containerFocusStyle,
-  tintColor,
-  tintType = 'default',
   style,
-  Component,
-  withPressedStyle = false,
-}: UseFocusStyleProps<C>) => {
+  pressedStyleSignature = false,
+}: UseFocusStyleProps) => {
   const [focused, setFocusStatus] = useState(false);
 
   const onFocusChangeHandler = useCallback(
@@ -47,19 +33,7 @@ export const useFocusStyle = <C extends {}>({
     return focused ? specificStyle : undefined;
   }, [focusStyle, focused]);
 
-  const hoverColor = useMemo(
-    () => ({
-      backgroundColor: tintColor,
-    }),
-    [tintColor]
-  );
-
   const containerFocusedStyle = useMemo(() => {
-    if (backgroundTintMap[tintType] && !containerFocusStyle) {
-      return focused
-        ? { backgroundColor: tintColor ?? DEFAULT_BACKGROUND_TINT }
-        : undefined;
-    }
     if (!containerFocusStyle) return undefined;
 
     const specificStyle =
@@ -68,11 +42,11 @@ export const useFocusStyle = <C extends {}>({
         : containerFocusStyle;
 
     return focused ? specificStyle : undefined;
-  }, [containerFocusStyle, focused, tintColor, tintType]);
+  }, [containerFocusStyle, focused]);
 
-  const dafaultComponentStyle = useMemo(
-    () => [style, componentFocusedStyle],
-    [style, componentFocusedStyle]
+  const defaultComponentStyle = useMemo(
+    () => (pressedStyleSignature ? undefined : [style, componentFocusedStyle]),
+    [pressedStyleSignature, style, componentFocusedStyle]
   );
   const styleHandlerPressable = useCallback(
     ({ pressed }: { pressed: boolean }) => {
@@ -85,17 +59,15 @@ export const useFocusStyle = <C extends {}>({
     [componentFocusedStyle, style]
   );
 
-  const componentStyleViewStyle =
-    Component === Pressable || withPressedStyle
-      ? styleHandlerPressable
-      : dafaultComponentStyle;
+  const componentStyleViewStyle = pressedStyleSignature
+    ? styleHandlerPressable
+    : defaultComponentStyle;
 
   return {
     componentStyleViewStyle,
     componentFocusedStyle,
     containerFocusedStyle,
     onFocusChangeHandler,
-    hoverColor,
     focused,
   };
 };

package/src/utils/useKeyboardFocusContainer.ts

@@ -0,0 +1,102 @@
+import { useCallback, useMemo } from 'react';
+import type { PressableProps } from 'react-native';
+import { useFocusStyle } from './useFocusStyle';
+import { useKeyboardPress } from './useKeyboardPress/useKeyboardPress';
+import { useKeyboardPressState } from './useKeyboardPressState';
+import type { FocusStyle, OnKeyPressFn } from '../types';
+
+type AnyPressHandler = (event?: any) => void;
+
+export type UseKeyboardFocusContainerProps<
+  TPress extends AnyPressHandler = AnyPressHandler,
+  TKeyOnlyPress extends AnyPressHandler = AnyPressHandler
+> = {
+  focusStyle?: FocusStyle;
+  containerFocusStyle?: FocusStyle;
+  onFocusChange?: (isFocused: boolean) => void;
+  style?: PressableProps['style'];
+  pressedStyleSignature?: boolean;
+  onKeyUpPress?: OnKeyPressFn;
+  onKeyDownPress?: OnKeyPressFn;
+  onPress?: TPress;
+  onLongPress?: TPress;
+  onPressIn?: TKeyOnlyPress;
+  onPressOut?: TKeyOnlyPress;
+  triggerCodes?: number[];
+  androidKeyboardPressState?: boolean;
+};
+
+export const useKeyboardFocusContainer = <
+  TPress extends AnyPressHandler = AnyPressHandler,
+  TKeyOnlyPress extends AnyPressHandler = AnyPressHandler
+>({
+  focusStyle,
+  containerFocusStyle,
+  onFocusChange,
+  style,
+  pressedStyleSignature,
+  onKeyUpPress,
+  onKeyDownPress,
+  onPress,
+  onLongPress,
+  onPressIn,
+  onPressOut,
+  triggerCodes,
+  androidKeyboardPressState = false,
+}: UseKeyboardFocusContainerProps<TPress, TKeyOnlyPress>) => {
+  const keyboardPress = useKeyboardPressState({
+    enabled: androidKeyboardPressState,
+    onPressIn,
+    onPressOut,
+    onFocusChange,
+  });
+
+  const {
+    focused,
+    containerFocusedStyle,
+    componentStyleViewStyle,
+    onFocusChangeHandler,
+  } = useFocusStyle({
+    onFocusChange: keyboardPress.onFocusChange,
+    focusStyle,
+    containerFocusStyle,
+    style,
+    pressedStyleSignature,
+  });
+
+  const { onKeyUpPressHandler, onKeyDownPressHandler, onPressHandler } =
+    useKeyboardPress({
+      onKeyUpPress,
+      onKeyDownPress,
+      onPress,
+      onLongPress,
+      onPressIn: keyboardPress.onPressIn as typeof onPressIn,
+      onPressOut: keyboardPress.onPressOut as typeof onPressOut,
+      triggerCodes,
+    });
+
+  const { applyPressedStyle } = keyboardPress;
+  const componentStyle = useMemo(
+    () => applyPressedStyle(componentStyleViewStyle),
+    [applyPressedStyle, componentStyleViewStyle]
+  );
+
+  const onContextMenuHandler = useCallback(() => {
+    onLongPress?.();
+  }, [onLongPress]);
+
+  const enableContextMenu = Boolean(onLongPress);
+
+  return {
+    focused,
+    keyboardPressed: keyboardPress.pressed,
+    containerFocusedStyle,
+    componentStyleViewStyle: componentStyle,
+    onFocusChangeHandler,
+    onKeyUpPressHandler,
+    onKeyDownPressHandler,
+    onPressHandler,
+    onContextMenuHandler,
+    enableContextMenu,
+  };
+};

package/src/utils/useKeyboardPress/useKeyboardPress.android.ts

@@ -1,7 +1,7 @@
 import { useCallback, useMemo, useRef } from 'react';
 import type { GestureResponderEvent } from 'react-native';
 import type { UseKeyboardPressProps } from './useKeyboardPress.types';
-import type { OnKeyPress, OnKeyPressFn } from '../../types/BaseKeyboardView';
+import type { OnKeyPress, OnKeyPressFn } from '../../types';
 
 export const ANDROID_SPACE_KEY_CODE = 62;
 export const ANDROID_DPAD_CENTER_CODE = 23;
@@ -17,7 +17,7 @@ const useDebouncedCallback = <T extends (...args: any[]) => void>(
   callback: T,
   delay: number
 ) => {
-  const timeoutRef = useRef<ReturnType<typeof setTimeout>>(undefined);
+  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   return useCallback(
     (...args: Parameters<T>) => {
       if (timeoutRef.current) clearTimeout(timeoutRef.current);
@@ -40,7 +40,6 @@ export const useKeyboardPress = <
   onPress,
   onLongPress,
   triggerCodes = ANDROID_TRIGGER_CODES,
-  disabled = false,
 }: UseKeyboardPressProps<T, K>) => {
   const isLongPressRef = useRef(false);
 
@@ -65,7 +64,6 @@ export const useKeyboardPress = <
       onPressOut?.(e as unknown as GestureResponderEvent);
       onKeyUpPress?.(e);
 
-      if (disabled) return;
       if (triggerCodes.includes(keyCode)) {
         if (isLongPress) {
           isLongPressRef.current = true;
@@ -73,19 +71,18 @@ export const useKeyboardPress = <
         }
       }
     },
-    [onPressOut, onKeyUpPress, triggerCodes, debouncedOnPress, disabled]
+    [onPressOut, onKeyUpPress, triggerCodes, debouncedOnPress]
   );
 
   const onKeyDownPressHandler = useMemo(() => {
     if (!onPressIn) return onKeyDownPress;
     return (e: OnKeyPress) => {
       onKeyDownPress?.(e);
-      if (disabled) return;
       if (triggerCodes.includes(e.nativeEvent.keyCode)) {
         onPressIn?.(e as unknown as GestureResponderEvent);
       }
     };
-  }, [onKeyDownPress, onPressIn, triggerCodes, disabled]);
+  }, [onKeyDownPress, onPressIn, triggerCodes]);
 
   const onPressHandler = useCallback(
     (event: GestureResponderEvent) => {

package/src/utils/useKeyboardPress/useKeyboardPress.ios.ts

@@ -1,6 +1,6 @@
 import { useMemo } from 'react';
 import type { UseKeyboardPressProps } from './useKeyboardPress.types';
-import type { OnKeyPress } from '../../types/BaseKeyboardView';
+import type { OnKeyPress } from '../../types';
 import type { GestureResponderEvent } from 'react-native';
 
 const IOS_SPACE_KEY = 44;
@@ -19,12 +19,10 @@ export const useKeyboardPress = <
   onPressOut,
   onLongPress,
   triggerCodes = IOS_TRIGGER_CODES,
-  disabled = false,
 }: UseKeyboardPressProps<T, K>) => {
   const onKeyUpPressHandler = useMemo(() => {
     return (e: OnKeyPress) => {
       onKeyUpPress?.(e);
-      if (disabled) return;
 
       if (triggerCodes.includes(e.nativeEvent.keyCode)) {
         onPressOut?.(e);
@@ -35,18 +33,17 @@ export const useKeyboardPress = <
         }
       }
     };
-  }, [onKeyUpPress, onLongPress, onPress, onPressOut, triggerCodes, disabled]);
+  }, [onKeyUpPress, onLongPress, onPress, onPressOut, triggerCodes]);
 
   const onKeyDownPressHandler = useMemo(() => {
     if (!onPressIn) return onKeyDownPress;
     return (e: OnKeyPress) => {
       onKeyDownPress?.(e);
-      if (disabled) return;
       if (triggerCodes.includes(e.nativeEvent.keyCode)) {
         onPressIn?.(e);
       }
     };
-  }, [onKeyDownPress, onPressIn, triggerCodes, disabled]);
+  }, [onKeyDownPress, onPressIn, triggerCodes]);
 
   return {
     onKeyUpPressHandler,

package/src/utils/useKeyboardPress/useKeyboardPress.ts

@@ -1,6 +1,6 @@
 import { useMemo } from 'react';
 import type { UseKeyboardPressProps } from './useKeyboardPress.types';
-import type { OnKeyPress } from '../../types/BaseKeyboardView';
+import type { OnKeyPress } from '../../types';
 
 const IOS_SPACE_KEY = 44;
 const IOS_RETURN_OR_ENTER = 40;
@@ -14,32 +14,34 @@ export const useKeyboardPress = <
   onKeyUpPress,
   onKeyDownPress,
   onPress,
+  onLongPress,
   onPressIn,
   onPressOut,
   triggerCodes = IOS_TRIGGER_CODES,
-  disabled = false,
 }: UseKeyboardPressProps<T, K>) => {
   const onKeyUpPressHandler = useMemo(() => {
-    if (!onPressOut) return onKeyUpPress;
     return (e: OnKeyPress) => {
       onKeyUpPress?.(e);
-      if (disabled) return;
       if (triggerCodes.includes(e.nativeEvent.keyCode)) {
         onPressOut?.(e);
+        if (e.nativeEvent.isLongPress) {
+          onLongPress?.({} as any);
+        } else {
+          onPress?.({} as any);
+        }
       }
     };
-  }, [onKeyUpPress, onPressOut, triggerCodes, disabled]);
+  }, [onKeyUpPress, onLongPress, onPress, onPressOut, triggerCodes]);
 
   const onKeyDownPressHandler = useMemo(() => {
     if (!onPressIn) return onKeyDownPress;
     return (e: OnKeyPress) => {
       onKeyDownPress?.(e);
-      if (disabled) return;
       if (triggerCodes.includes(e.nativeEvent.keyCode)) {
         onPressIn?.(e);
       }
     };
-  }, [onKeyDownPress, onPressIn, triggerCodes, disabled]);
+  }, [onKeyDownPress, onPressIn, triggerCodes]);
 
   return {
     onKeyUpPressHandler,