feat(web): derive metric-card into canonical KPI card with semantic delta handling [SPRINT-028]

Rework MetricCardComponent from a basic label+value+delta card into the
canonical Stella Ops KPI card primitive with:

- deltaDirection input ('up-is-good' | 'up-is-bad' | 'neutral') to control
  green/red semantics per metric context
- severity input ('healthy' | 'warning' | 'critical' | 'unknown') for
  left-border health accents
- unit input for display units (ms, %, /hr, GB)
- loading, empty, and error states with skeleton/placeholder rendering
- ARIA accessibility (role="group", composite aria-label, delta labels)
- Responsive dense-grid support

Adopted on 3 representative dashboards (12 bespoke tiles replaced):
- signals-runtime-dashboard (3 cards)
- search-quality-dashboard (4 cards)
- delivery-analytics (5 cards)

40 focused tests covering delta direction semantics, all states, severity
accents, and accessibility.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
master
2026-03-08 22:55:21 +02:00
parent aa7e0e937c
commit d7c3d5ad62
9 changed files with 918 additions and 193 deletions

View File

@@ -21,7 +21,7 @@
- `docs/implplan/SPRINT_20260308_023_FE_unreachable_registry_admin_route.md`
- `docs/implplan/SPRINT_20260308_026_FE_settings_information_architecture_rationalization.md`
- `docs/implplan/SPRINT_20260308_027_FE_page_header_context_header_derivation.md`
- `docs/implplan/SPRINT_20260308_028_FE_metric_card_dashboard_card_derivation.md`
- [DONE] `docs/implplan/SPRINT_20260308_028_FE_metric_card_dashboard_card_derivation.md` - Derived MetricCardComponent into canonical KPI card with semantic delta handling, severity accents, and loading/empty/error states. Adopted on 3 dashboards (12 bespoke tiles replaced). 40 tests pass.
- `docs/implplan/SPRINT_20260308_029_FE_timeline_list_audit_timeline_derivation.md`
- `docs/implplan/SPRINT_20260308_030_FE_split_pane_list_detail_shell_consolidation.md`
- `docs/implplan/SPRINT_20260308_031_FE_witness_viewer_evidence_derivation.md`

View File

@@ -13,6 +13,7 @@ Provide a living plan for UI deliverables, dependencies, and evidence.
- The next queued batch is `docs/modules/ui/orphan-revival-batch/README.md`, which stages independent review-ready sprints for orphan shared-component adoption and disconnected-route integration.
- The queued orphan batch currently spans `SPRINT_20260308_013` through `SPRINT_20260308_023` and is intentionally not marked active until product review approves staffing.
- Newly queued follow-on planning sprints cover Settings information architecture rationalization plus UX derivation tracks for the orphan `PageHeaderComponent`, `MetricCardComponent`, `TimelineListComponent`, `SplitPaneComponent`, and `WitnessViewerComponent` (`SPRINT_20260308_026` through `SPRINT_20260308_031`).
- Sprint `028` (MetricCardComponent derivation into canonical KPI card) is DONE. The shared `MetricCardComponent` now supports semantic delta direction (`up-is-good` / `up-is-bad` / `neutral`), severity accents, loading/empty/error states, and ARIA accessibility. Adopted on signals-runtime, search-quality, and delivery-analytics dashboards. See `docs/implplan/SPRINT_20260308_028_FE_metric_card_dashboard_card_derivation.md`.
- Sprint `014` (CopyToClipboard, InlineCode, TruncatePipe adoption) is DONE. See `docs/features/checked/web/orphan-copy-inline-truncate-adoption.md`.
- Sprint `015` (FilterBarComponent adoption) shipped, then was partially rolled back on audit-family pages to restore lost filter semantics. See `docs/features/checked/web/filter-bar-unification.md` and `docs/features/checked/web/orphan-revival-regression-remediation-ui.md`.
- Sprint `020` (FindingListComponent consolidation) shipped, then was rolled back on mounted findings and release-security hosts because the shared contract required fabricated data. See `docs/features/checked/web/orphan-finding-list-consolidation.md` and `docs/features/checked/web/orphan-revival-regression-remediation-ui.md`.