Badge not showing on Toggle Panel tab (ButtonToggleGroup) — Freedom UI 8.x
I'm trying to display a notification badge dot on a specific tab inside a crt.ButtonToggleGroup toggle panel. Despite following the Academy docs and trying multiple configurations, the badge never appears on the tab button.
I also tried "badge": { "value": "1" } first (which is wrong per docs), then switched to "badge": { "visible": true } as documented, but neither shows any badge. The tab itself renders correctly with the icon, caption, and visibility working fine — only the badge dot is missing.
What I've already ruled out
Correct parent — NextStepsTabContainer is a direct child of CardToggleTabPanel, not the regular tabs panel.
Active tab is not selected — tested by opening a different tab first so NextStepsTabContainer is not active.
for reference is correct — CardButtonToggleGroup correctly references CardToggleTabPanel.
Package compiled and page hard-refreshed — full recompile done, not just save.
Questions
- Does
"badge": { "visible": true }actually work on a tab that uses"iconPosition": "only-icon"? Could icon-only mode be suppressing the badge? - Is there a known issue with
"operation": "merge"not applying thebadgeobject to an existingTabContainer? Does it require"operation": "insert"? - Has anyone successfully implemented
badgeConfigon an OOB (out-of-box) toggle panel by customising the existing schema? A working example would be hugely helpful.
Platform version: Creatio 8.x (Freedom UI) · Docs referenced: Toggle panel customization, ButtonTogglePanel reference
What I've tried:
My current viewConfigDiff setup:
{
"operation": "merge",
"name": "CardButtonToggleGroup",
"values": {
"type": "crt.ButtonToggleGroup",
"for": "CardToggleTabPanel",
"badgeConfig": {
"color": "accent",
"offset": -4
}
}
},
{
"operation": "merge",
"name": "CardToggleTabPanel",
"values": {
"type": "crt.TabPanel",
"mode": "toggle",
"styleType": "default",
"bodyBackgroundColor": "primary-contrast-500",
"selectedTabTitleColor": "auto",
"tabTitleColor": "auto",
"underlineSelectedTabColor": "auto",
"headerBackgroundColor": "auto",
"allowToggleClose": false,
"isToggleTabHeaderVisible": true
}
},
{
"operation": "merge",
"name": "NextStepsTabContainer",
"values": {
"type": "crt.TabContainer",
"caption": "#ResourceString(NextStepsTabContainer_caption)#",
"badge": {
"visible": true
},
"icon": "task-tab-icon",
"iconSize": "large",
"visible": true
}
}
Like
Hello,
The issue is related to version 8.3.3, where only the badge with the "warn" color can be configured. This limitation has been addressed in version 8.3.4, where the issue no longer occurs.