Skip to content

feat: expose insert text method - #613

Open
eszlamczyk wants to merge 1 commit into
mainfrom
feat/286/expose-insert-text-at-cursor
Open

feat: expose insert text method#613
eszlamczyk wants to merge 1 commit into
mainfrom
feat/286/expose-insert-text-at-cursor

Conversation

@eszlamczyk

Copy link
Copy Markdown
Collaborator

What/Why?

Closes #286.

Adds an insertText(text) imperative method to EnrichedMarkdownTextInput that parses the given string as Markdown and inserts it literally at the current cursor position (replacing the selection if there is one). Previously the only way to insert text programmatically was the getMarkdown + splice + setValue workaround, which reparses the whole document and loses line breaks.

Implementation reuses the existing paste pipeline on both platforms (pasteMarkdown), so inline formatting, block ranges, auto-link detection, undo and event emission all come from battle-tested code:

  • Spec/TS: new insertText command in EnrichedMarkdownTextInputNativeComponent.ts, exposed on EnrichedMarkdownTextInputInstance.
  • iOS: insertText: delegates to pasteMarkdown: (empty string is a no-op).
  • Android: insertTextAtCursor() wrapper over pasteMarkdown() plus the insertText manager override.

While testing, this surfaced a bug in pasteMarkdown on both platforms: md4c consumes leading/trailing newlines as block structure, so inserting '\n- item\n' mid-word merged the list line with the surrounding text (te|st became a - tefirst item bullet). The newline runs are now split off before the parse and re-attached verbatim, making insertion fully literal — the caller controls separation. This also fixes clipboard paste of markdown that starts/ends with block content.

Also fixes text selection inside storybook stories: the storybook story wrapper calls Keyboard.dismiss() on every touch start, which collapsed selections and broke double-tap selection. Disabled via hasStoryWrapper: false in .rnstorybook/index.ts.

Testing

New Methods/InsertText storybook story with three snippets (plain text, inline markdown, a newline-wrapped list). Manually verified on iOS simulator and Android emulator:

  • Cursor mid-word: inserted text lands exactly at the cursor (lore<text>|m ipsum), cursor after the inserted text.
  • Active selection: replaced by the inserted content.
  • '**bold**, *italic* and a [link](...)' renders formatted; getMarkdown() round-trips.
  • '\n- first item\n- second item\n' at te|st yields te / two bullets / st on separate lines.
  • insertText('') with an active selection is a no-op.

Screenshots

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)

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 a new imperative insertText(text) API to EnrichedMarkdownTextInput so callers can insert markdown-parsed content at the current cursor/selection without reserializing and resetting the whole document. The implementation reuses the existing paste pipeline on both platforms and adjusts it to preserve leading/trailing newline runs verbatim (so block content can be inserted mid-paragraph without md4c “consuming” the outer newlines).

Changes:

  • Exposed insertText as a native command and added it to the JS ref instance API.
  • Implemented insertText on iOS and Android via the existing pasteMarkdown flow; updated pasteMarkdown to split/re-attach edge newlines.
  • Added Storybook coverage for the new method and disabled the Storybook story wrapper to fix text selection interactions.

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
packages/react-native-enriched-markdown/src/EnrichedMarkdownTextInputNativeComponent.ts Adds insertText to codegen native commands.
packages/react-native-enriched-markdown/src/EnrichedMarkdownTextInput.tsx Exposes insertText on the imperative ref instance.
packages/react-native-enriched-markdown/ios/input/EnrichedMarkdownTextInput.mm Adds insertText: and updates pasteMarkdown: to preserve edge newlines.
packages/react-native-enriched-markdown/android/.../EnrichedMarkdownTextInputView.kt Updates pasteMarkdown newline handling and adds insertTextAtCursor.
packages/react-native-enriched-markdown/android/.../EnrichedMarkdownTextInputManager.kt Exposes insertText command to call into the view.
docs/API_REFERENCE.md Documents the new insertText method.
apps/react-native-example/.rnstorybook/.../InsertText.stories.tsx Adds a Storybook story demonstrating insertText.
apps/react-native-example/.rnstorybook/index.ts Disables story wrapper to prevent selection collapse during touches.

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

@eszlamczyk
eszlamczyk requested a review from hryhoriiK97 July 30, 2026 07:58
@eszlamczyk
eszlamczyk marked this pull request as ready for review July 30, 2026 07:58
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 request: expose insertText that inserts text a the current cursor position

2 participants