react-notion-x
react-notion-x copied to clipboard
fix: support direct image hyperlinks
trafficstars
fix #637
Description
adds native support for hyperlinks applied directly to image blocks. While Notion allows hyperlinks via image captions, exposing the link as a caption feels intrusive and affects the user experience.
To address this, we modify the asset-wrapper logic to properly detect and wrap images in anchor tags when a valid image_hyperlink is present.
Solution
- Introduced
getURLInfo()
- Determines whether the image should link to
- a Notion page (/xxx pattern with UUID),
- an external URL (validated using a URL regex).
- Improved link handling logic
- Fallback order: imageHyperlink → caption
- Automatically wraps the image with <components.PageLink> only when a valid link is detected.
- Maintains support for internal Notion page routing via
mapPageUrl.
Notion Test Page ID
2061b06afbf1807b8e35d35e7a7fd146