Overview
tng-progress-bar displays a horizontal progress indicator for determinate (percentage-based) or indeterminate (loading) states. Supports value and max for determinate mode, mode (determinate | indeterminate), disableAnimation for reduced motion, and slot-based micro styling.
Quick example
Basic
<tng-progress-bar [value]="65" />
<tng-progress-bar [value]="30" [slot]="{ indicator: 'bg-success' }" />
import { TngProgressBar } from '@tailng-ui/ui/primitives';
// Basic usage
<tng-progress-bar [value]="65" />
Features
mode / value / max
mode: determinate (percentage bar) or indeterminate (loading animation). value/max: 0–100 by default.
disableAnimation
Disables the indeterminate animation for reduced motion preference.
slot
Slot-based micro styling: container (root), track (background + size), indicator (foreground bar).