fix(InfoTip)!: Remove aria-live and implement focus mgmt

[dreamwasp]

Overview

Adds props to InfoTip for customizing the button's aria-label and aria-labelledby attribute. Also adds automatic focus management - when you open an InfoTip, focus moves to the content container. This removed aria-live since it's no longer needed.

PR Checklist

• Related to designs: N/A
• Related to JIRA ticket: GMT-216
• I have run this code to verify it works
• This PR includes unit tests for the code change
• This PR includes testing instructions for the code change
• The alpha package of this PR is passing end-to-end tests in all relevant Codecademy repositories

Testing Instructions

Auto-focus + keyboard nav (verify tab order makes sense!):

Floating without links:

1. Go to Default story with placement: "floating"
2. Tab to to InfoTip button + press enter - focus should automatically move to the popover content
3. Press Tab - should wrap back to button (no getting stuck in empty popover)
4. Also works with VO on click.

Floating with links:

1. Go to WithLinksOrButtons story
2. Open with keyboard - focus auto-moves to popover content
3. Tab through the links - should move naturally
4. After last link, Tab wraps back to InfoTip button
5. Shift+Tab from button - should exit backward to previous page element (no trap)

Inline without links:

1. Go to Default story (default inline placement)
2. Open with keyboard - focus auto-moves to tip content
3. Tab - moves to next element in document (normal flow)

Inline with links:

1. Make a quick test with inline placement + links
2. Open it - focus auto-moves to content
3. Tab through - should follow normal document flow with the links

GridForm + ConnectedForm

1. Head to the infotip section of GridForm or ConnectedForm + check it out

Screen reader check:

1. Use VO/NVDA to verify custom aria-role, label, and labelledby get announced
2. Make sure the auto-focus to content is smooth and announced properly

Finish and do a celebratory dance 🎉

PR Links and Envs

Repository	PR Link
Monolith	Monolith PR
Mono	Mono PR

[nx-cloud]

View your CI Pipeline Execution ↗ for commit d84e955

---

☁️ Nx Cloud last updated this comment at 2026-01-29 15:08:59 UTC

[LinKCoding]

Looks great!
Left a quick note for your consideration~

[LinKCoding]

This Omit makes me think that InfoTipPropsWithAriaLabel and InfoTipPropsWithAriaLabelledby can share an InfoTipsBaseProps (that get exported and used here)

and then the aria-* specific props be part of a discriminated union.

Food for thought :)

[codecov]

Codecov Report

❌ Patch coverage is 99.41520% with 1 line in your changes missing coverage. Please review.
✅ Project coverage is 89.09%. Comparing base (dba147a) to head (d84e955).
⚠️ Report is 1 commits behind head on main.
✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
packages/gamut/src/Tip/InfoTip/type-utils.ts	94.44%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #3215      +/-   ##
==========================================
- Coverage   89.65%   89.09%   -0.57%     
==========================================
  Files         353      236     -117     
  Lines        5065     4309     -756     
  Branches     1606     1469     -137     
==========================================
- Hits         4541     3839     -702     
+ Misses        516      462      -54     
  Partials        8        8              

Flag	Coverage Δ
main	?
pull-request	89.09% <99.41%> (?)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[LinKCoding]

Looked over Radio, CheckBox with InfoTip
and GridForm (which had a Radio with InfoTip)
and the VO announces the label now too! 🔥

[codecademydev]

📬 Published Alpha Packages:

@codecademy/gamut@67.6.6-alpha.eca584.0
@codecademy/gamut-kit@0.6.579-alpha.eca584.0
@codecademy/styleguide@78.5.6-alpha.eca584.0

[github-actions]

🚀 Styleguide deploy preview ready!

Preview URL: https://697b78bc197ea9db1afb4732--gamut-preview.netlify.app
Deploy Logs: https://app.netlify.com/projects/gamut-preview/deploys/697b78bc197ea9db1afb4732