[joshblack]

Update our usage of @primer/live-region-element in favor of ariaNotify, using @github/arianotify-polyfill as a fallback for older browsers.

ariaNotify is baseline 2026 and will be the defacto way to make screen reader announcements moving forward. We recommend using it directly in components along with our existing helpers that help out with blocks that would like to do role="alert", role="status", etc

Changelog

New

• Add polyfill for ariaNotify and global type defs

Changed

• Remove @primer/live-region-element from packages/react
• Update Announce, AriaAlert, AriaStatus to use ariaNotify
• Update downstream components, tests, and stories as-needed

Removed

Rollout strategy

• No changes needed in github/github-ui

Testing & Reviewing

[changeset-bot]

🦋 Changeset detected

Latest commit: a288309

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/react	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

⚠️ Action required

👋 Hi, this pull request contains changes to the source code that github/github-ui depends on. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Check the integration testing docs for step-by-step instructions. Or, apply the integration-tests: skipped manually label to skip these checks.

[primer]

🤖 Lint issues have been automatically fixed and committed to this PR.

[primer]

🤖 Lint issues have been automatically fixed and committed to this PR.

[Copilot]

🟡 Changes recommended

Hook-only bundles can omit the required polyfill and crash announcements on browsers without native support, while hidden-text handling and the required minor-release changeset also remain unresolved.

3 open issues

• Import the announcement polyfill directly in hook callers · New
• Use a minor changeset for the announcement dependency migration · New
• Do not announce CSS-hidden text when rendered text is empty · New

What changed in this PR

Migrates Primer React’s screen reader announcements from @primer/live-region-element to ariaNotify, with a polyfill for older browsers.

Changes:

• Adds a shared announcement hook with local debounce and cancellation.
• Updates components and stories to use the new announcement API.
• Expands tests for timing, cancellation, hidden content, and StrictMode behavior.

File	Description
packages/​react/​src/​TreeView/​TreeView.test.tsx	Checks loading announcements through ariaNotify.
packages/​react/​src/​TextInput/​TextInput.test.tsx	Verifies counter announcement timing.
packages/​react/​src/​Textarea/​Textarea.test.tsx	Verifies counter announcement timing.
packages/​react/​src/​SelectPanel/​SelectPanel.tsx	Migrates announcements and cancels stale loading messages.
packages/​react/​src/​SelectPanel/​SelectPanel.test.tsx	Adds announcement cancellation and isolation coverage.
packages/​react/​src/​polyfills/​ariaNotify.ts	Imports the fallback and declares API types.
packages/​react/​src/​live-region/​useAnnounce.ts	Adds per-instance announcement scheduling and cancellation.
packages/​react/​src/​live-region/​index.ts	Exports the announcement hook internally.
packages/​react/​src/​live-region/​Announce.tsx	Uses element-scoped notifications and rendered text.
packages/​react/​src/​live-region/​__tests__/​test-helpers.ts	Removes the obsolete live-region helper.
packages/​react/​src/​live-region/​__tests__/​AriaStatus.test.tsx	Checks status notifications at the API boundary.
packages/​react/​src/​live-region/​__tests__/​AriaAlert.test.tsx	Checks alert notifications at the API boundary.
packages/​react/​src/​live-region/​__tests__/​Announce.test.tsx	Covers delays, cancellation, visibility, and StrictMode.
packages/​react/​src/​FilteredActionList/​useAnnouncements.tsx	Migrates list announcements and manages deferred work.
packages/​react/​src/​FilteredActionList/​useAnnouncements.test.tsx	Tests notification content and loading cancellation.
packages/​react/​src/​experimental/​SelectPanel2/​__tests__/​SelectPanelLoading.test.tsx	Checks loading messages through ariaNotify.
packages/​react/​src/​Button/​Button.features.stories.tsx	Updates counter announcement examples.
packages/​react/​src/​BranchName/​BranchName.features.stories.tsx	Updates the copy confirmation announcement.
packages/​react/​src/​Autocomplete/​AutocompleteMenu.tsx	Uses local scheduling for empty-result announcements.
packages/​react/​package.json	Replaces the dependency and preserves polyfill side effects.
package-lock.json	Records the dependency replacement.
.changeset/​select-panel-announcements.md	Documents stale SelectPanel announcement fixes.
.agents/​skills/​live-regions/​SKILL.md	Documents announcement APIs and testing guidance.

_{Review effort: Balanced}

[joshblack]

@copilot add a separate changeset for the minor bump that you're describing

[Copilot]

@joshblack I've opened a new pull request, #8642, to work on those changes. Once the pull request is ready, I'll request review from you.

[primer]

🤖 Lint issues have been automatically fixed and committed to this PR.