Show HN: Giggles – A batteries-included React framework for TUIs (github.com)

23 points by ajz317 ↗ HN
i built a framework that handles focus and input routing automatically for you -- something born out of the things that ink leaves to you, and inspired by charmbracelet's bubbletea

- hierarchical focus and input routing: the hard part of terminal UIs, solved. define focus regions with useFocusScope, compose them freely -- a text input inside a list inside a panel just works. each component owns its keys; unhandled keypresses bubble up to the right parent automatically. no global handler like useInput, no coordination code

- 15 UI components: Select, TextInput, Autocomplete, Markdown, Modal, Viewport, CodeBlock (with diff support), VirtualList, CommandPalette, and more. sensible defaults, render props for full customization

- terminal process control: spawn processes and stream output into your TUI with hooks like useSpawn and useShellOut; hand off to vim, less, or any external program and reclaim control cleanly when they exit

- screen navigation, a keybinding registry (expose a ? help menu for free), and theming included

- react 19 compatible!

docs and live interactive demos in your browser: https://giggles.zzzzion.com

quick start: npx create-giggles-app

5 comments

[ 3.1 ms ] story [ 16.9 ms ] thread
A good toolkit for Ink is much needed, although Ink itself leaves something to be desired, especially compared to https://github.com/anomalyco/opentui (bun only, used by opencode)

I tried to build a Viewport component in Ink, but after scrolling to the bottom of a list of 150 rows, Ink started to render things strangely - the top line overflowed the box bounds, and a few blank lines appeared inside the viewport. I couldn't figure out where the bug was in Ink, I somewhat suspect floating point issues somewhere in the native Yoga<->JS layer?

The fact that there are no tests is a non-starter for me. AI mostly writes them for you now, so there really is no excuse to not have them, especially for a library that people are going to depend on.
B-but, why?? Bubbletea, its inspiration, follows up on the philosophy of TUIs, fast, direct, lightweight in resources, bonus for being a small binary. I can't wrap my head around why one choose React to make a TUI, seems like making a dune buggy out of a Hummer.

I know the standard answer, "why not?", but I'm struggling to figure the expected use cases.