fix: holding left click breaks mask

[claytonlin1110]

Closes issue

Summary by CodeRabbit

发布说明

• Bug修复
  • 按下鼠标时会延后文本选择与光标调整，避免与即时选择冲突；未按下鼠标的路径仍保持即时选择，交互更稳定一致。
• 测试
  • 新增用例覆盖按下鼠标聚焦后在松开时同步选择的行为验证。

[vercel]

@claytonlin1110 is attempting to deploy a commit to the React Component Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

Walkthrough

在 Input.tsx 的 useLayoutEffect 中调整了焦点与掩码校验与选择范围应用的控制流：早期返回只检查 focused 与 format，在掩码验证后新增对 mouseDownRef.current 的单独守卫以在鼠标按下时延后选择同步。

Changes

Cohort / File(s)	Summary
Input 组件逻辑变更 src/PickerInput/Selector/Input.tsx	重构 useLayoutEffect：早期返回移除 mouseDownRef.current 检查；在掩码验证后新增单独的 mouseDownRef.current 早退分支以在鼠标按下时延迟选择范围调整；非按下路径仍在 requestAnimationFrame 回调内应用选择；更新注释说明。
新增/更新测试 tests/new-range.spec.tsx	新增测试 "focus by mousedown defers selection sync to mouseUp"：模拟在 start 输入上 mousedown → focus → mouseup，断言在 mouseup 后 selectionStart/selectionEnd 已定义，验证按下聚焦路径的延后行为。

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐇 轻敲鼠标我先藏，
焦点掩码悄无声，
等到松手再排列，
RAF 一刻稳分明，
小兔点检写成章。

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	标题准确反映了主要变更内容，即修复鼠标长按时掩码功能被破坏的问题。
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

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 and usage tips.}

[claytonlin1110]

@afc163 Please review

[gemini-code-assist]

Summary of Changes

Hello, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

此拉取请求旨在解决 PickerInput 组件中一个与鼠标交互相关的特定错误。通过优化输入字段的格式验证和文本选择处理逻辑，确保了在用户按住鼠标左键进行操作时，掩码功能能够保持其预期的行为，从而提升了组件的稳定性和用户体验。

Highlights

• Bug修复: 修复了 PickerInput 组件中，在按住鼠标左键时，输入框的掩码（mask）功能失效的问题。
• 交互逻辑优化: 调整了 useLayoutEffect 钩子中的逻辑，当鼠标按下时，延迟设置选择范围，以确保点击位置被正确使用，从而维护了掩码的正确行为。

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog

• src/PickerInput/Selector/Input.tsx
  • 修复了在按住鼠标左键时，掩码功能可能被破坏的问题。

Activity

• 关联并关闭了 issue #57034。
• 包含由 coderabbit.ai 自动生成的发布说明。

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

这个 Pull Request 修复了按住鼠标左键会破坏输入掩码的 bug。改动正确地调整了 useLayoutEffect 内部的逻辑顺序，确保在延迟选择区更新到 mouseUp 事件之前验证输入格式。这正确地处理了按住鼠标按钮并进行文本选择的场景。逻辑是合理的。我有一个关于代码风格一致性的小建议。

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 98.80%. Comparing base (3afa103) to head (5b1a920).

Additional details and impacted files

@@           Coverage Diff           @@
##           master     #959   +/-   ##
=======================================
  Coverage   98.80%   98.80%           
=======================================
  Files          65       65           
  Lines        2685     2687    +2     
  Branches      720      741   +21     
=======================================
+ Hits         2653     2655    +2     
  Misses         29       29           
  Partials        3        3           

☔ View full report in Codecov by Sentry.
📢 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.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@tests/new-range.spec.tsx`:
- Around line 1013-1024: The test "focus by mousedown defers selection sync to
mouseUp" only asserts selectionStart/End are defined after mouseUp, which is too
weak; update the test around Demo/startInput to assert selectionStart and
selectionEnd are null (or unchanged) immediately after fireEvent.mouseDown and
fireEvent.focus to prove selection is not synchronized yet, then assert they
become numeric (not null/undefined) after fireEvent.mouseUp; reference the
existing calls fireEvent.mouseDown(startInput), fireEvent.focus(startInput),
fireEvent.mouseUp(startInput) and the selectionStart/selectionEnd checks when
adding these pre- and post-mouseUp assertions.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 846d82a8-8256-470e-9d54-993f53cca631

📥 Commits

Reviewing files that changed from the base of the PR and between fde8fad and 5b1a920.

📒 Files selected for processing (1)

• tests/new-range.spec.tsx

[claytonlin1110]

@zombieJ Please review when you have a chance. Thanks.

[claytonlin1110]

@zombieJ