loadingascii

A tiny zero-dependency library of unicode loader animations for chat interfaces — terminals, TUIs, and web chat UIs alike.

Install

npm install loadingascii

Usage

In a terminal (Node)

import { createLoader } from "loadingascii";

const loader = createLoader({ animation: "braille", label: "Thinking" }).start();

setTimeout(() => loader.stop(true), 2000);

In a chat UI (custom renderer)

import { createLoader } from "loadingascii";

const loader = createLoader({
  animation: "speechBubble",
  onFrame: (rendered) => chatBubble.setText(rendered),
}).start();

// later, when the assistant message arrives:
loader.stop();

Just the frames

import { animations, getAnimation, listAnimations } from "loadingascii";

console.log(listAnimations());           // ["dots", "ellipsis", "braille", ...]
console.log(animations.wave.frames);     // ["▁", "▂", "▃", ...]
console.log(getAnimation("thinking"));   // { name, interval, frames }

Built-in animations

dots, ellipsis, braille, brailleWide, brailleSnake, brailleBounce, brailleEdge, brailleDance, brailleDrip, brailleGrow, pulse, wave, bouncingBar, bouncingBall, thinking, typing, arc, circleHalves, squareCorners, triangle, star, toggle, heart, speechBubble, shimmer, moon, earth, clock, weather, runner, compass, lineSpin, boxFlip, growHorizontal, progressBar, boxQuarters, sparkles, music, mindBlown, chevrons, balloon, aesthetic, orbit.

Custom animations

Pass any { name, interval, frames } object as animation:

createLoader({
  animation: { name: "blink", interval: 200, frames: ["◌", "●"] },
}).start();

License

MIT