CUB-45: AgentCard final integration with sub-components

- Assemble AgentCard from AgentStatusBadge, TaskProgressBar, QuickJumpButton
- All 6 inputs functional: status, task, progress, sessionKey, channel, lastActivity
- Left-border accent matches status color (Active: #38BDF8, Idle: #2DD4BF, Thinking: #A78BFA, Error: #F87171)
- Accessibility: role="article" on card, aria-labels on all sections
- Uses tactical dark mode CSS variables from CUB-47
- Added @Input() to QuickJumpButton sessionKey for parent binding
- JumpClick output forwarded from AgentCard
- Build passes, type checking passes
This commit is contained in:
cubecraft-agents[bot]
2026-04-26 13:36:45 +00:00
parent 8d0adeb2e9
commit 8341503a39
17 changed files with 1009 additions and 1 deletions

View File

@@ -0,0 +1,33 @@
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
import { MatIconButton } from '@angular/material/button';
import { MatIcon } from '@angular/material/icon';
/**
* Quick-Jump Button — M3 FilledTonalIconButton
*
* An icon button that emits a navigation event for jumping to an agent session.
* Uses the Material Design 3 FilledTonalIconButton style with 8% state layer
* overlay on hover and focus.
*
* Per spec Section 7.3: Agent Card Component Interface
*/
@Component({
selector: 'app-quick-jump-button',
standalone: true,
imports: [MatIconButton, MatIcon],
templateUrl: './quick-jump-button.component.html',
styleUrl: './quick-jump-button.component.scss',
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class QuickJumpButtonComponent {
/** Emitted when the button is clicked, carrying the session key for navigation. */
@Output() jumpClick = new EventEmitter<string>();
/** The session key to navigate to. Set by the parent agent card. */
@Input()
sessionKey = '';
onJumpClick(): void {
this.jumpClick.emit(this.sessionKey);
}
}