feat(Checkbox): CheckboxGroup 支持独立按钮风格多选框组 - #4340
Open
xy200303 wants to merge 1 commit into
Open
Conversation
- add theme/variant/size/direction API to CheckboxGroup - options render as independent tag-like buttons when theme is button - add Checkbox.Button component, reusing t-checkbox inner class names - support outline, default-filled and primary-filled variants and vertical layout - related to Tencent/tdesign-common#2562, works with Tencent/tdesign-common#2641
xy200303
requested review from
HaixingOoO,
NWYLZW,
RylanBot,
ZWkang,
carolin913,
honkinglin and
uyarn
as code owners
July 30, 2026 04:08
16 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
🤔 这个 PR 的性质是?
🔗 相关 Issue
💡 需求背景和解决方案
权限分配、功能开关等场景需要快速核对多个已选项。本 PR 为 CheckboxGroup 补充按钮风格的组件实现,配合 tdesign-common#2641 的独立按钮样式:每个选项保持独立边框和圆角,选中背景直接落在对应选项上,横向空间不足时自然换行。
与 #4337 的连体分段方案不同,本方案选项互不共享边框,多个已选项互不影响,增删、重排、换行均不会破坏边框闭合。
最终 API(CheckboxGroup 新增)
checkbox/buttoncheckboxoutline/default-filled/primary-filleddefault-filledsmall/medium/largemediumhorizontal/verticalhorizontal用法:
实现说明
Checkbox.Button组件,基于common/Check扩展checkbox-button类型,根节点输出t-checkbox-button,内部元素复用t-checkbox__former/input/label,与 tdesign-common#2641 的样式选择器对齐theme="button"时输出,不影响默认渲染Checkbox.Button子节点可被max/checkAll逻辑正确识别验证
lint:tsc、eslint、csr/ssr 快照测试通过,已补充 3 个新 demo 的快照📝 更新日志
☑️ 请求合并前的自查清单