Skip to content

Conversation

kimteayon
Copy link
Collaborator

@kimteayon kimteayon commented Apr 26, 2025

🤔 This is a ...

  • 🆕 New feature
  • 🐞 Bug fix
  • 📝 Site / documentation improvement
  • 📽️ Demo improvement
  • 💄 Component style improvement
  • 🤖 TypeScript definition improvement
  • 📦 Bundle size optimization
  • ⚡️ Performance optimization
  • ⭐️ Feature enhancement
  • 🌐 Internationalization
  • 🛠 Refactoring
  • 🎨 Code style optimization
  • ✅ Test Case
  • 🔀 Branch merge
  • ⏩ Workflow
  • ⌨️ Accessibility improvement
  • ❓ Other (about what?)

🔗 Related Issues

fix: windows上滚动条始终展示了
#744

💡 Background and Solution

意图是将滚动条隐藏 未考虑windows情况

📝 Change Log

Language Changelog
🇺🇸 English 将滚动条从scroll改为auto,同时兼容windows滚动条隐藏逻辑
🇨🇳 Chinese Change the scrollbar from scroll to auto, while being compatible with Windows scrollbar hiding logic

Summary by CodeRabbit

  • 样式
    • 优化了提示列表的横向滚动条表现,默认仅在需要时显示,并在各主流浏览器中隐藏了滚动条,提升视觉体验。

Copy link
Contributor

coderabbitai bot commented Apr 26, 2025

📝 Walkthrough

Walkthrough

本次变更调整了 prompts 列表容器的横向溢出行为,将其由 overflowX: 'scroll' 改为 overflowX: 'auto',并新增了隐藏滚动条的跨浏览器样式规则,包括对 Firefox、IE/Edge 及 WebKit 浏览器的支持。其他样式定义和接口声明未发生变化。

Changes

文件路径 变更摘要
components/prompts/style/index.ts 修改 prompts 列表横向溢出为 auto,并添加隐藏滚动条的跨浏览器样式

Poem

🐇
滚动条悄悄藏身影,
横向溢出更聪明。
浏览器间皆统一,
列表美观又清新。
小兔挥爪添新意,
代码世界更整齐!


📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 196d57b and 73f84a3.

📒 Files selected for processing (1)
  • components/prompts/style/index.ts (2 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
components/prompts/style/index.ts (3)
components/bubble/style/index.ts (1)
  • ComponentToken (39-39)
components/welcome/style/index.ts (1)
  • ComponentToken (6-6)
components/theme/cssinjs-utils.ts (1)
  • FullToken (22-26)
⏰ Context from checks skipped due to timeout of 90000ms (3)
  • GitHub Check: test / react component workflow
  • GitHub Check: build preview
  • GitHub Check: size
🔇 Additional comments (3)
components/prompts/style/index.ts (3)

7-9: 接口声明符合组件模式设计

这些接口声明遵循了代码库中的常见模式,其中ComponentToken保持空白是有意为之的(如第6行注释所示),而PromptsToken则继承自FullToken<'Prompts'>类型。


35-35: 改进了滚动条行为

overflowX'scroll' 改为 'auto' 是一个很好的改进,这样只有在内容溢出时才会显示滚动条,提供了更清爽的用户界面。


36-38: 增加了跨浏览器隐藏滚动条的支持

这些新增的CSS属性很好地补充了现有的WebKit滚动条隐藏功能:

  • scrollbarWidth: 'none' 用于Firefox浏览器
  • '-ms-overflow-style': 'none' 用于IE/Edge浏览器

这确保了在所有主流浏览器中都能保持一致的视觉效果,同时仍允许内容滚动。

✨ Finishing Touches
  • 📝 Generate Docstrings

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
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

Copy link
Contributor

github-actions bot commented Apr 26, 2025

Preview is ready

Copy link

Walkthrough

This pull request focuses on a component style improvement for the Prompts component. The main change involves modifying the horizontal overflow behavior and hiding the scrollbar for a cleaner UI appearance.

Changes

Files Summary
components/prompts/style/index.ts Adjusted the horizontal overflow from scroll to auto and added styles to hide the scrollbar for the Prompts component.

@kimteayon kimteayon changed the title fix: Prompts srollX fix: Prompts scroll styles Apr 26, 2025
Copy link

codecov bot commented Apr 26, 2025

Bundle Report

Bundle size has no change ✅

@kimteayon kimteayon linked an issue Apr 26, 2025 that may be closed by this pull request
Copy link

codecov bot commented Apr 26, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 92.33%. Comparing base (196d57b) to head (73f84a3).
Report is 2 commits behind head on main.

Additional details and impacted files
@@           Coverage Diff           @@
##             main     #785   +/-   ##
=======================================
  Coverage   92.33%   92.33%           
=======================================
  Files          66       66           
  Lines        1487     1487           
  Branches      386      403   +17     
=======================================
  Hits         1373     1373           
  Misses        114      114           

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

@afc163
Copy link
Member

afc163 commented Apr 26, 2025

解决啥问题。

@kimteayon
Copy link
Collaborator Author

kimteayon commented Apr 27, 2025

解决啥问题。

windows上滚动条始终展示了
#744

@kimteayon kimteayon merged commit 055c66b into ant-design:main Apr 27, 2025
11 checks passed
kimteayon added a commit that referenced this pull request May 8, 2025
* fix(attachment): fix image display style (#751)

* chore: update CodePreviewer to support React 19 (#758)

* docs: update a new contributions charts (#761)

* fix: fix some potential issue (#773)

* refactor: using setState function (#774)

Co-authored-by: vanndxh <[email protected]>

* type: fix some potential issue (#775)

* fix: watch config three sub-items  (#777)

* feat: function setState

* fix: watch config

---------

Co-authored-by: vanndxh <[email protected]>

* fix: fix Conversations ellipsis tooltip issues by removing it (#776)

* fix: fix Conversations ellipsis tooltip issues by removing it

* test: update snapshot

* style: use native text overflow style

* docs: changelog of 1.2.0 (#778)

* fix: fix some potential issue

* fix: fix some potential issue

* fix: fix some potential issue

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* 🏷️ type: add Conversation type export (#258)

Co-authored-by: afc163 <[email protected]>

* docs: fix the wrong docs of ThoughtChain (#781)

* fix: fix some potential issue

* fix: fix some potential issue

* fix: fix some potential issue

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: fix the wrong docs of ThoughtChain

* docs: optimize Bubble.List scoll position

* docs: fix thought-chain and changelog

* fix: Prompts scroll styles (#785)

* fix: Prompts srollX

* fix: Prompts srollX

* docs: optimize Bubble.List scroll bar position (#783)

* docs: optimize Bubble.List scoll position

* docs: optimize Bubble.List scoll position

* test: demo snap

* fix: Prompts srollX

* chore: sync main to feature branch

---------

Co-authored-by: wzc520pyfm <[email protected]>
Co-authored-by: ice <[email protected]>
Co-authored-by: Shinji-Li <[email protected]>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Vanndxh <[email protected]>
Co-authored-by: vanndxh <[email protected]>
Co-authored-by: afc163 <[email protected]>
kimteayon added a commit that referenced this pull request May 21, 2025
* chore: sync main to feature branch  (#810)

* fix(attachment): fix image display style (#751)

* chore: update CodePreviewer to support React 19 (#758)

* docs: update a new contributions charts (#761)

* fix: fix some potential issue (#773)

* refactor: using setState function (#774)

Co-authored-by: vanndxh <[email protected]>

* type: fix some potential issue (#775)

* fix: watch config three sub-items  (#777)

* feat: function setState

* fix: watch config

---------

Co-authored-by: vanndxh <[email protected]>

* fix: fix Conversations ellipsis tooltip issues by removing it (#776)

* fix: fix Conversations ellipsis tooltip issues by removing it

* test: update snapshot

* style: use native text overflow style

* docs: changelog of 1.2.0 (#778)

* fix: fix some potential issue

* fix: fix some potential issue

* fix: fix some potential issue

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* 🏷️ type: add Conversation type export (#258)

Co-authored-by: afc163 <[email protected]>

* docs: fix the wrong docs of ThoughtChain (#781)

* fix: fix some potential issue

* fix: fix some potential issue

* fix: fix some potential issue

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: fix the wrong docs of ThoughtChain

* docs: optimize Bubble.List scoll position

* docs: fix thought-chain and changelog

* fix: Prompts scroll styles (#785)

* fix: Prompts srollX

* fix: Prompts srollX

* docs: optimize Bubble.List scroll bar position (#783)

* docs: optimize Bubble.List scoll position

* docs: optimize Bubble.List scoll position

* test: demo snap

* fix: Prompts srollX

* chore: sync main to feature branch

---------

Co-authored-by: wzc520pyfm <[email protected]>
Co-authored-by: ice <[email protected]>
Co-authored-by: Shinji-Li <[email protected]>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Vanndxh <[email protected]>
Co-authored-by: vanndxh <[email protected]>
Co-authored-by: afc163 <[email protected]>

* chore: fix  warning of deprecated API (#827)

* chore: fix  warning of deprecated API

* chore: fix ts

* chore: fix logic

* test: ignore legacy

* chore: delete webpack.config.js (#229)

* docs(bubble): update content and messageRender type (#814)

* docs: sender supplement documents to address user inquiries (#835)

* docs: supplement documents to address user inquiries

* docs: sender

* chore: sync main to feature branch

* feat:  make the Bubble foot and header to get from context  & Bubble can get key (#683)

* feat:  调整Bubble foot,header参数,支持头部获取上下文

* fix: # 支持useXAgent通过deps 获取最新状态

* fix: 剔多余提交

* fix: 英文文档格式修复

* fix  简化参数

* Update header-and-footer.tsx

fix: 调整用例

* feat: bubble's footer and header

* feat: bubble's footer and header

* test: bubble's footer and header

* fix: ts of key

* fix: ts of key

---------

Co-authored-by: Mickey <[email protected]>

* fix: resolve the security issues of apikey (#840)

* fix: Resolve the security issues of apikey

* fix: Resolve the security issues of apikey

* test: update snap

* fix:api key and stream

* fix:api key and stream

* docs: modification tips (#844)

* docs: changelog of 1.3.0 (#845)

* test: sender

* test: delete

* docs: changelog of 1.3.0

* docs: changelog of 1.3.0

* docs: changelog of 1.3.0

---------

Co-authored-by: wzc520pyfm <[email protected]>
Co-authored-by: ice <[email protected]>
Co-authored-by: Shinji-Li <[email protected]>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Vanndxh <[email protected]>
Co-authored-by: vanndxh <[email protected]>
Co-authored-by: afc163 <[email protected]>
Co-authored-by: 二货爱吃白萝卜 <[email protected]>
Co-authored-by: Lawliet <[email protected]>
coding-ice pushed a commit to coding-ice/x that referenced this pull request Jun 17, 2025
* fix: Prompts srollX

* fix: Prompts srollX
coding-ice added a commit to coding-ice/x that referenced this pull request Jun 17, 2025
* fix(attachment): fix image display style (ant-design#751)

* chore: update CodePreviewer to support React 19 (ant-design#758)

* docs: update a new contributions charts (ant-design#761)

* fix: fix some potential issue (ant-design#773)

* refactor: using setState function (ant-design#774)

Co-authored-by: vanndxh <[email protected]>

* type: fix some potential issue (ant-design#775)

* fix: watch config three sub-items  (ant-design#777)

* feat: function setState

* fix: watch config

---------

Co-authored-by: vanndxh <[email protected]>

* fix: fix Conversations ellipsis tooltip issues by removing it (ant-design#776)

* fix: fix Conversations ellipsis tooltip issues by removing it

* test: update snapshot

* style: use native text overflow style

* docs: changelog of 1.2.0 (ant-design#778)

* fix: fix some potential issue

* fix: fix some potential issue

* fix: fix some potential issue

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* 🏷️ type: add Conversation type export (ant-design#258)

Co-authored-by: afc163 <[email protected]>

* docs: fix the wrong docs of ThoughtChain (ant-design#781)

* fix: fix some potential issue

* fix: fix some potential issue

* fix: fix some potential issue

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: changelog of 1.2.0

* docs: fix the wrong docs of ThoughtChain

* docs: optimize Bubble.List scoll position

* docs: fix thought-chain and changelog

* fix: Prompts scroll styles (ant-design#785)

* fix: Prompts srollX

* fix: Prompts srollX

* docs: optimize Bubble.List scroll bar position (ant-design#783)

* docs: optimize Bubble.List scoll position

* docs: optimize Bubble.List scoll position

* test: demo snap

* fix: Prompts srollX

* chore: sync main to feature branch

---------

Co-authored-by: wzc520pyfm <[email protected]>
Co-authored-by: ice <[email protected]>
Co-authored-by: Shinji-Li <[email protected]>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Vanndxh <[email protected]>
Co-authored-by: vanndxh <[email protected]>
Co-authored-by: afc163 <[email protected]>
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.

官方演示在Windows 10 上,出现莫名其妙的滚动条三角
3 participants