# Shadcn UI Progress

> Show progress with ShadProgress; determinate (value 0–1) or indeterminate. Use when displaying task completion or loading progress in a Flutter shadcn_ui app.

- Skill: `serverpod/shadcn-ui-progress` (Agent Skill)
- Install (CLI): `npx skillmds@latest add serverpod/shadcn-ui-progress`
- Raw SKILL.md: https://api.skillmd.com/api/skills/serverpod/shadcn-ui-progress/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Productivity
- Author: serverpod (https://skillmd.com/u/serverpod)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/serverpod/shadcn-ui-progress

---


# Shadcn UI — Progress

## Instructions

`ShadProgress` displays completion progress, typically as a progress bar. Use determinate mode with a `value` (0.0–1.0); omit `value` for indeterminate (animated) progress.

### Determinate

```dart
ConstrainedBox(
  constraints: BoxConstraints(
    maxWidth: MediaQuery.sizeOf(context).width * 0.6,
  ),
  child: const ShadProgress(value: 0.5),
)
```

### Indeterminate

```dart
const ShadProgress()
```

Constrain width with `ConstrainedBox` or parent layout as needed.