react-component / react-component/image
How to modify preview events
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 213
- Forks
- 124
- Avg merge
- 47m
- Merged PRs (30d)
- 1
Description
Following custom preview image demo:
<Image
width={200}
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png?x-oss-process=image/blur,r_50,s_50/quality,q_1/resize,m_mfit,h_200,w_200"
preview={{
src: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
}}
/>
The only way to close the popup image is either: a) X button b) press on the modal (outside the image).
How is it possible to close the popup when clicking the image?
Using Image preview API modifies only the hover modal of the preview, and modal property of preview does the same.
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the Image component's preview API and the custom preview example in the issue, then trace how the popup handles clicks on the modal and image. Done means clicking the popup image closes the preview without breaking the existing X-button and outside-modal behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100