diff --git a/.changeset/dirty-wasps-behave.md b/.changeset/dirty-wasps-behave.md new file mode 100644 index 00000000000..f0d97a4ff78 --- /dev/null +++ b/.changeset/dirty-wasps-behave.md @@ -0,0 +1,5 @@ +--- +"@primer/react": patch +--- + +Add className back to TokenBase diff --git a/packages/react/src/Token/AvatarToken.tsx b/packages/react/src/Token/AvatarToken.tsx index c6b70005639..b658fb7df30 100644 --- a/packages/react/src/Token/AvatarToken.tsx +++ b/packages/react/src/Token/AvatarToken.tsx @@ -70,6 +70,7 @@ const AvatarToken = forwardRef(({avatarSrc, id, size = defaultTokenSize, classNa sx={{ paddingLeft: get('space.1'), }} + className={className} {...rest} ref={forwardedRef} /> diff --git a/packages/react/src/Token/IssueLabelToken.tsx b/packages/react/src/Token/IssueLabelToken.tsx index a8b1f409d67..830eb0f0e12 100644 --- a/packages/react/src/Token/IssueLabelToken.tsx +++ b/packages/react/src/Token/IssueLabelToken.tsx @@ -180,6 +180,7 @@ const IssueLabelToken = forwardRef((props, forwardedRef) => { text={text} size={size} sx={labelStyles} + className={className} {...(!hasMultipleActionTargets ? interactiveTokenProps : {})} {...rest} ref={forwardedRef} diff --git a/packages/react/src/Token/Token.tsx b/packages/react/src/Token/Token.tsx index c13e4807920..49a6183f52a 100644 --- a/packages/react/src/Token/Token.tsx +++ b/packages/react/src/Token/Token.tsx @@ -136,6 +136,7 @@ const Token = forwardRef((props, forwardedRef) => { text={text} size={size} sx={mergedSx} + className={className} {...(!hasMultipleActionTargets ? interactiveTokenProps : {})} {...rest} ref={forwardedRef} diff --git a/packages/react/src/Token/TokenBase.tsx b/packages/react/src/Token/TokenBase.tsx index 89b3b28219a..74bee51336c 100644 --- a/packages/react/src/Token/TokenBase.tsx +++ b/packages/react/src/Token/TokenBase.tsx @@ -173,6 +173,7 @@ const TokenBase = React.forwardRef { + const {getByText} = HTMLRender() + const domNode = getByText('token') + + expect(domNode.parentElement).toHaveClass('testing-class') + }) + it('should have no axe violations', async () => { const {container} = HTMLRender() const results = await axe.run(container)