CUB-23: implement AgentCard component with status indicators, progress bar, and M3 styling

- AgentCard component with inputs: status, task, progress, sessionKey, channel, lastActivity
- Status badge colors: Active (#38BDF8), Idle (#2DD4BF), Thinking (#A78BFA), Error (#F87171)
- 4px left-border accent matching status color via CSS custom properties
- Pulse animations: Active (2s), Error (0.8s), Thinking (3s) using global styles.scss keyframes
- Task progress bar with percentage display
- Quick-Jump button using M3 FilledTonalIconButton style with state layer overlay
- Hover/focus states with M3 state layer overlay (8% primary)
- Accessibility: aria-labels for status, role=article on cards, focus-visible outlines
- Reduced-motion media query support
- Updated HubPageComponent with demo data grid layout
This commit is contained in:
cubecraft-agents[bot]
2026-04-26 01:36:55 +00:00
parent f490098af6
commit 7eaf736fc4
5 changed files with 542 additions and 11 deletions

View File

@@ -0,0 +1 @@
export { AgentCardComponent } from './agent-card.component';