fix(AvatarGroup): fix counter styles

[talkor]

User description

Had to make the selector stronger, MenuButton styles (if loaded before AvatarGroup) override it
https://monday.monday.com/boards/3532714909/pulses/18059731462

---

PR Type

Bug fix

---

Description

• Increase CSS selector specificity for counter styles

• Prevent MenuButton styles from overriding AvatarGroup counter

---

Diagram Walkthrough

flowchart LR
  A["MenuButton styles"] -- "overrides" --> B["AvatarGroup counter"]
  C["Increased specificity"] -- "prevents override" --> D["Fixed counter styles"]

Loading

File Walkthrough

	Relevant files
Bug fix	AvatarGroupCounter.module.scss Increase counter container selector specificity                    packages/core/src/components/AvatarGroup/AvatarGroupCounter.module.scss Duplicate class selector to increase CSS specificity Prevent style conflicts with MenuButton component +1/-1

---

[github-actions]

A new prerelease version of this PR has been published! 🎉
To install this prerelease version, run the following command in your terminal with any one of the packages changed in this PR:

To update @vibe/core:

yarn add @vibe/[email protected]

Or with npm:

npm i @vibe/[email protected]

[github-actions]

📦 Bundle Size Analysis

✅ No bundle size changes detected.

Unchanged Components

Component	Base	PR	Diff
Accordion	6.33KB	6.33KB	0B ➖
AccordionItem	67.76KB	67.76KB	0B ➖
AlertBanner	72.47KB	72.47KB	0B ➖
AlertBannerButton	19.02KB	19.02KB	0B ➖
AlertBannerLink	15.36KB	15.36KB	0B ➖
AlertBannerText	65.16KB	65.16KB	0B ➖
AttentionBox	73.93KB	73.93KB	0B ➖
AttentionBoxLink	15.23KB	15.23KB	0B ➖
Avatar	68.05KB	68.05KB	0B ➖
AvatarGroup	95.21KB	95.22KB	+20B 🔺
Badge	43.48KB	43.48KB	0B ➖
Box	9.28KB	9.28KB	0B ➖
BreadcrumbItem	65.86KB	65.86KB	0B ➖
BreadcrumbMenu	69.95KB	69.95KB	0B ➖
BreadcrumbMenuItem	78.68KB	78.68KB	0B ➖
BreadcrumbsBar	5.76KB	5.76KB	0B ➖
Button	18.71KB	18.71KB	0B ➖
ButtonGroup	69.94KB	69.94KB	0B ➖
Checkbox	68.06KB	68.06KB	0B ➖
Chips	76.68KB	76.68KB	0B ➖
Clickable	6.25KB	6.25KB	0B ➖
ColorPicker	75.73KB	75.73KB	0B ➖
ColorPickerContent	75.03KB	75.03KB	0B ➖
Combobox	85.57KB	85.57KB	0B ➖
Counter	42.39KB	42.39KB	0B ➖
DatePicker	134.16KB	134.16KB	0B ➖
Dialog	54KB	54KB	0B ➖
DialogContentContainer	6.29KB	6.29KB	0B ➖
Divider	5.54KB	5.54KB	0B ➖
Dropdown	125.16KB	125.16KB	0B ➖
menu	59.93KB	59.93KB	0B ➖
option	92.74KB	92.74KB	0B ➖
singleValue	92.7KB	92.7KB	0B ➖
EditableHeading	67.76KB	67.76KB	0B ➖
EditableText	67.66KB	67.66KB	0B ➖
EmptyState	72.39KB	72.39KB	0B ➖
ExpandCollapse	67.59KB	67.59KB	0B ➖
Flex	7.47KB	7.47KB	0B ➖
FormattedNumber	5.87KB	5.87KB	0B ➖
GridKeyboardNavigationContext	4.65KB	4.65KB	0B ➖
Heading	66.44KB	66.44KB	0B ➖
HiddenText	5.41KB	5.41KB	0B ➖
CustomSvgIcon	11.81KB	11.81KB	0B ➖
Icon	13.79KB	13.79KB	0B ➖
IconButton	69.65KB	69.65KB	0B ➖
Label	69.98KB	69.98KB	0B ➖
LayerProvider	2.95KB	2.95KB	0B ➖
LegacyModal	76.32KB	76.32KB	0B ➖
LegacyModalContent	66.51KB	66.51KB	0B ➖
LegacyModalFooter	3.45KB	3.45KB	0B ➖
LegacyModalFooterButtons	20.49KB	20.49KB	0B ➖
LegacyModalHeader	72.47KB	72.47KB	0B ➖
Link	14.98KB	14.98KB	0B ➖
List	74.39KB	74.39KB	0B ➖
ListItem	67.04KB	67.04KB	0B ➖
ListItemAvatar	68.14KB	68.14KB	0B ➖
ListItemIcon	14.09KB	14.09KB	0B ➖
ListTitle	66.56KB	66.56KB	0B ➖
Loader	5.84KB	5.84KB	0B ➖
Menu	8.67KB	8.67KB	0B ➖
MenuDivider	5.62KB	5.62KB	0B ➖
MenuGridItem	7.18KB	7.18KB	0B ➖
MenuItem	78.71KB	78.71KB	0B ➖
MenuItemButton	71.72KB	71.72KB	0B ➖
MenuTitle	66.82KB	66.82KB	0B ➖
MenuButton	67.53KB	67.53KB	0B ➖
MultiStepIndicator	53.05KB	53.05KB	0B ➖
NumberField	74.53KB	74.53KB	0B ➖
LinearProgressBar	7.43KB	7.43KB	0B ➖
RadioButton	67.29KB	67.29KB	0B ➖
Search	71.98KB	71.98KB	0B ➖
Skeleton	6.19KB	6.19KB	0B ➖
Slider	75.53KB	75.53KB	0B ➖
SplitButton	68.34KB	68.34KB	0B ➖
SplitButtonMenu	8.8KB	8.8KB	0B ➖
Steps	73.05KB	73.05KB	0B ➖
Table	7.28KB	7.28KB	0B ➖
TableBody	68.28KB	68.28KB	0B ➖
TableCell	66.58KB	66.58KB	0B ➖
TableContainer	5.36KB	5.36KB	0B ➖
TableHeader	5.67KB	5.67KB	0B ➖
TableHeaderCell	73.81KB	73.81KB	0B ➖
TableRow	5.61KB	5.61KB	0B ➖
TableRowMenu	70.28KB	70.28KB	0B ➖
TableVirtualizedBody	72.91KB	72.91KB	0B ➖
Tab	65.22KB	65.22KB	0B ➖
TabList	8.92KB	8.92KB	0B ➖
TabPanel	5.31KB	5.31KB	0B ➖
TabPanels	5.92KB	5.92KB	0B ➖
TabsContext	5.53KB	5.53KB	0B ➖
Text	66.41KB	66.41KB	0B ➖
TextArea	67.7KB	67.7KB	0B ➖
TextField	70.97KB	70.97KB	0B ➖
TextWithHighlight	65.59KB	65.59KB	0B ➖
ThemeProvider	4.69KB	4.69KB	0B ➖
Tipseen	72.93KB	72.93KB	0B ➖
TipseenContent	73.37KB	73.37KB	0B ➖
TipseenImage	73.25KB	73.25KB	0B ➖
TipseenMedia	73.02KB	73.02KB	0B ➖
TipseenWizard	75.62KB	75.62KB	0B ➖
Toast	75.68KB	75.68KB	0B ➖
ToastButton	18.93KB	18.93KB	0B ➖
ToastLink	15.19KB	15.19KB	0B ➖
Toggle	68.01KB	68.01KB	0B ➖
Tooltip	64.39KB	64.39KB	0B ➖
TransitionView	37.71KB	37.71KB	0B ➖
VirtualizedGrid	12.56KB	12.56KB	0B ➖
VirtualizedList	12.33KB	12.33KB	0B ➖

---

📊 Summary:

• Total Base Size: 5.05MB
• Total PR Size: 5.05MB
• Total Difference: +20B

[qodo-merge-for-open-source]

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

⏱️ Estimated effort to review: 1 🔵⚪⚪⚪⚪

🧪 No relevant tests

🔒 No security concerns identified

⚡ Recommended focus areas for review Specificity Approach Duplicating the class to increase specificity can make future overrides harder and may signal a cascading order issue; consider using :where(), :is(), or refactoring load order to avoid escalating specificity. .counterContainer.counterContainer { background: var(--ui-background-color); Scope Impact The stronger selector applies globally to all .counterContainer instances; ensure no unintended overrides occur in other contexts or themes relying on the original specificity. .counterContainer.counterContainer { background: var(--ui-background-color); display: flex; justify-content: center; align-items: center;