React Native External Keyboard

Native-first React Native toolkit for physical (external) keyboard support on iOS and Android — focus management, key-press events, custom focus order, and focus locking.

• 🎯 Keyboard focus management — focus/blur events, autoFocus, imperative focus via ref
• ⌨️ Key press events — handle key-down / key-up with full modifier info
• 🔢 Custom focus order — link-based, index-based, or direction locking
• 🔒 Focus lock — keep focus inside modals and overlays (Focus.Frame / Focus.Trap)
• 🎨 Native focus styling — iOS halo effect & tintColor, Android defaultFocusHighlightEnabled
• ⚡ New Architecture · Old Architecture · Bridgeless · Expo prebuild

Tip

The quickest start is the K namespace — K.Pressable, K.View, and K.Input are drop-in, keyboard-focusable versions of Pressable, View, and TextInput. To add focus to a component you already have (a custom button, TouchableOpacity, …), reach for the withKeyboardFocus HOC. See the getting started guide.

Note

On iOS, long-pressing the spacebar does not fire a long press — iOS routes it through Full Keyboard Access. Use Tab + M (the default "open context menu" command) instead.

Installation

npm install react-native-external-keyboard
cd ios && pod install

Get started with the getting started guide or jump straight to the component overview.

Quick start

Use the K namespace — K.Pressable, K.View, and K.Input are ready-made, keyboard-focusable replacements for Pressable, View, and TextInput:

import { K } from 'react-native-external-keyboard';
import { Text } from 'react-native';

<K.Pressable
  autoFocus
  onPress={onPress}
  focusStyle={{ backgroundColor: 'dodgerblue' }}
>
  <Text>Press me with Space or Enter</Text>
</K.Pressable>

Need focus on a component the K namespace doesn't cover — TouchableOpacity, a custom button, a third-party component? Wrap it with the withKeyboardFocus HOC:

import { withKeyboardFocus } from 'react-native-external-keyboard';
import { TouchableOpacity } from 'react-native';

const KeyboardTouchable = withKeyboardFocus(TouchableOpacity);

Architecture support

Capability	Supported
New Architecture (Fabric / Turbo Modules)	✅
Old Architecture (Bridge)	✅
Bridgeless mode	✅
Expo (prebuild / bare)	✅

React Native compatibility

Library version	React Native
1.0.0	≥ 0.80
0.11.0	≤ 0.79

Documentation

New here? Start with the getting started guide, then follow a task-focused guide. The full docs index links everything.

Guides — task-focused walkthroughs

• Pressable focus handling — focus/blur events, focusStyle, render props
• Native focus styling — iOS halo & tintColor, Android focus highlight
• Programmatic focus — ref.focus(), keyboardFocus(), autoFocus
• Keyboard text input — KeyboardExtendedInput, focusType, blurType
• Focus order — link-based, index-based, and direction-lock ordering

Advanced

• Native focus services — native-side focus API & memory service for custom native code

Reference

• Component overview — every component and its props
• API reference — modules, hooks, the imperative ref, shared types
• Migration guide — version-to-version upgrade notes

What's available

Components

Export	Purpose
K.Pressable / K.View / K.Input	Ready-made, keyboard-focusable Pressable / View / TextInput. Start here.
withKeyboardFocus(C)	HOC that adds keyboard focus to any Pressable/Touchable-like component.
KeyboardExtendedView	Focus-aware View for key handling and grouping (also K.View).
KeyboardExtendedInput	TextInput with keyboard focus support (also K.Input).
KeyboardExtendedBaseView	Low-level focusable view (alias ExternalKeyboardView).
KeyboardFocusGroup	iOS focusGroupIdentifier grouping + global tintColor.
Focus.Frame / Focus.Trap	Confine focus to a region (modals, overlays).
KeyboardOrderFocusGroup	Namespacing + index-based focus ordering.

API

Export	Purpose
Keyboard	Dismiss the soft keyboard from a hardware keyboard.
KeyboardFocus ref	Imperative focus handle (focus, keyboardFocus, screenReaderFocus).
Hooks	useIsViewFocused, useOrderFocusGroup.
Focus-order props	orderId, order*, orderIndex, orderGroup, lockFocus.

---

Roadmap

All planned features are implemented and released. No new functionality or API changes are planned.

Future work is limited to:

• React Native version support (new releases)
• Bug fixes and issue resolution

Both active versions receive fixes:

Version	React Native	Status
1.0.0	≥ 0.80	Active — bug fixes and new RN support
0.11.0	≤ 0.79	Active — bug fixes only

---

Contributing

Any type of contribution is highly appreciated. Feel free to create PRs, raise issues, or share ideas — see the contributing guide for the development workflow.

Acknowledgements

It has been a long journey since the first release of the react-native-external-keyboard package. Many features have been added, and a lot of issues have been fixed.

With that, I would like to thank the contributors, those who created issues, and the followers, because achieving these results wouldn't have been possible without you.

Thanks to the initial authors: Andrii Koval, Michail Chavkin, Dzmitry Khamitsevich.

Thanks to the contributors: João Mosmann, Stéphane.

Thanks to those who created issues: Stéphane, proohit, Rananjaya Bandara, SteveHoneckPGE, Wes.

I really appreciate your help; it has truly helped me move forward!

License

MIT

---

Made with create-react-native-library