a11y | Bump design-system for D2–D5 and A7/A8

[BrianGenisio]

Summary

Bumps design-system to learn_bespoke-design-system main at d21d15d so ChatCPT picks up the remaining Wave 2/3 DS a11y fixes (D2–D5, A7, A8) plus the number-input wheel helper.

Also adapts the app to the new DS contracts and ratchets the shrink-only axe baseline (settings scans are now clean; empty-state only keeps region).

Changes

• Submodule 8f6c1da → d21d15d: dropdown focus/listbox/aria-selected, slider role on handles, contrast tokens, optional input.js
• Temperature (D5/D6): aria-labelledby / aria-describedby on the handle (role="slider"), not the wrapper
• PortalDropdown: always assign portal-dropdown-menu-* id (base D3 always sets a listbox id)
• Composer hint (A8): remove opacity: 0.8 so Text-Body-Lighter keeps 4.5:1
• Axe baseline: drop color-contrast and nested-interactive leftovers from settings scans
• Vitest: exclude design-system/** (Playwright suite lives there)

Test plan

• npm test (206 passed)
• Axe CI audit updated baseline; settings modal light/dark: 0 violations; thinking menu aria-selected: 5/5
• Manual: Settings (light + dark) — Tab into Thinking list, select option, focus returns; Temperature slider keyboard + AT name
• Manual: focus rings and sidebar/composer muted text look acceptable after token change
• Confirm empty-state still has only the known region landmark gap (moderate; out of critical/serious scope)

Made with Cursor

[coderabbitai]

📝 Walkthrough

Walkthrough

The change updates accessibility semantics for the temperature slider and composer hint. Portal dropdowns now receive deterministic menu IDs. Accessibility audit baselines record resolved findings and a new date. Vitest excludes the design-system directory, which uses a separate test runner. The design-system submodule reference also advances.

Possibly related PRs

• CodeSignal/learn_cosmo-chat#38: Introduced the accessibility baseline that this change updates.
• CodeSignal/learn_cosmo-chat#54: Updated the same design-system submodule and accessibility baseline.
• CodeSignal/learn_cosmo-chat#56: Modified the temperature slider ARIA associations and related tests.

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the accessibility scope and the design-system update, which are the main changes in the pull request.
Description check	✅ Passed	The description accurately covers the design-system update, app adaptations, accessibility baseline changes, and test status.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

---

_{Comment @coderabbitai help to get the list of available commands.}

[BrianGenisio]

@coderabbitai review

[coderabbitai]

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[coderabbitai]

🧹 Nitpick comments (1)

tests/dom/render.test.js (1)

557-563: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Cover the complete slider accessibility contract.

The test verifies the role move, but it does not assert that the handle has no aria-label or that the wrapper has no aria-labelledby and aria-describedby. Add these assertions so a later design-system change cannot restore the old semantics without failing this test.

Suggested assertions

     expect(wrapper?.getAttribute('role')).toBeNull();
+    expect(wrapper?.getAttribute('aria-labelledby')).toBeNull();
+    expect(wrapper?.getAttribute('aria-describedby')).toBeNull();
+    expect(slider?.getAttribute('aria-label')).toBeNull();

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@tests/dom/render.test.js` around lines 557 - 563, Extend the slider
accessibility assertions in the test around the temperature slider handles:
verify the slider handle has no aria-label, and the presentational wrapper has
no aria-labelledby or aria-describedby. Keep the existing role assertions and
label/description checks unchanged.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In `@tests/dom/render.test.js`:
- Around line 557-563: Extend the slider accessibility assertions in the test
around the temperature slider handles: verify the slider handle has no
aria-label, and the presentational wrapper has no aria-labelledby or
aria-describedby. Keep the existing role assertions and label/description checks
unchanged.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 183cb804-4081-4bb0-adb6-4a44be6dc310

📥 Commits

Reviewing files that changed from the base of the PR and between 6ea6866 and 940a8e4.

📒 Files selected for processing (7)

• a11y-audits/tools/baseline.json
• design-system
• public/app.css
• public/app.js
• public/portal-dropdown.js
• tests/dom/render.test.js
• vitest.config.js