Overview

Track progress across multiple items.

Import

import { ProgressList } from 'nikcli-tui';

Usage

// Define items and update as needed

Live Preview

Run Locally

npm run tsx:core-gallery

Props

  • items: Array of { label: string; value: number; maxValue?: number; color?: string } — Rows to render.
  • showPercentages?: boolean — Show % text column (default true).
  • showValues?: boolean — Show value/max text (default true).
  • barWidth?: number — Internal layout width for bars.
  • itemHeight?: number — Row height (default 2).

Methods

  • updateProgress(index, value, maxValue?), setItems(items), addItem(item), removeItem(index).
  • setItemLabel(index, label), setItemColor(index, color), setAllProgress(values), resetAll().
  • getItem(index), getAllItems(), getTotalProgress().
  • setShowPercentages(bool), setShowValues(bool), setBarWidth(n), setItemHeight(n).

Installation

npm i nikcli-tui

Import

import { ProgressList } from 'nikcli-tui';

Quick Start

new ProgressList({ parent: screen, top: 1, left: 2, width: 60, height: 8, items: [ { label: 'Build', value: 70 }, { label: 'Test', value: 40 } ] });

Production Examples

const pl = new ProgressList({ parent: screen, top: 1, left: 2, width: 60, height: 8, items: [] });
pl.addItem({ label: 'Step 1', value: 10 });
pl.updateProgress(0, 60);

Best Practices

  • Mantieni itemHeight = 2 per densità ottimale; usa barWidth per testi lunghi.