The `r3bl-ts-utils` package is a set of useful TypeScript functions and classes that can be used in Node.js and browser environments. They are inspired by Kotlin stdlib, and Rust to write code as expressions rather than statements, colorized text, powerful Text User Interface (TUI) framework to build powerful CLI apps, cache, and timer utilities.
When there are many components that can receive keyboard input visible at the same time, the focus system ensures that the one that is currently focused is going to receive these events. There can be one exception which is having a "global" listener that can respond to keypresses regardless of what other component has focus.
useNodeKeypress is hooked into keypress events from readline
Here are the changes that need to be made.
Copy TextInput into TextInputField (in r3bl-ts-utils)
1.1 Replace useInput w/ useNodeKeypress
1.2 Remove all the needless code
Change useNodeKeypress
2.1 It should only have 1 active keypress listener at any given time
2.2 Remove all existing listeners when a new one is attached, restore them on detach
2.3 Might need to create an ActionRegistry (singleton, static, just like TimerRegistry) to handle these things.
Test it in the existing experiments that use TextInput.
Next - Apply similar thinking to migrating confirm-input to useNodeKeypress
Currently, there is no support for theming in the UI components. The colors are hard coded. It is assumed that the user has their terminal in a dark mode theme.
It isn't really easy to detect what their current terminal theme, and it is safe to assume that most developers use dark themes in their terminals.
However it is important to provide a set of color options for users: