diff --git a/.changeset/itchy-turtles-matter.md b/.changeset/itchy-turtles-matter.md new file mode 100644 index 00000000000..b5b12c6daa8 --- /dev/null +++ b/.changeset/itchy-turtles-matter.md @@ -0,0 +1,7 @@ +--- +"@primer/react": patch +--- + +AvatarStack: Both `disableExpand` and `rightAlign` can be passed together now + + diff --git a/src/AvatarStack/AvatarStack.tsx b/src/AvatarStack/AvatarStack.tsx index e712a90ed98..5d5c906ba7b 100644 --- a/src/AvatarStack/AvatarStack.tsx +++ b/src/AvatarStack/AvatarStack.tsx @@ -116,7 +116,7 @@ const AvatarStackWrapper = styled.span` .pc-AvatarStackBody { flex-direction: row-reverse; - &:hover { + &:not(.pc-AvatarStack--disableExpand):hover { .pc-AvatarItem { margin-right: ${get('space.1')}!important; margin-left: 0 !important; diff --git a/src/__tests__/__snapshots__/AvatarStack.test.tsx.snap b/src/__tests__/__snapshots__/AvatarStack.test.tsx.snap index a6da88bd8c9..8ab34d6f7a4 100644 --- a/src/__tests__/__snapshots__/AvatarStack.test.tsx.snap +++ b/src/__tests__/__snapshots__/AvatarStack.test.tsx.snap @@ -105,12 +105,12 @@ exports[`Avatar renders consistently 1`] = ` flex-direction: row-reverse; } -.c0.pc-AvatarStack--right .pc-AvatarStackBody:hover .pc-AvatarItem { +.c0.pc-AvatarStack--right .pc-AvatarStackBody:not(.pc-AvatarStack--disableExpand):hover .pc-AvatarItem { margin-right: 4px!important; margin-left: 0 !important; } -.c0.pc-AvatarStack--right .pc-AvatarStackBody:hover .pc-AvatarItem:first-child { +.c0.pc-AvatarStack--right .pc-AvatarStackBody:not(.pc-AvatarStack--disableExpand):hover .pc-AvatarItem:first-child { margin-right: 0 !important; } @@ -267,12 +267,12 @@ exports[`Avatar respects alignRight props 1`] = ` flex-direction: row-reverse; } -.c0.pc-AvatarStack--right .pc-AvatarStackBody:hover .pc-AvatarItem { +.c0.pc-AvatarStack--right .pc-AvatarStackBody:not(.pc-AvatarStack--disableExpand):hover .pc-AvatarItem { margin-right: 4px!important; margin-left: 0 !important; } -.c0.pc-AvatarStack--right .pc-AvatarStackBody:hover .pc-AvatarItem:first-child { +.c0.pc-AvatarStack--right .pc-AvatarStackBody:not(.pc-AvatarStack--disableExpand):hover .pc-AvatarItem:first-child { margin-right: 0 !important; }