Radix homepageRadix Homepage
PrimitivesAlpha

Announce

Announces messages to screen readers.

Features

  • Mirrors visual alert content in an `aria-live` container for proper screen reader support.

Install the component from your command line.

npm install @radix-ui/react-announce

Import the component.

import * as Announce from '@radix-ui/react-announce';
export default () => <Announce.Root />;

Use the announce primitive.

import * as Announce from '@radix-ui/react-announce';
export default () => <Announce.Root>Welcome to Radix.</Announce.Root>;

Contains the content to announce.

PropTypeDefault
asenumdiv
aria-atomicenumNo default value
aria-relevantenumNo default value
regionIdentifierstringNo default value
roleenumNo default value
typeenum"polite"