# AI Chip Components (Progressive Disclosure UX)

## Module
Web

## Status
IMPLEMENTED

## Description
UX pattern for AI results surfacing with compact chips, 3-line doctrine, progressive disclosure. All core AI chip components are implemented covering explain, exploitability, fix, needs-evidence, VEX draft, authority badge, assist panel, and summary.

## Implementation Details
- **AI chip components** (10 components):
  - `ai-chip` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-chip.component.ts`)
  - `ai-explain-chip` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-explain-chip.component.ts`)
  - `ai-exploitability-chip` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-exploitability-chip.component.ts`)
  - `ai-fix-chip` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-fix-chip.component.ts`)
  - `ai-needs-evidence-chip` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-needs-evidence-chip.component.ts`)
  - `ai-vex-draft-chip` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-vex-draft-chip.component.ts`)
  - `ai-authority-badge` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-authority-badge.component.ts`)
  - `ai-assist-panel` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-assist-panel.component.ts`)
  - `ai-summary` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ai-summary.component.ts`)
  - `ask-stella-button` (`src/Web/StellaOps.Web/src/app/shared/components/ai/ask-stella-button.component.ts`)
- **List view integration**: `ai-chip-row.component.ts` (`src/Web/StellaOps.Web/src/app/features/findings/ai-chip-row.component.ts`)
- **Code guard badge**: `ai-code-guard-badge.component.ts` (`src/Web/StellaOps.Web/src/app/features/triage/components/ai-code-guard-badge/`)
- **E2E tests**: `ai-chip-visual.e2e.spec.ts` (`src/Web/StellaOps.Web/src/app/shared/components/ai/__tests__/`)

## E2E Test Plan
- [ ] Verify all AI chip variants render with correct status color and label
- [ ] Verify chips update reactively when underlying data changes
- [ ] Verify tooltip or popover shows additional detail on hover
- [ ] Verify progressive disclosure: compact chip expands to full explanation panel
- [ ] Verify accessibility (keyboard navigation, screen reader labels, ARIA attributes)

## Related Documentation
- Source: See feature catalog