Add validation state icon and accessible tooltip to field row
epic-bufdir-report-preview-ui-components-task-003 — Extend BufdirFieldRowWidget to display a validation state icon (warning triangle or anomaly indicator) using WCAG-compliant color tokens from BufdirAccessibilityUtils. Implement an accessible tooltip using Flutter Semantics so screen readers announce the tooltip text when the icon is focused. Support all three states: normal (no icon), warning, and anomaly.
Acceptance Criteria
Technical Requirements
Execution Context
Tier 2 - 518 tasks
Can start after Tier 1 completes
Implementation Notes
Use a switch on validationState to decide icon data and color. Pattern: final iconData = switch(data.validationState) { BufdirValidationState.warning => Icons.warning_amber_rounded, BufdirValidationState.anomaly => Icons.error_outline, _ => null }. If iconData is null, render SizedBox.shrink() to avoid layout shift. Wrap the icon in Semantics(label: data.tooltipText ??
defaultLabel, child: Tooltip(message: ..., child: IconButton(...))). Use IconButton with padding: EdgeInsets.all(10) to ensure 44px minimum interactive area even with a 24px icon. Source warningColor and anomalyColor exclusively from BufdirAccessibilityUtils — do not use Colors.yellow or Colors.red directly. Ensure the icon column in the row layout has a fixed width (e.g., 44px) so the two-column label/value layout is not disturbed when no icon is present (use SizedBox(width: 44, child: iconWidget)).
Testing Requirements
Extend test/features/bufdir/widgets/bufdir_field_row_widget_test.dart with: (1) warning state renders Icons.warning_amber_rounded (find.byIcon); (2) anomaly state renders anomaly icon; (3) normal state has no icon (find.byType(Icon) returns zero widgets); (4) Semantics label equals tooltipText when provided (use tester.getSemantics); (5) Semantics label equals localized default when tooltipText is null; (6) long-press on icon in warning state shows Tooltip with correct message; (7) touch target is at least 44px (tester.getSize on IconButton). Update golden tests for all three states. Run accessibility checks using flutter_test SemanticsController to verify screen reader labels are present.
Implementing the tap-to-scroll-and-focus behavior from the validation banner to a specific field row in a long scrollable list is complex in Flutter. If focus management is incorrectly implemented, VoiceOver users who navigate to the banner and select an issue will not be moved to the relevant field row, breaking the accessibility workflow and violating WCAG 2.4.3 (Focus Order).
Mitigation & Contingency
Mitigation: Use BufdirAccessibilityUtils focus management utilities (built in the foundation epic) with explicit GlobalKey-based scroll anchors on each field row. Test with a real iOS device running VoiceOver during widget development, not only in the Flutter accessibility inspector.
Contingency: If programmatic scroll-to-focus cannot be reliably achieved before the TestFlight deadline, fall back to a navigation approach where tapping a banner issue opens a modal detail sheet for that field row rather than scrolling in place, and file a follow-up ticket for the inline scroll implementation.
The validation summary banner must reactively update its issue count as underlying aggregated data changes (e.g., if the coordinator has navigated away and data was refreshed). If the banner's Riverpod provider is not correctly scoped, it may display stale issue counts or fail to disappear when all issues are resolved, eroding coordinator trust in the validation system.
Mitigation & Contingency
Mitigation: Drive the banner exclusively from the same Riverpod provider that powers the full preview model — do not maintain a separate local state for issue counts. Write a widget test that simulates a data refresh mid-review and asserts the banner updates within one frame.
Contingency: If stale state reaches production, add a manual refresh button to the banner as a short-term workaround while the provider scoping is corrected in the next release cycle.