♿ WCAG 2.1 AA Phase 2 Audit: Fix accessibility issues in top 10 views#195
Merged
dgarson merged 122 commits intofeat/horizon-ui-phase1-cleanupfrom Mar 3, 2026
Merged
♿ WCAG 2.1 AA Phase 2 Audit: Fix accessibility issues in top 10 views#195dgarson merged 122 commits intofeat/horizon-ui-phase1-cleanupfrom
dgarson merged 122 commits intofeat/horizon-ui-phase1-cleanupfrom
Conversation
…, wave countdowns, 15 agents, Brave key alert
…coveryWaveResults, DiscoveryAgentCostTracker, ToolReliabilityDashboard)
…rison, findings search)
…cker, SettingsPanel, LogStream)
…tructure
Agent: luis
Original branch: feat/horizon-post-merge
Working on: horizon-ux-views
Reason: restructuring workspace so git repos live at git/{reponame}/
All untracked config + code changes captured here.
…indingTrendChart, AgentSkillHeatmap) — batch 6PM
…emediationTracker) — batch 6:15PM
…penclaw#313) - New AgentTopologyMap.tsx: pure SVG + React state, no external graph libs - Static concentric layout: principals (r=210), crons (r=115), workers (r=65 from spawner) - Node types: Principal (violet circle), Worker (blue circle), Cron (amber diamond) - Interactive: click-to-inspect detail panel (280px), hover scale effect - Toolbar: Live/Paused toggle, Reset View, session count badge, legend - Mock data: 6 principals, 4 workers (from Luis), 2 crons - Also fix pre-existing TS build errors to get 0-error build: - AgentOutputDiffViewer: remove invalid lucide icons + syntax error - APICredentialHealthDashboard: fix Badge/Alert variants, remove indicatorClassName - AgentSkillHeatmap, AgentSoulEditor, DiscoveryRunReplayControls, FindingTrendChart, ModelComparisonMatrix: pre-existing fixes - Add missing ui/alert badge card progress components
…penclaw#313) - New AgentTopologyMap.tsx: pure SVG + React state, no external graph libs - Static concentric layout: principals (r=210), crons (r=115), workers (r=65 from spawner) - Node types: Principal (violet circle), Worker (blue circle), Cron (amber diamond) - Interactive: click-to-inspect detail panel (280px), hover scale effect - Toolbar: Live/Paused toggle, Reset View, session count badge, legend - Mock data: 6 principals, 4 workers (from Luis), 2 crons - Also fix pre-existing TS build errors to get 0-error build: - AgentOutputDiffViewer: remove invalid lucide icons + syntax error - APICredentialHealthDashboard: fix Badge/Alert variants, remove indicatorClassName - AgentSkillHeatmap, AgentSoulEditor, DiscoveryRunReplayControls, FindingTrendChart, ModelComparisonMatrix: pre-existing fixes - Add missing ui/alert badge card progress components
…-ui-user-experience' into feat/horizon-ui-complete
* security: redact PII in user-facing LLM error details * add credential disclosure for skill command dispatch * feat(web-next): add command registry store for command palette - Add zustand dependency for state management - Create commandRegistry store with add/remove/execute commands - Include default navigation and action commands - Supports NL Actions via keyword matching * feat(web-next): integrate Skill Builder IDE component - Add SkillBuilderEditor view that wraps the SkillBuilder component - Connect save and test handlers with basic validation - Add navigation entry and route for skill-builder - Allows creating and editing skills from the UI bs-ux-5-impl
… into feat/horizon-ui-complete
…quirements' into feat/horizon-ui-complete # Conflicts: # docs/start/onboarding-overview.md
…t into feat/horizon-ui-complete
…to feat/horizon-ui-complete
…t into feat/horizon-ui-complete
…-ui-for-dashboard' into feat/horizon-ui-complete # Conflicts: # apps/web-next/package.json # apps/web-next/src/App.tsx # apps/web-next/src/views/AgentDashboard.tsx # apps/web-next/src/views/AgentPerformanceBreakdown.tsx # apps/web-next/src/views/CronJobManager.tsx # apps/web-next/src/views/UsageDashboard.tsx # apps/web-next/src/views/WorkqueueDashboard.tsx
…ogy' into feat/horizon-ui-complete
- Updated quiz questions to be friendlier and more conversational - Enhanced level descriptions with more engaging copy - Improved template descriptions with clearer value propositions - Refreshed empty state messages for better user guidance - Updated setup step descriptions for clarity Part of bs-ux-1-copy
…ns-and-specs' into feat/horizon-ui-complete
## Summary - Added skip links to all 10 modified views for keyboard navigation - Added main landmarks with role='main' for screen reader navigation - Fixed animate-pulse to use motion-safe: prefix for reduced motion - Added aria-hidden to decorative status indicator dots - Added aria-labels to filter selects without visible labels - Added scope='col' to table headers in SupportTicketDashboard - Added screen reader text to color-only status indicators ## Files Modified 1. SupportTicketDashboard.tsx 2. CloudCostOptimizer.tsx 3. EnvironmentDriftDetector.tsx 4. APIRateLimitManager.tsx 5. DataCatalog.tsx 6. DatabaseSchemaViewer.tsx 7. QueueInspector.tsx 8. TokenUsageOptimizer.tsx 9. SecurityAuditTrail.tsx 10. DecisionProvenance.tsx ## Audit Document - WCAG_AUDIT_PHASE2.md contains full audit findings WCAG Criteria Addressed: - 2.4.1 Bypass Blocks (Level A) - Skip links - 1.3.1 Info and Relationships (Level A) - Main landmarks, table scope - 1.4.1 Use of Color (Level A) - Status indicator text alternatives - 2.3.3 Animation from Interactions (Level AAA) - motion-safe prefix
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR addresses WCAG 2.1 AA accessibility issues in the top 10 most complex views (by file size) in the Horizon UI web-next application.
Changes Made
Skip Links (WCAG 2.4.1 - Level A)
Main Landmarks (WCAG 1.3.1 - Level A)
<main id="main-content" role="main">for screen reader navigationColor-Only Indicators (WCAG 1.4.1 - Level A)
aria-hidden="true"to decorative status indicator dotsAnimation (WCAG 2.3.3 - Level AAA)
animate-pulsetomotion-safe:animate-pulsefor reduced motion preferencesTable Accessibility (WCAG 1.3.1 - Level A)
scope="col"to table headers in SupportTicketDashboardForm Labels (WCAG 1.3.1 - Level A)
aria-labelattributes to filter selects without visible labelsFiles Modified
src/views/SupportTicketDashboard.tsx- Skip link, main landmark, table scope, select labelssrc/views/CloudCostOptimizer.tsx- Skip link, main landmark, status indicator fixsrc/views/EnvironmentDriftDetector.tsx- Skip link, main landmark, motion-safe animationsrc/views/APIRateLimitManager.tsx- Skip link, main landmark, status indicatorssrc/views/DataCatalog.tsx- Skip link, main landmarksrc/views/DatabaseSchemaViewer.tsx- Skip link, main landmarksrc/views/QueueInspector.tsx- Skip link, main landmark, motion-safe animationsrc/views/TokenUsageOptimizer.tsx- Skip link, main landmarksrc/views/SecurityAuditTrail.tsx- Skip link, main landmark, motion-safe animationsrc/views/DecisionProvenance.tsx- Skip link, main landmarkAudit Document
Full audit findings are documented in
WCAG_AUDIT_PHASE2.md.Build Status
✅ Build passes successfully
Testing