home / samples / TUI Elements

TUI Elements

Press Tab to navigate, Enter to activate

Buttons (no border)

new Buffee(el, { h: 3 })
TUI.addButton({ row: 1, col: 20, label: '[Save]' })
Ln , Col |

Buttons (with border)

new Buffee(el, { h: 5 })
TUI.addButton({ row: 1, col: 2, label: ' OK ', border: true })
Ln , Col |

Prompt (type to input, Enter to submit)

new Buffee(el, { h: 8 })
TUI.addPrompt({ row: 1, col: 2, width: 30, title: 'Search' })
TUI.handleKeyDown(e.key)
Ln , Col |

Interactive Demo

Toggle TUI mode, highlight elements, and add custom buttons.

Tab to next element. Enter to activate.

Ln , Col |

ScrollBox (Arrow keys to scroll)

new Buffee(el, { h: 10 })
TUI.addScrollBox({ row: 1, col: 2, width: 40, height: 8, title: 'Logs', lines: [...] })
Ln , Col |