feat: onImagePress callback

[eszlamczyk]

What/Why?

Closes #709.

Adds an onImagePress callback that fires when a rendered Markdown image is tapped or clicked, so host apps can open a lightbox / full-screen viewer. Until now the only workaround was turning images into links (onLinkPress), which changes accessibility, link previews, text selection, and long-press menus.

API

<EnrichedMarkdownText
  onImagePress={({ url, altText }) => void}
/>

• Payload is { url, altText }, with altText: "" when the image has no alt text (uniform across platforms).
• Fires for block and inline images, including images inside headings, lists, and blockquotes.
• Linked images ([![alt](img)](dest)) keep link behavior and fire onLinkPress instead — a single tap never fires both.
• Opt-in / non-breaking: setting the prop makes images interactive; leaving it unset keeps the current tap, text-selection, and long-press menu behavior unchanged. This is enforced natively via an enableImagePress flag derived from whether the callback is provided, so nothing changes for existing apps (on iOS the Copy/Save menu is preserved; on Android no image span becomes interactive, avoiding the selection issues from Tapping anywhere in an EnrichedMarkdownText that contains an image crashes the app on Android with java.lang.IllegalArgumentException: Center point is not inside any of the rectangles!. #196/fix(android): disable smart text selection to prevent ImageSpan crash #197).

Platforms: iOS, Android, Web, and macOS. Both display components (EnrichedMarkdownText / CommonMark and EnrichedMarkdown / GFM) are covered.

Testing

Verified on simulator:

• Tap a block image, an inline image, and images inside a heading / list / blockquote → onImagePress fires with the correct url + altText (use the Block → Image → PressEvent Storybook story or the Text screen).
• Tap a linked image ([![alt](img)](dest)) → only onLinkPress fires.
• With onImagePress unset, confirm the iOS Copy/Save long-press menu and text selection are unchanged; on Android confirm scrolling/dragging and text selection over an image do not fire the event
• Screen readers: image is activatable via VoiceOver / TalkBack; on web via Enter/Space, and the right-click menu still appears.

Screenshots

iOS	Android
Screen.Recording.2026-08-26.at.12.56.03.mov	Screen.Recording.2026-08-26.at.12.53.55.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)

[Copilot]

Pull request overview

Adds a new cross-platform onImagePress callback to the Enriched Markdown components so host apps can respond to taps/clicks on rendered images (e.g., open a lightbox) while keeping linked-image behavior routed through onLinkPress and preserving existing non-interactive behavior unless opted in.

Changes:

• Introduces ImagePressEvent + onImagePress prop across JS types, web renderer callbacks, and public exports.
• Implements opt-in native handling via enableImagePress (derived from whether onImagePress is provided) and dispatches onImagePress from iOS/Android.
• Updates documentation and example apps/storybook to demonstrate and describe the new callback.

Reviewed changes

Copilot reviewed 33 out of 33 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
packages/react-native-enriched-markdown/src/web/types.ts	Adds onImagePress to web renderer callback types.
packages/react-native-enriched-markdown/src/web/renderers/BlockRenderers.tsx	Makes non-linked images interactive on web and emits onImagePress (click + keyboard).
packages/react-native-enriched-markdown/src/web/EnrichedMarkdownText.tsx	Wires onImagePress into the web renderer callbacks object.
packages/react-native-enriched-markdown/src/types/MarkdownTextProps.web.ts	Documents and exposes onImagePress on web props typing.
packages/react-native-enriched-markdown/src/types/MarkdownTextProps.ts	Documents and exposes onImagePress on native props typing.
packages/react-native-enriched-markdown/src/types/events.ts	Adds the ImagePressEvent event shape.
packages/react-native-enriched-markdown/src/native/EnrichedMarkdownText.tsx	Wires onImagePress and enableImagePress through the native wrapper for both flavors.
packages/react-native-enriched-markdown/src/index.web.tsx	Re-exports ImagePressEvent from the web entrypoint.
packages/react-native-enriched-markdown/src/index.tsx	Re-exports ImagePressEvent from the native entrypoint.
packages/react-native-enriched-markdown/src/EnrichedMarkdownTextNativeComponent.ts	Adds codegen spec for onImagePress + enableImagePress (CommonMark component).
packages/react-native-enriched-markdown/src/EnrichedMarkdownNativeComponent.ts	Adds codegen spec for onImagePress + enableImagePress (GFM component).
packages/react-native-enriched-markdown/ios/utils/LinkTapUtils.m	Adds image hit-testing helper and extends “interactive element” detection to include images when enabled.
packages/react-native-enriched-markdown/ios/utils/LinkTapUtils.h	Exposes image hit-testing helper and updates interactive-element API to accept includeImages.
packages/react-native-enriched-markdown/ios/utils/ENRMTextRenderer.m	Applies image attributes to the rendered attributed string.
packages/react-native-enriched-markdown/ios/renderer/RenderContext.m	Adds applyImageAttributesToString to stamp image URL/alt attributes into attributed text.
packages/react-native-enriched-markdown/ios/renderer/RenderContext.h	Declares applyImageAttributesToString.
packages/react-native-enriched-markdown/ios/EnrichedMarkdownText.mm	Adds enableImagePress prop handling and emits onImagePress on tap when enabled.
packages/react-native-enriched-markdown/ios/EnrichedMarkdown.mm	Adds enableImagePress prop handling and emits onImagePress on tap when enabled.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/utils/text/view/LinkLongPressMovementMethod.kt	Detects image taps (when enabled) and dispatches image press events while keeping linked images as links.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/utils/text/view/LinkEvents.kt	Adds emitImagePressEvent helper for dispatching onImagePress.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/utils/text/view/ImagePressHost.kt	Introduces host interface to gate/dispatch image presses from both CommonMark + GFM views.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/events/ImagePressEvent.kt	Adds Android Fabric event implementation for onImagePress.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/EnrichedMarkdownTextManager.kt	Adds enableImagePress prop plumbing (CommonMark).
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/EnrichedMarkdownText.kt	Implements ImagePressHost and enables/disables image press handling.
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/EnrichedMarkdownManager.kt	Adds enableImagePress prop plumbing (GFM).
packages/react-native-enriched-markdown/android/src/main/java/com/swmansion/enriched/markdown/EnrichedMarkdown.kt	Implements ImagePressHost and enables/disables image press handling.
docs/WEB.md	Documents web support details for onImagePress.
docs/TEXT.md	Adds high-level docs for image handling via onImagePress.
docs/API_REFERENCE.md	Adds API reference section for onImagePress.
apps/react-native-web-example/src/App.tsx	Demonstrates onImagePress in the web example app.
apps/react-native-macos-example/src/App.tsx	Demonstrates onImagePress in the macOS example app.
apps/react-native-example/src/screens/text/TextScreen.tsx	Demonstrates onImagePress in the RN example app.
apps/react-native-example/.rnstorybook/stories/components/EnrichedMarkdownText/block/Image.stories.tsx	Adds Storybook story for onImagePress and linked-image behavior.

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.