---
ui_doc_type: component
component_id: provider-snapshot-card
status: 구현됨
source_evidence:
  - type: code
    path: apps/client/lib/widgets/nodes_panel.dart
    notes: _buildProviderCard renders provider identity, state, models, load, queue, and lifecycle capabilities.
  - type: user
    path: null
    notes: Initial scaffold requested by user.
---

# Provider Snapshot Card

Component ID: `provider-snapshot-card`

Status: `구현됨`

## Source Evidence

| Type | Path | Notes |
|------|------|-------|
| code | `apps/client/lib/widgets/nodes_panel.dart` | `_buildProviderCard`, `_stateColor`, `_truncateModels`가 provider catalog row/card를 구현한다. |
| user | 없음 | 초기 agent-ui 생성을 요청했다. |

## Purpose

Node에 연결된 provider runtime의 health와 capacity를 compact하게 보여준다.

## Used By

- `nodes`: `nodes.provider-catalog`

## Anatomy

- provider display name
- health/status badge
- type/category
- served models summary
- in-flight/capacity/queue/load ratio
- lifecycle capability chips

## Variants

- healthy
- degraded
- unavailable
- unknown

## States

- default
- empty served models
- empty lifecycle capabilities
- error: health/status color로 표현
- disabled: 없음

## Rules

- health 값이 있으면 status보다 우선한다.
- served model은 3개까지만 표시하고 이후는 ellipsis로 줄인다.

## Decision History

- 2026-06-25: `NodesPanel`의 provider snapshot helper를 component로 정의했다.