Skip to content

feat: on key press support#584

Merged
eszlamczyk merged 7 commits into
mainfrom
feat/348/on-key-press-support
Jul 27, 2026
Merged

feat: on key press support#584
eszlamczyk merged 7 commits into
mainfrom
feat/348/on-key-press-support

Conversation

@eszlamczyk

@eszlamczyk eszlamczyk commented Jul 23, 2026

Copy link
Copy Markdown
Collaborator

What/Why?

closes #348

Adds an onKeyPress prop to EnrichedMarkdownTextInput, mirroring React Native TextInput's API

({ nativeEvent: { key }}) => void

BREAKING CHANGE
On Android Plain Tab is now consumed in onKeyDown so it inserts \t and emits Tab like iOS instead of moving focus; Shift/Ctrl+Tab still navigate focus.

Without onKeyPress there was no way to observe a keystroke before it is applied to the input content.

  • nativeEvent.key is the pressed character, or a named key: Backspace, Enter, Tab (iOS additionally reports
    Escape). Paste never fires the event.
  • iOS/macOS emitted from shouldChangeTextInRange / textInputShouldChangeText with RN core's key mapping (empty - Backspace, \n - Enter, \t - Tab, ESC - Escape). The custom paste: override bypasses the delegate, so pastes are excluded by construction.
  • Android's key inference ported from RN's ReactEditTextInputConnectionWrapper into the existing
    InputConnectionWrapper (cursor-movement heuristics for composing text, ≤2-char commits, batch-edit queueing,
    SwiftKey/number-pad sendKeyEvent). .
  • Updated docs (API_REFERENCE.md, INPUT.md).
  • New Storybook story EnrichedMarkdownTextInput -> Props -> Key Press showing the latest pressed keys as chips;
    onKeyPress is also wired into the shared Actions arg types, so all input stories log it.

Testing

  1. Open the example app, Storybook, EnrichedMarkdownTextInput/Props/Key Press.
  2. Type characters, backspace, and enter - chips appear below the input (newest highlighted) and events land in the Actions tab.
  3. With a hardware keyboard, press Tab - a tab character is inserted and Tab is reported on both platforms (Android no
    longer moves focus to the toolbar).
  4. Paste text via the context menu - no key press event fires.

Screenshots

iOS
Screen.Recording.2026-07-23.at.13.49.08.mov
Android
Screen.Recording.2026-07-23.at.13.49.41.mov

PR Checklist

  • Code compiles and runs on iOS
  • Code compiles and runs on Android
  • Updated documentation/README if applicable
  • Ran example app to verify changes
  • E2E tests are passing
  • Required E2E tests have been added (if applicable)

@eszlamczyk eszlamczyk changed the title Feat/348/on key press support feat: on key press support Jul 23, 2026
@eszlamczyk
eszlamczyk requested a review from Copilot July 23, 2026 11:41

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds onKeyPress support to EnrichedMarkdownTextInput, exposing a React Native TextInput-like key press event before edits are applied, with native implementations on iOS and Android plus docs and Storybook coverage.

Changes:

  • Added onKeyPress prop (JS/TS) and native event plumbing (onInputKeyPress) via codegen types.
  • Implemented iOS key mapping from replacement text and Android key inference via InputConnectionWrapper, plus hardware Tab handling on Android.
  • Updated documentation and added a Storybook story demonstrating key press events.

Reviewed changes

Copilot reviewed 14 out of 14 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
packages/react-native-enriched-markdown/src/index.tsx Re-exports OnKeyPressEvent from the public entrypoint.
packages/react-native-enriched-markdown/src/EnrichedMarkdownTextInputNativeComponent.ts Adds OnKeyPressEvent type and onInputKeyPress direct event handler to native props.
packages/react-native-enriched-markdown/src/EnrichedMarkdownTextInput.tsx Adds onKeyPress prop and wires it to native onInputKeyPress.
packages/react-native-enriched-markdown/ios/input/EnrichedMarkdownTextInput.mm Emits onInputKeyPress from iOS text-change delegate callbacks with RN-like key mapping.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/input/layout/InputEventEmitter.kt Adds emitKeyPress() helper to dispatch key press events.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/input/events/OnInputKeyPressEvent.kt New Android event class for onInputKeyPress payload { key }.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/input/EnrichedMarkdownTextInputView.kt Consumes plain Tab to insert \\t and emit Tab on Android, matching iOS behavior.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/input/EnrichedMarkdownTextInputManager.kt Registers onInputKeyPress for the view manager’s event list.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/input/editing/InputConnectionWrapper.kt Infers key presses from IME side effects and emits onInputKeyPress.
docs/INPUT.md Documents new onKeyPress hook in the input guide.
docs/API_REFERENCE.md Adds API reference section and example for onKeyPress.
apps/react-native-example/.rnstorybook/stories/components/EnrichedMarkdownTextInput/shared/storyMeta.ts Wires onKeyPress into Storybook Actions arg types.
apps/react-native-example/.rnstorybook/stories/components/EnrichedMarkdownTextInput/props/KeyPress.stories.tsx New Storybook story showcasing onKeyPress.
apps/react-native-example/.rnstorybook/stories/components/EnrichedMarkdownTextInput/EnrichedMarkdownTextInputStory.tsx Adds KeyPressStory that displays recent keys as chips.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@eszlamczyk
eszlamczyk requested a review from hryhoriiK97 July 23, 2026 12:09
@eszlamczyk
eszlamczyk marked this pull request as ready for review July 23, 2026 12:09

@hryhoriiK97 hryhoriiK97 left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! I've left one comment

@eszlamczyk
eszlamczyk merged commit fe7ae74 into main Jul 27, 2026
9 checks passed
@eszlamczyk
eszlamczyk deleted the feat/348/on-key-press-support branch July 27, 2026 08:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Feature: onKeyPress prop support for EnrichedMarkdownTextInput

3 participants