fix: prevent browser zoom in image preview

[trudbot]

Summary

• Register a non-passive wheel listener while preview wheel zoom is enabled.
• Prevent the browser default zoom gesture when a trackpad pinch is delivered as a wheel event over the preview image.
• Add a regression test covering ctrl+wheel trackpad zoom and image scaling.

Tests

• npm test -- --runInBand
• npm run tsc
• npx prettier --check src/hooks/useMouseEvent.ts src/Preview/index.tsx tests/preview.test.tsx
• npm run lint -- --no-fix (passes with existing warnings)

Summary by CodeRabbit

• 新功能

  • 支持通过触控板手势缩放预览图片。
  • 预览开启时可阻止浏览器默认缩放行为，提升缩放体验。

• 变更

  • 保留图片拖动、双击和触摸交互功能。

[vercel]

@trudbot is attempting to deploy a commit to the afc163's projects Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

Walkthrough

预览组件移除 onWheel 绑定。useMouseEvent 改用非被动的 window 滚轮监听器，并校验事件目标。测试覆盖带 ctrlKey 的滚轮缩放行为。

Changes

滚轮缩放流程

Layer / File(s)	Summary
原生滚轮监听与处理 src/hooks/useMouseEvent.ts	使用 useEvent 创建滚轮处理器。预览开启且启用滚轮时，注册非被动的 window 监听器。处理器仅响应当前图片的事件，并移除返回值中的 onWheel。
预览集成与行为验证 src/Preview/index.tsx, tests/preview.test.tsx	Preview 不再向图片绑定 onWheel。新增测试验证带 ctrlKey 的滚轮事件会阻止默认行为，并将图片缩放至 1.25 倍。

Estimated code review effort: 2 (Simple) | ~10 minutes

Suggested reviewers:afc163, qdyanbing

Poem

兔耳轻抖滚轮响，
图片放大一倍光。
原生监听拦默认，
触控板上缩放忙。
测试落下青草香。

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	标题准确概括了本次变更的主要目的，即阻止图片预览中的浏览器缩放。

✨ Finishing Touches 💡 1

🛠️ Fix failing CI checks 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 99.27%. Comparing base (ca57540) to head (31d7d11).

Additional details and impacted files

@@ Coverage Diff @@## master #527 +/- ##
=======================================
Coverage 99.26% 99.27% =======================================
Files 17 17 Lines 543 549 +6 Branches 166 167 +1 =======================================
+ Hits 539 545 +6 
Misses 4 4 

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[nrps9909]

Reviewed exact head 31d7d1171eb242bce570386ccf594a49a869ea04.

I traced the wheel path from the preview image through the native non-passive listener, including listener registration/cleanup, wheel={false}, target filtering, scale limits, and transform dispatch. The move from React's delegated onWheel to one native window listener avoids the passive-listener limitation without double-dispatching zoom.

Validation performed:

• npm test -- tests/preview.test.tsx --runInBand — 42/42 passed
• npm test -- --runInBand — 8 suites, 81/81 tests and 1/1 snapshot passed
• npm run tsc — passed
• npm run lint -- --no-fix — 0 errors (repository's existing warnings remain)
• npx prettier --check src/hooks/useMouseEvent.ts src/Preview/index.tsx tests/preview.test.tsx — passed
• npm run build — passed
• git diff --check ca5754037261b89a60681bf85c056d6533adee8d...31d7d1171eb242bce570386ccf594a49a869ea04 — clean
• Additional isolated probe: a cancelable Ctrl+wheel event outside the active preview image remained unprevented and did not alter the image transform

The red Vercel status is an external preview-authorization failure, not a failing code check. I found no blocking correctness or regression issue in this head.

AI assistance disclosure: Codex was used to help trace the event-listener lifecycle, run the isolated validation matrix, and draft this review. I independently checked the exact diff, live review state, and test results before approving.