From 2773369cfbd4003d7bd87baa6e6a04e6f43f7cdb Mon Sep 17 00:00:00 2001 From: Randall Krauskopf Date: Wed, 9 Oct 2024 14:45:27 -0500 Subject: [PATCH] add support for className prop in the avatar stack --- .../react/src/AvatarStack/AvatarStack.tsx | 20 +++++++++++++++---- 1 file changed, 16 insertions(+), 4 deletions(-) diff --git a/packages/react/src/AvatarStack/AvatarStack.tsx b/packages/react/src/AvatarStack/AvatarStack.tsx index 24667bbb69c..95e4449b7f9 100644 --- a/packages/react/src/AvatarStack/AvatarStack.tsx +++ b/packages/react/src/AvatarStack/AvatarStack.tsx @@ -183,10 +183,18 @@ export type AvatarStackProps = { alignRight?: boolean disableExpand?: boolean size?: number | ResponsiveValue + className?: string children: React.ReactNode } & SxProp -const AvatarStack = ({children, alignRight, disableExpand, size, sx: sxProp = defaultSxProp}: AvatarStackProps) => { +const AvatarStack = ({ + children, + alignRight, + disableExpand, + size, + className, + sx: sxProp = defaultSxProp, +}: AvatarStackProps) => { const count = React.Children.count(children) const wrapperClassNames = clsx({ 'pc-AvatarStack--two': count === 2, @@ -194,9 +202,13 @@ const AvatarStack = ({children, alignRight, disableExpand, size, sx: sxProp = de 'pc-AvatarStack--three-plus': count > 3, 'pc-AvatarStack--right': alignRight, }) - const bodyClassNames = clsx('pc-AvatarStackBody', { - 'pc-AvatarStack--disableExpand': disableExpand, - }) + const bodyClassNames = clsx( + 'pc-AvatarStackBody', + { + 'pc-AvatarStack--disableExpand': disableExpand, + }, + className, + ) const getAvatarChildSizes = () => { const avatarSizeMap: Record = {