Skip to content

fix(Bubble.List): error style passport#1731

Merged
kimteayon merged 7 commits intomainfrom
fix/BL-style
Feb 5, 2026
Merged

fix(Bubble.List): error style passport#1731
kimteayon merged 7 commits intomainfrom
fix/BL-style

Conversation

@anxLiang
Copy link
Contributor

@anxLiang anxLiang commented Feb 5, 2026

中文版模板 / Chinese template

🤔 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

  • Describe the source of related requirements, such as links to relevant issue discussions.
  • For example: close #xxxx, fix #xxxx

fix #1728

💡 Background and Solution

  • The specific problem to be addressed.
  • List the final API implementation and usage if needed.
  • If there are UI/interaction changes, consider providing screenshots or GIFs.

📝 Change Log

Language Changelog
🇺🇸 English Fixed List.styles.root error passport
🇨🇳 Chinese 修复 List.styles.root 错误传递

Summary by CodeRabbit

发布说明

  • 新功能

    • 支持对气泡列表项目进行样式和类名的细粒度定制,允许按项目类型(分隔符、系统消息、气泡等)进行个性化配置。
    • 建立明确的配置优先级规则:项目级 > 角色级 > 列表级。
  • 文档

    • 补充配置优先级说明和自定义指南,帮助用户更好地理解样式覆盖机制。

@codecov
Copy link

codecov bot commented Feb 5, 2026

Bundle Report

Changes will decrease total bundle size by 1.25MB (-38.15%) ⬇️. This is within the configured threshold ✅

Detailed changes
Bundle name Size Change
x-markdown-array-push 120.07kB -1.25MB (-91.23%) ⬇️
antdx-array-push 1.91MB 88 bytes (0.0%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: x-markdown-array-push

Assets Changed:

Asset Name Size Change Total Size Change (%)
x-markdown.min.js (New) 113.71kB 113.71kB 100.0% 🚀
x-markdown.min.css (New) 6.36kB 6.36kB 100.0% 🚀
latex.min.js (Deleted) -268.81kB 0 bytes -100.0% 🗑️
static/KaTeX_AMS-Regular.*.ttf (Deleted) -63.63kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Regular.*.ttf (Deleted) -53.58kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Bold.*.ttf (Deleted) -51.34kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Italic.*.ttf (Deleted) -33.58kB 0 bytes -100.0% 🗑️
static/KaTeX_AMS-Regular.*.woff (Deleted) -33.52kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-BoldItalic.*.ttf (Deleted) -32.97kB 0 bytes -100.0% 🗑️
static/KaTeX_Math-Italic.*.ttf (Deleted) -31.31kB 0 bytes -100.0% 🗑️
static/KaTeX_Math-BoldItalic.*.ttf (Deleted) -31.2kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Regular.*.woff (Deleted) -30.77kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Bold.*.woff (Deleted) -29.91kB 0 bytes -100.0% 🗑️
static/KaTeX_AMS-Regular.*.woff2 (Deleted) -28.08kB 0 bytes -100.0% 🗑️
static/KaTeX_Typewriter-Regular.*.ttf (Deleted) -27.56kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Regular.*.woff2 (Deleted) -26.27kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Bold.*.woff2 (Deleted) -25.32kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Bold.*.ttf (Deleted) -24.5kB 0 bytes -100.0% 🗑️
latex.min.css (Deleted) -24.32kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Italic.*.ttf (Deleted) -22.36kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Italic.*.woff (Deleted) -19.68kB 0 bytes -100.0% 🗑️
static/KaTeX_Fraktur-Bold.*.ttf (Deleted) -19.58kB 0 bytes -100.0% 🗑️
static/KaTeX_Fraktur-Regular.*.ttf (Deleted) -19.57kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Regular.*.ttf (Deleted) -19.44kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-BoldItalic.*.woff (Deleted) -19.41kB 0 bytes -100.0% 🗑️
static/KaTeX_Math-Italic.*.woff (Deleted) -18.75kB 0 bytes -100.0% 🗑️
static/KaTeX_Math-BoldItalic.*.woff (Deleted) -18.67kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-Italic.*.woff2 (Deleted) -16.99kB 0 bytes -100.0% 🗑️
static/KaTeX_Main-BoldItalic.*.woff2 (Deleted) -16.78kB 0 bytes -100.0% 🗑️
static/KaTeX_Script-Regular.*.ttf (Deleted) -16.65kB 0 bytes -100.0% 🗑️
static/KaTeX_Math-Italic.*.woff2 (Deleted) -16.44kB 0 bytes -100.0% 🗑️
static/KaTeX_Math-BoldItalic.*.woff2 (Deleted) -16.4kB 0 bytes -100.0% 🗑️
static/KaTeX_Typewriter-Regular.*.woff (Deleted) -16.03kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Bold.*.woff (Deleted) -14.41kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Italic.*.woff (Deleted) -14.11kB 0 bytes -100.0% 🗑️
static/KaTeX_Typewriter-Regular.*.woff2 (Deleted) -13.57kB 0 bytes -100.0% 🗑️
static/KaTeX_Fraktur-Bold.*.woff (Deleted) -13.3kB 0 bytes -100.0% 🗑️
static/KaTeX_Fraktur-Regular.*.woff (Deleted) -13.21kB 0 bytes -100.0% 🗑️
static/KaTeX_Caligraphic-Bold.*.ttf (Deleted) -12.37kB 0 bytes -100.0% 🗑️
static/KaTeX_Caligraphic-Regular.*.ttf (Deleted) -12.34kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Regular.*.woff (Deleted) -12.32kB 0 bytes -100.0% 🗑️
static/KaTeX_Size1-Regular.*.ttf (Deleted) -12.23kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Bold.*.woff2 (Deleted) -12.22kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Italic.*.woff2 (Deleted) -12.03kB 0 bytes -100.0% 🗑️
static/KaTeX_Size2-Regular.*.ttf (Deleted) -11.51kB 0 bytes -100.0% 🗑️
static/KaTeX_Fraktur-Bold.*.woff2 (Deleted) -11.35kB 0 bytes -100.0% 🗑️
static/KaTeX_Fraktur-Regular.*.woff2 (Deleted) -11.32kB 0 bytes -100.0% 🗑️
static/KaTeX_Script-Regular.*.woff (Deleted) -10.59kB 0 bytes -100.0% 🗑️
static/KaTeX_Size4-Regular.*.ttf (Deleted) -10.36kB 0 bytes -100.0% 🗑️
static/KaTeX_SansSerif-Regular.*.woff2 (Deleted) -10.34kB 0 bytes -100.0% 🗑️
static/KaTeX_Script-Regular.*.woff2 (Deleted) -9.64kB 0 bytes -100.0% 🗑️
static/KaTeX_Caligraphic-Bold.*.woff (Deleted) -7.72kB 0 bytes -100.0% 🗑️
static/KaTeX_Caligraphic-Regular.*.woff (Deleted) -7.66kB 0 bytes -100.0% 🗑️
static/KaTeX_Size3-Regular.*.ttf (Deleted) -7.59kB 0 bytes -100.0% 🗑️
static/KaTeX_Caligraphic-Bold.*.woff2 (Deleted) -6.91kB 0 bytes -100.0% 🗑️
static/KaTeX_Caligraphic-Regular.*.woff2 (Deleted) -6.91kB 0 bytes -100.0% 🗑️
static/KaTeX_Size1-Regular.*.woff (Deleted) -6.5kB 0 bytes -100.0% 🗑️
static/KaTeX_Size2-Regular.*.woff (Deleted) -6.19kB 0 bytes -100.0% 🗑️
static/KaTeX_Size4-Regular.*.woff (Deleted) -5.98kB 0 bytes -100.0% 🗑️
static/KaTeX_Size1-Regular.*.woff2 (Deleted) -5.47kB 0 bytes -100.0% 🗑️
static/KaTeX_Size2-Regular.*.woff2 (Deleted) -5.21kB 0 bytes -100.0% 🗑️
static/KaTeX_Size4-Regular.*.woff2 (Deleted) -4.93kB 0 bytes -100.0% 🗑️
static/KaTeX_Size3-Regular.*.woff (Deleted) -4.42kB 0 bytes -100.0% 🗑️
static/KaTeX_Size3-Regular.*.woff2 (Deleted) -3.62kB 0 bytes -100.0% 🗑️
view changes for bundle: antdx-array-push

Assets Changed:

Asset Name Size Change Total Size Change (%)
antdx.min.js 88 bytes 1.91MB 0.0%

@github-actions
Copy link
Contributor

github-actions bot commented Feb 5, 2026

Preview is ready

@dosubot dosubot bot added the bug Something isn't working label Feb 5, 2026
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Feb 5, 2026

📝 Walkthrough

概览

该PR为BubbleList引入了按项目的样式和类名自定义功能,通过新增的stylesclassNames属性支持灵活配置。同时细化了类型定义,引入ListSemanticType以区分BubbleList和BubbleItem的语义类型。配置优先级明确为:items > role > BubbleList设置。更新了对应的文档和测试。

更改内容

Cohort / File(s) Summary
核心实现
packages/x/components/bubble/BubbleList.tsx
新增stylesclassNames属性到BubbleListItem,支持按项目级别的样式和类名覆盖。引入SemanticType类型导入,实现了对象root/scroll键的排除以确保作用域一致。
类型系统
packages/x/components/bubble/interface.ts
引入新的ListSemanticType类型。细化SemanticType为基础语义类型,同时更新BubbleItemType和BubbleListProps以使用相应的类型定义,明确区分项目级和列表级的样式映射。
测试更新
packages/x/components/bubble/__tests__/list.test.tsx
更新测试用例以验证新的样式和类名定制API,包括验证自定义样式优先级、旧默认类不存在等场景。
文档与演示
packages/x/components/bubble/index.en-US.md, index.zh-CN.md, demo/_semantic-list.tsx
新增配置优先级文档说明,更新演示中的divider位置和容器高度,补充了对system/divider角色自定义渲染的指导。

评估代码审查工作量

🎯 3 (中等) | ⏱️ ~25 分钟

诗歌

🐰 小泡泡们排成行,
样式优先级更分明,
项目覆盖角色范,
清晰的配置我设想,
兔子为此欣然唱! 🎨✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1
❌ Failed checks (1 inconclusive)
Check name Status Explanation Resolution
Title check ❓ Inconclusive PR标题'fix(Bubble.List): error style passport'过于模糊,未清楚说明具体修复内容,使用了模糊的词汇'error style passport'。 建议将标题改为更具体的描述,如'fix(Bubble.List): prevent styles.root from overriding styles.bubble',以清晰说明修复的具体问题。
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Linked Issues check ✅ Passed PR通过新增styles和classNames props实现了对styles.root错误传递到bubble item的修复,满足#1728的核心需求。
Out of Scope Changes 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 docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch fix/BL-style

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.

@gemini-code-assist
Copy link
Contributor

Summary of Changes

Hello @anxLiang, 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 addresses a bug in the Bubble.List component related to the incorrect application of styles and classNames. It ensures that styles and classNames are passed correctly based on a defined priority, enhancing the component's flexibility and predictability. The changes also include documentation updates and additional test cases to validate the fix.

Highlights

  • Style and ClassName Handling: Fixes an issue where styles and classNames were not being correctly passed to the Bubble component from the Bubble.List component. The root style and className from the items configuration now correctly override the bubble style and className from the Bubble.List configuration.
  • Priority of Configuration: Clarifies the priority of style configurations: items > role > Bubble.List.styles = Bubble.List.classNames. This ensures that styles defined directly on items take precedence over role-based styles, which in turn override the base styles defined on the Bubble.List.
  • Semantic DOM Configuration: Updates the documentation to reflect the correct usage and priority of semantic DOM configuration within the Bubble.List component.
  • Test Cases: Adds and modifies test cases to ensure styles and classNames are correctly applied to divider, system, and user roles within the Bubble.List component.

🧠 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
  • packages/x/components/bubble/BubbleList.tsx
    • Modified BubbleListItem to correctly apply styles and classNames, prioritizing items configuration over Bubble.List configuration.
    • Updated BubbleList to omit 'root' and 'scroll' classNames and styles when passing props to BubbleListItem.
  • packages/x/components/bubble/tests/list.test.tsx
    • Added and modified test cases to verify correct style and className application for divider, system, and user roles.
  • packages/x/components/bubble/demo/_semantic-list.tsx
    • Adjusted the height of the Bubble.List demo to accommodate the divider.
  • packages/x/components/bubble/index.en-US.md
    • Updated documentation to clarify the priority of style configurations and the usage of semantic DOM configuration.
  • packages/x/components/bubble/index.zh-CN.md
    • Updated documentation to clarify the priority of style configurations and the usage of semantic DOM configuration.
  • packages/x/components/bubble/interface.ts
    • Refactored SemanticType and ListSemanticType to remove redundant type definitions.
    • Updated BubbleItemType to use SemanticType instead of ListSemanticType.
Activity
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.

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 aims to fix an issue with style propagation in Bubble.List. The changes introduce a more robust way of handling styles and classNames, especially regarding the priority between Bubble.List props and item configurations. The type definitions in interface.ts have also been refactored for better clarity.

However, I found a significant issue in BubbleList.tsx where item-level styles completely overwrite Bubble.List-level styles instead of merging with them. This prevents the intended style cascade. I've provided a suggestion to fix this by explicitly merging the style objects.

The rest of the changes, including tests and documentation, look good and align with the goal of the PR.

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 `@packages/x/components/bubble/index.zh-CN.md`:
- Around line 155-158: Update the copy in the items property description to add
a space between "X" and "SDK" (change "当结合X SDK" to "当结合 X SDK"); specifically
edit the Markdown line describing the items property (mentions of Bubble.List,
useXChat and status) so the phrase reads "当结合 X SDK
[`useXChat`](/x-sdks/use-x-chat-cn) 使用时…" and ensure any other occurrences of
"当结合X SDK" in this document are updated consistently.

@github-actions
Copy link
Contributor

github-actions bot commented Feb 5, 2026

size-limit report 📦

Path Size
packages/x/dist/antdx.min.js 453.62 KB (+117 B 🔺)
packages/x-sdk/dist/x-sdk.min.js 7.91 KB
packages/x-markdown/dist/x-markdown.min.js 31.22 KB
packages/x-markdown/dist/plugins/latex.min.js 61.95 KB

@dosubot dosubot bot added the lgtm This PR has been approved by a maintainer label Feb 5, 2026
@kimteayon kimteayon merged commit 3b1de4c into main Feb 5, 2026
26 checks passed
@kimteayon kimteayon deleted the fix/BL-style branch February 5, 2026 09:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working lgtm This PR has been approved by a maintainer

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bubble.List styles.root 样式会应用到 styles.bubble 上

2 participants