Repository navigation
feat: vbenCheckButtonGroup support clear and maxCount - #6329
Conversation
* 按钮组支持单选清除和多选限制最大选项数
|
WalkthroughThe changes introduce new properties and logic to the button group component, enabling optional clearing of single selections and limiting the number of selections in multi-select mode. UI controls and form schema updates are added to the playground for configuring these features, and the component's interface is extended to support the new options. Changes
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
⏰ Context from checks skipped due to timeout of 90000ms (5)
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. 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)
Other keywords and placeholders
CodeRabbit Configuration File (
|
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
packages/@core/ui-kit/shadcn-ui/src/components/button/button.ts(1 hunks)packages/@core/ui-kit/shadcn-ui/src/components/button/check-button-group.vue(2 hunks)playground/src/views/examples/button-group/index.vue(3 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (8)
- GitHub Check: Analyze (javascript-typescript)
- GitHub Check: Check (windows-latest)
- GitHub Check: Check (ubuntu-latest)
- GitHub Check: Lint (ubuntu-latest)
- GitHub Check: Test (windows-latest)
- GitHub Check: Lint (windows-latest)
- GitHub Check: post-update (windows-latest)
- GitHub Check: post-update (ubuntu-latest)
🔇 Additional comments (6)
packages/@core/ui-kit/shadcn-ui/src/components/button/button.ts (1)
32-53: LGTM! Well-structured interface extensions.The new properties are properly typed and documented. The interface correctly extends the button group functionality with:
allowClearfor single-selection clearingmaxCountfor limiting multi-selection count- Additional styling and configuration options
The TypeScript types are appropriate and the structure maintains consistency with existing patterns.
packages/@core/ui-kit/shadcn-ui/src/components/button/check-button-group.vue (2)
22-24: LGTM! Proper default values for new props.The default values are sensible:
allowClear: falsemaintains existing behavior by defaultmaxCount: 0indicates no limit by default
94-103: LGTM! Correct allowClear implementation.The single-selection clearing logic is well-implemented:
- Properly checks if the clicked value is already selected
- Clears the selection and sets model value to undefined
- Emits the appropriate event with undefined value
- Maintains existing behavior when allowClear is disabled
playground/src/views/examples/button-group/index.vue (3)
54-55: LGTM! Proper reactive property initialization.The
allowClearproperty is correctly added to the reactivecompPropsobject with an appropriate default value.
67-69: LGTM! Consistent form configuration.The
commonConfigaddition withlabelWidth: 150ensures consistent label formatting across the form controls.
116-129: LGTM! Comprehensive form controls for new features.The form schema additions are well-structured:
- allowClear: Appropriate
Switchcomponent with clear help text explaining single-selection clearing behavior- maxCount: Proper
InputNumbercomponent with helpful description of multi-selection limitsThe help text clearly communicates the expected behavior to users, making the playground an effective demonstration tool.
* 为按钮组添加icon插槽
* main: chore: release 5.5.7 feat: improve vbenCheckButtonGroup (vbenjs#6329)
* 'main' of https://github.com/baohaojie123/vue-vben-admin: (35 commits) chore: release 5.5.7 feat: improve vbenCheckButtonGroup (vbenjs#6329) types: 扩展user-dropdown组件的menus类型,支持iconify (vbenjs#6283) fix: resolve onClosed method failure in connectedComponent of useVbenModal (vbenjs#6309) fix: 修复使用useVbenVxeGrid配置hasEmptyText、hasEmptyRender不生效的问题 (vbenjs#6310) fix: When defaultHomePage is inconsistent with user.homePath, the pa… (vbenjs#6299) docs(settings): 完善'生产环境动态配置'步骤 (vbenjs#6297) fix: alert width fixed in small screen (vbenjs#6312) style: fix lint error (vbenjs#6298) feat: support for hybrid permission access control mode (vbenjs#6294) fix: fix table-title slot not work (vbenjs#6295) fix: Update index.ts (vbenjs#6268) fix: reset slider-captcha after login failed (vbenjs#6275) fix: json-bigint parse used in vxeTable (vbenjs#6271) fix: repair the unexpected form default value (vbenjs#5567) feat: optimize logo display (vbenjs#6267) feat: improve check updates (vbenjs#6257) feat: enhances compatibility with APIs returning large numeric values (vbenjs#6250) fix: component Input is not registered when initialize page (vbenjs#6246) feat: ellipsis text automatically displays tooltip based on ellipsis (vbenjs#6244) ... # Conflicts: # apps/web-naive/src/adapter/form.ts # apps/web-naive/src/bootstrap.ts # docs/src/components/common-ui/vben-ellipsis-text.md # docs/src/en/guide/in-depth/access.md # docs/src/guide/essentials/build.md # docs/src/guide/essentials/route.md
* main: chore: release 5.5.7 feat: improve vbenCheckButtonGroup (vbenjs#6329) # Conflicts: # apps/web-naive/src/adapter/form.ts # apps/web-naive/src/bootstrap.ts
Description
Type of change
Please delete options that are not relevant.
pnpm-lock.yamlunless you introduce a new test example.Checklist
pnpm run docs:devcommand.pnpm test.feat:,fix:,perf:,docs:, orchore:.Summary by CodeRabbit
New Features
Enhancements