Package Map

Choose the right @visulima/tui sub-package for your use case

Package Map

@visulima/tui is a single package with multiple entry points.

Use this page to decide which entry to import and where each API lives.

Quick Choice

If you want to…Use entry pointWhy
Build a React TUI with components and hooks (Ink)@visulima/tuiFull Ink-compatible component library with 50+ components
Build a React TUI with the native renderer@visulima/tui/reactNative renderer with Rust-backed diff engine
Paint terminal cells directly from a Uint32Array@visulima/tui/coreLowest-level runtime, direct control over render loop and buffer
Test TUI components in isolation@visulima/tui/testFramework-agnostic render + mock streams for testing

@visulima/tui

The default entry point — full Ink-compatible React component library.

Primary exports:

  • render, renderToString
  • components: Box, Text, Spinner, ProgressBar, SelectInput, MultiSelect, TextInput, ConfirmInput, Textarea, Slider, Alert, Badge, BigText, Code, DiffView, Dialog, FilePicker, Gradient, Help, Link, Markdown, Paginator, Stopwatch, Timer, Tab, Tabs, Table, TreeView, ScrollView, ScrollList, and more
  • hooks: useInput, useApp, useFocus, useFocusManager, useAnimation, useTimer, useStopwatch, useKeyBindings, usePaste, useClipboard, useWindowSize, useBoxMetrics, and more
npm install @visulima/tui react
import { render, Box, Text, Spinner, useInput, useTimer } from "@visulima/tui";

@visulima/tui/core

Framework-agnostic runtime backed by the Rust diff engine.

Primary APIs are exposed to TypeScript/JavaScript while rendering is handled by a native Rust diff engine.

Primary exports:

  • Renderer
  • TerminalGuard
  • terminalSize
  • Cell, StyleMasks
  • InputParser
  • TuiApp
  • createInlineLoop
npm install @visulima/tui
import { Renderer, TerminalGuard, terminalSize } from "@visulima/tui/core";

@visulima/tui/react

Native React renderer — uses a Rust-backed diff engine for high-performance rendering.

Depends on @visulima/tui/core for terminal output and native diffing.

Primary exports:

  • render, renderInline, renderToString
  • components: Static, DevTools
  • hooks: useInput, useApp, useFocus, useFocusManager, useMouse, useScrollable, useTextInput, useWindowSize, and more

Components (Box, Text, Spinner, etc.) are imported from the main @visulima/tui entry point — the native renderer uses the same components.

npm install @visulima/tui react
import { Box, Text } from "@visulima/tui";
import { render, useInput } from "@visulima/tui/react";

@visulima/tui/test

Framework-agnostic testing utilities for TUI components. Inspired by ink-testing-library and ink-testing.

Primary exports:

  • render — render a component with mock streams, returns test instance with screen, keys, waitFor, flush
  • cleanup — unmount all test instances (use in afterEach)
  • createScreen — standalone screen query helpers with ANSI stripping
  • createKeySender — standalone keyboard input simulator
  • KEY — raw ANSI escape sequence constants for all common keys
  • waitFor — standalone async polling assertion
import { render, cleanup, KEY, createScreen, createKeySender, waitFor } from "@visulima/tui/test";

Next Steps

Support

Contribute to our work and keep us going

Community is the heart of open source. The success of our packages wouldn't be possible without the incredible contributions of users, testers, and developers who collaborate with us every day.Want to get involved? Here are some tips on how you can make a meaningful impact on our open source projects.

Ready to help us out?

Be sure to check out the package's contribution guidelines first. They'll walk you through the process on how to properly submit an issue or pull request to our repositories.

Submit a pull request

Found something to improve? Fork the repo, make your changes, and open a PR. We review every contribution and provide feedback to help you get merged.

Good first issues

Simple issues suited for people new to open source development, and often a good place to start working on a package.
View good first issues