useLiveAnnouncer

Polite or assertive screen reader announcements for changes away from focus.

Announces short messages ("Saved", "3 results", "Copied") through shared visually hidden live regions. The regions exist before the first message so it is not lost, and repeating a message announces it again.

Usage

import { useLiveAnnouncer } from '@gaudi/design-system/hooks';
const { announce } = useLiveAnnouncer();
const save = async () => {  await saveDraft();  announce('Draft saved');};

Examples

Polite and assertive messages

Result count after typing settles

API

Accessibility

Use 'polite' for almost everything. Reserve 'assertive' for errors and time-critical changes, keep messages short, and never announce every keystroke or streamed token.

Notes

• announce(message, politeness) is also exported for non-React code.

Related