← All libraries

SugarBits

🧁 SugarBits

Fourteen pre-built TUI components

port of bubbles components widgets forms input

TextInput, TextArea, ItemList, Table, Viewport, FilePicker, Progress, Spinner, Cursor, Help, Key, Paginator, Stopwatch, Timer. Everything you'd hand-roll on day one of a TUI project, ready to drop into your Model.

Install

composer require candycore/sugar-bits

Quickstart

use CandyCore\Bits\TextInput\TextInput;
use CandyCore\Bits\Spinner\Spinner;
use CandyCore\Core\{Cmd, Model, Msg, Program};
use CandyCore\Core\Msg\KeyMsg;
use CandyCore\Core\KeyType;

final class Search implements Model {
    public function __construct(
        public readonly TextInput $ti,
        public readonly Spinner $sp,
    ) {}

    public function init(): ?\Closure { return $this->sp->tick(); }

    public function update(Msg $msg): array {
        if ($msg instanceof KeyMsg && $msg->type === KeyType::Enter) {
            return [$this, Cmd::quit()];
        }
        [$ti, $cmd]  = $this->ti->update($msg);
        [$sp, $cmd2] = $this->sp->update($msg);
        return [new self($ti, $sp), Cmd::batch($cmd, $cmd2)];
    }

    public function view(): string {
        return $this->sp->view().' '.$this->ti->view();
    }
}

What's in the box

Spinner12 styles — line, dot, miniDot, points, pulse, globe, meter, jump, moon, monkey, hamburger, ellipsis.
ProgressStatic Progress + spring-physics AnimatedProgress driven by HoneyBounce.
TextInput / TextAreaSingle + multi-line. Autocomplete, validators, line numbers, soft-wrap.
ItemListSelectable, scrollable, filterable. Status messages, custom delegates.
TableSelectable data table with Column DTOs, header highlight, vertical nav.
ViewportScrollable text region. Mouse wheel, scrollbar, keyboard nav.
FilePickerDirectory browser with icons, size, sort modes.
Paginator + Help + KeyDot / arabic page indicator, key-help footer, KeyMap binding DSL.

Source & demos

Try the quickstart →

Demos.

VHS-recorded GIFs of every example shipped with the library. Regenerated automatically on every push that touches the source.

Spinner gallery

Spinner gallery

All 12 spinner styles ticking in parallel.
TextInput

TextInput

Single-line input with autocomplete + placeholder.
TextArea

TextArea

Multi-line editor with line numbers + soft-wrap.
ItemList

ItemList

Filterable scrollable list with status messages.
Table

Table

Selectable data table with column delegates.
Viewport

Viewport

Scrollable text region with mouse wheel + scrollbar.
FilePicker

FilePicker

Directory browser with icons + size + sort.
Progress

Progress

Spring-physics-animated progress bar.
Cursor

Cursor

Animated text cursor with BlinkMsg tick.
Help

Help

Short / full key-help footer from a KeyMap.
Paginator

Paginator

Dot + arabic page indicator.
Stopwatch

Stopwatch

Elapsed-time counter.
Timer

Timer

Countdown timer.