Skip to content

Conversation

@aeifn
Copy link

@aeifn aeifn commented Jan 30, 2026

The disableAutoScroll prop provides users with control over the automatic scrolling behavior in single-select
mode. By default, the Select component automatically scrolls to the selected option when the dropdown opens,
which can be disruptive in certain UX scenarios where users want to maintain their current scroll position or
handle scrolling manually.

This addition allows developers to disable the auto-scroll behavior while preserving all other functionality.

Summary by CodeRabbit

  • 新增功能

    • 为 Select 组件添加公有布尔属性 disableAutoScroll,可用于禁用选中单项时的自动滚动行为(默认 false)。
  • 文档

    • 更新组件文档和 API 表以列出并说明 disableAutoScroll 属性及其默认值。

✏️ Tip: You can customize this high-level summary in your review settings.

@vercel
Copy link

vercel bot commented Jan 30, 2026

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

A member of the Team first needs to authorize it.

@gemini-code-assist
Copy link
Contributor

Summary of Changes

Hello @aeifn, I'm Gemini Code Assist1! 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!

This pull request introduces a new disableAutoScroll prop to the Select component, providing developers with granular control over the automatic scrolling behavior that typically occurs when a dropdown opens in single-select mode. This enhancement aims to improve user experience by preventing potentially disruptive auto-scrolling, allowing for scenarios where maintaining the current scroll position or manual scrolling is preferred, without affecting other functionalities.

Highlights

  • New Prop Introduction: A new disableAutoScroll boolean prop has been added to the Select component, allowing developers to control the automatic scrolling behavior of the dropdown.
  • Conditional Auto-Scrolling: The internal logic within the OptionList component has been updated to conditionally disable auto-scrolling based on the value of the new disableAutoScroll prop, specifically in single-select mode.
  • Prop Propagation: The disableAutoScroll prop is now correctly passed from the Select component to its child OptionList component and has been added to the SelectContextProps interface.
  • Documentation Update: The README.md file has been updated to include the new disableAutoScroll prop in the component's API documentation, specifying its type and default value.

🧠 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.

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.

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Jan 30, 2026

Walkthrough

为 Select 组件新增公开布尔属性 disableAutoScroll(默认 false),该属性在 README、SelectContext、Select 组件与 OptionList 中被声明或消费;OptionList 的单项自动滚动逻辑现在会根据该标志进行启/禁判断。

Changes

Cohort / File(s) Summary
文档
README.md
在 Select 组件的 API 表中添加 disableAutoScroll 属性说明。
Context 定义
src/SelectContext.ts
SelectContextProps 中新增可选属性 disableAutoScroll?: boolean,以便通过 context 传递该标志。
Select 组件
src/Select.tsx
SelectProps 中新增 disableAutoScroll?: boolean,并将该值透传到 SelectContext;相关依赖数组已包含该属性。
OptionList 组件
src/OptionList.tsx
从 context 消费 disableAutoScroll 并在自动滚动 effect 中用其阻止或允许单项自动滚动;依赖数组已更新以包含该属性。

Sequence Diagram(s)

sequenceDiagram
    participant App as 应用 (传入 prop)
    participant Select as Select 组件
    participant Context as SelectContext
    participant OptionList as OptionList 组件
    App->>Select: 传入 disableAutoScroll (true/false)
    Select->>Context: 将 disableAutoScroll 写入 context
    OptionList->>Context: 读取 selected / options / disableAutoScroll
    alt disableAutoScroll = false
        OptionList->>OptionList: 自动滚动至单项
    else disableAutoScroll = true
        OptionList-->>OptionList: 跳过自动滚动
    end
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

Suggested reviewers

  • afc163
  • zombieJ

庆祝诗

🐰 新的开关我来报,
滚动有时静又妙,
Select 心中多一桩,
用户体验轻轻保,
笑跳一跃庆小巧 🥕

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Title check ✅ Passed 标题准确地总结了拉取请求的主要变化,即向Select组件添加新的disableAutoScroll属性来控制自动滚动行为。

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

✨ Finishing touches
  • 📝 Generate docstrings
🧪 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

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces a disableAutoScroll prop to give users control over the automatic scrolling behavior in the Select component. The changes are well-implemented, adding the prop and threading it down to the OptionList component where it's used to conditionally enable the auto-scroll logic. The documentation has also been updated accordingly. I have one suggestion regarding a potential bug with stale data in a useEffect hook due to a missing dependency, which was a pre-existing issue exacerbated by this change.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Fix all issues with AI agents
In `@README.md`:
- Line 125: 文档中关于属性 disableAutoScroll 的说明不够明确,请在 README
的该属性行(disableAutoScroll)后补充一句说明其仅在单选模式下生效,且不会影响多选或带搜索的场景,以避免误解;定位到 README 中表格里包含
disableAutoScroll 的那一行,更新描述文本为“Disable auto scroll to selected option — only
applies to single-select mode; does not affect multi-select or searchable
scenarios.”

@aeifn aeifn changed the title Add disableAutoScroll prop to control auto-scrolling behavior in the select component feat: add disableAutoScroll prop to control auto-scrolling behavior in the select component Jan 30, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant