首页
/ Carbon Design System v11.76.0 版本更新解析

Carbon Design System v11.76.0 版本更新解析

2025-06-07 17:55:51作者:邓越浪Henry

Carbon Design System 是 IBM 开发的一套开源设计系统,它为构建企业级应用提供了全面的 UI 组件、设计指南和开发工具。该系统遵循 IBM 设计语言,强调可用性、一致性和可访问性,广泛应用于各种企业级产品和解决方案中。

核心组件更新

图标与图形增强

本次更新在图标系统方面带来了显著改进。新增了2024年12月至2025年1月期间设计的多款新图标,这些图标覆盖了更广泛的使用场景,为开发者提供了更多选择。同时,在图形符号方面,引入了三个版本的新图形(v25、v25生产版和v26),这些图形符号在企业级数据可视化场景中将发挥重要作用。

表格组件优化

TableRow 组件现在支持 forwardRef,这一改进使得开发者能够更灵活地控制表格行的引用,特别是在需要直接操作DOM元素或集成第三方库时。这种增强为复杂表格交互场景提供了更好的支持。

交互体验改进

通知组件行为调整

ActionableNotification 组件现在支持更灵活的角色定义。当开发者提供自定义角色时,组件会自动移除焦点环绕行为,这使得通知组件能够更好地适应各种可访问性需求和交互模式。

弹出框组件升级

Popover 组件现在支持多态属性(PolymorphicProps),这意味着开发者可以更灵活地定义弹出框的容器元素类型,不再局限于默认的div元素。这种改进为语义化HTML和可访问性优化提供了更多可能性。

可访问性修复

屏幕阅读器优化

修复了ToggleTip组件内容被屏幕阅读器重复读取的问题,提升了辅助技术用户的体验。同时,改进了通知组件的焦点管理,确保键盘导航时不会出现意外的焦点环绕行为。

表单交互改进

针对TextInput组件的计数器功能进行了增强,现在流体文本输入框也支持启用字符计数器。此外,修复了表单控件onChange事件被多次触发的问题,确保交互行为更加精确和可预测。

样式系统调整

菜单层级显示修复

解决了三级嵌套选项在OverflowMenu中的显示问题,确保复杂菜单结构能够正确呈现。这一修复对于具有深层级导航的应用尤为重要。

工具提示样式优化

改进了Tooltip组件的文本换行行为,确保长文本内容能够合理显示而不会破坏布局。同时修复了有序列表在非原生ol元素中的定位问题,提升了列表的视觉一致性。

升级工具增强

本次更新为Carbon升级工具(@carbon/upgrade)添加了多个有用的代码转换器:

  1. 新增了将slug属性替换为decorator的转换器
  2. 添加了启用v12 Tile默认图标的转换器
  3. 引入了启用v12 Tile单选图标的转换器

这些自动化工具大大简化了从旧版本迁移到新版本的工作量,特别是对于大型项目而言。

日期时间工具改进

日期时间格式化工具现在能够智能处理"0年"的显示情况,避免在时间差计算中显示无意义的"0年",使时间显示更加人性化和易读。

Web组件修复

Web组件版本(@carbon/web-components)也获得了多项重要修复:

  1. 改进了CopyButton组件,确保与React版本的行为一致
  2. 修复了DatePicker组件在没有日历实例时的错误处理
  3. 修正了Button组件的dangerDescriptor属性名称为dangerDescription
  4. 优化了Tooltip的文本换行行为

这些改进使得Web组件版本更加稳定和可靠,特别是在跨框架使用时。

总结

Carbon Design System v11.76.0版本在保持系统稳定性的同时,带来了多项实用改进和新功能。从图标资源的丰富到核心组件的优化,从可访问性修复到开发工具增强,这次更新全面提升了开发体验和最终用户的使用感受。特别值得注意的是对复杂交互场景的支持和对可访问性的持续关注,体现了Carbon作为企业级设计系统的成熟度。

对于正在使用Carbon的团队,建议重点关注Popover的多态属性支持、表单交互的改进以及升级工具提供的新转换器,这些特性可以显著提升开发效率和用户体验。同时,各种可访问性修复也值得及时应用到现有项目中,以确保产品符合最新的无障碍标准。

登录后查看全文
热门项目推荐
相关项目推荐

项目优选

收起
ohos_react_nativeohos_react_native
React Native鸿蒙化仓库
C++
176
261
RuoYi-Vue3RuoYi-Vue3
🎉 (RuoYi)官方仓库 基于SpringBoot,Spring Security,JWT,Vue3 & Vite、Element Plus 的前后端分离权限管理系统
Vue
860
511
ShopXO开源商城ShopXO开源商城
🔥🔥🔥ShopXO企业级免费开源商城系统,可视化DIY拖拽装修、包含PC、H5、多端小程序(微信+支付宝+百度+头条&抖音+QQ+快手)、APP、多仓库、多商户、多门店、IM客服、进销存,遵循MIT开源协议发布、基于ThinkPHP8框架研发
JavaScript
93
15
openGauss-serveropenGauss-server
openGauss kernel ~ openGauss is an open source relational database management system
C++
129
182
openHiTLSopenHiTLS
旨在打造算法先进、性能卓越、高效敏捷、安全可靠的密码套件,通过轻量级、可剪裁的软件技术架构满足各行业不同场景的多样化要求,让密码技术应用更简单,同时探索后量子等先进算法创新实践,构建密码前沿技术底座!
C
259
300
kernelkernel
deepin linux kernel
C
22
5
cherry-studiocherry-studio
🍒 Cherry Studio 是一款支持多个 LLM 提供商的桌面客户端
TypeScript
595
57
CangjieCommunityCangjieCommunity
为仓颉编程语言开发者打造活跃、开放、高质量的社区环境
Markdown
1.07 K
0
HarmonyOS-ExamplesHarmonyOS-Examples
本仓将收集和展示仓颉鸿蒙应用示例代码,欢迎大家投稿,在仓颉鸿蒙社区展现你的妙趣设计!
Cangjie
398
371
Cangjie-ExamplesCangjie-Examples
本仓将收集和展示高质量的仓颉示例代码,欢迎大家投稿,让全世界看到您的妙趣设计,也让更多人通过您的编码理解和喜爱仓颉语言。
Cangjie
332
1.08 K