diff --git a/packages/react/components/indicator/__tests__/indicator.test.tsx b/packages/react/components/indicator/__tests__/indicator.test.tsx
index b557ce354..0d380838c 100644
--- a/packages/react/components/indicator/__tests__/indicator.test.tsx
+++ b/packages/react/components/indicator/__tests__/indicator.test.tsx
@@ -64,4 +64,21 @@ describe('Indicator', () => {
expect(dot).toBeInTheDocument();
});
});
+
+ describe('Accessibility', () => {
+ it('labels the badge with the default variant', () => {
+ render();
+ expect(screen.getByRole('status')).toHaveAttribute(
+ 'aria-label',
+ 'accent indicator'
+ );
+ });
+
+ it('treats a null variant as accent', () => {
+ render();
+ const badge = screen.getByRole('status');
+ expect(badge).toHaveAttribute('aria-label', 'accent indicator');
+ expect(badge).toHaveClass(styles['indicator-variant-accent']);
+ });
+ });
});
diff --git a/packages/react/components/indicator/indicator.tsx b/packages/react/components/indicator/indicator.tsx
index e6dbbe29d..58c113d32 100644
--- a/packages/react/components/indicator/indicator.tsx
+++ b/packages/react/components/indicator/indicator.tsx
@@ -45,7 +45,9 @@ export const Indicator = ({
'aria-label': ariaLabel,
...props
}: IndicatorProps) => {
- const accessibilityLabel = ariaLabel || label || `${variant} indicator`;
+ const resolvedVariant = variant ?? 'accent';
+ const accessibilityLabel =
+ ariaLabel || label || `${resolvedVariant} indicator`;
return (