Skip to main content
Using Deno in production at your company? Earn free Deno merch.
Give us feedback
Module

x/tui/src/components/progressbar.ts>ProgressBar

🦕 Deno module for creating Terminal User Interfaces
Im-Beast/deno_tui
Go to Latest
class ProgressBar
extends Box
import { ProgressBar } from "https://deno.land/x/tui@2.0.0/src/components/progressbar.ts";

Component for creating interactive progressbars

Examples

Example 1

new ProgressBar({
 parent: tui,
 orientation: "horizontal",
 direction: "normal",
 theme: {
  base: crayon.bgLightBlue,
  focused: crayon.bgCyan,
  active: crayon.bgBlue,
  progress: {
   base: crayon.bgLightBlue.green,
   focused: crayon.bgCyan.lightGreen,
   active: crayon.bgBlue.lightYellow,
  },
 },
 value: 50,
 min: 0,
 max: 100,
 smooth: false,
 rectangle: {
  column: 48,
  height: 2,
  row: 3,
  width: 10,
 },
 zIndex: 0,
});

You can make the progressbar vertical by changing orientation

Example 2

new ProgressBar({
 ...,
 orientation: "vertical",
});

You can reverse the flow of progress by changing direction to "reversed"

Example 3

new ProgressBar({
 ...,
 direction: "reversed",
});

You can also make progress seem more granular by taking advantage of special characters. Set smooth to true to do that.

Example 4

new ProgressBar({
 ...,
 smooth: true,
});

Constructors

new
ProgressBar(options: ProgressBarOptions)

Properties

drawnObjects: { box: BoxObject; progress: BoxObject | TextObject[]; }
max: Signal<number>
min: Signal<number>
smooth: Signal<boolean>
value: Signal<number>

Methods

draw(): void
interact(method: "mouse" | "keyboard"): void