Skip to content

Live Region

A component used to announce dynamic content changes to screen readers without moving focus.

Live regions are critical for keeping screen reader users informed about background updates, such as search results loading or items being added to a cart.

How it works

  • Politeness: Supports polite (wait for silence) and assertive (interrupt) modes.
  • Atomic: Can announce the region as a single unit using aria-atomic.

Usage Example

import { LiveRegion } from '@holmdigital/components'; <LiveRegion politeness="polite"> {results.length > 0 ? `Found ${results.length} items` : ''} </LiveRegion>