ink

library0.0.1jsnpmunverified

Ink is a JavaScript library that brings the declarative, component-based UI development experience of React to command-line applications. It allows developers to build complex, interactive terminal UIs using React components, leveraging features like state management, hooks, and a virtual DOM. Ink utilizes Yoga for Flexbox layout in the terminal, enabling most CSS-like layout properties. The current stable version is 7.0.1, with an active release cadence that often aligns with major React and Node.js LTS updates. Key differentiators include full React feature support within a CLI context, robust layout capabilities, and a thriving ecosystem of libraries and applications built on Ink, making it a powerful choice for modern CLI development.

web-framework

npm install ink

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · INK

ink

web-frameworkjavascriptv0.0.1

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

render

✓ import { render } from 'ink'

✗ const { render } = require('ink')

Ink v7 is primarily ESM. CommonJS `require` is generally not recommended for new projects and might not work for all exports due to 'type': 'module' in `package.json`.

Text

✓ import { Text } from 'ink'

✗ import Text from 'ink'

`Text` is a named export, not a default export. Used for basic text rendering with styling capabilities.

useInput

✓ import { useInput } from 'ink'

✗ import { UseInput } from 'ink'

`useInput` is a named export hook for handling keyboard input. Hook names must start with `use` and be lowercase after that.

useApp

✓ import { useApp } from 'ink'

✗ import { UseApp } from 'ink'

`useApp` is a named export hook providing access to Ink's app instance methods like `exit()`.

This example demonstrates a simple counter component using React state and effects, rendered in the terminal via Ink, updating every 100 milliseconds.

import React, { useState, useEffect } from 'react'; import { render, Text } from 'ink'; const Counter = () => { const [counter, setCounter] = useState(0); useEffect(() => { const timer = setInterval(() => { setCounter(previousCounter => previousCounter + 1); }, 100); return () => { clearInterval(timer); }; }, []); return <Text color="green">{counter} tests passed</Text>; }; render(<Counter />);

Debug

Known issues

breakingInk v7.0.0 requires Node.js version 22 or higher. Applications running on older Node.js versions will fail to start.

fix

Upgrade your Node.js environment to version 22 or later. Consider using a Node.js version manager like `nvm` or `volta`.

affects: >=7.0.0

breakingInk v7.0.0 requires React version 19.2.0 or higher. This update leverages `useEffectEvent` internally for improved input handler management, making older React versions incompatible.

fix

Update your `react` and `@types/react` peer dependencies to `^19.2.0` and reinstall dependencies.

affects: >=7.0.0

breakingIn Ink v7.0.0, pressing the Backspace key now correctly sets `key.backspace` to `true` instead of `key.delete`. Most terminals send the same byte for both, which previously caused misreporting.

fix

If your `useInput` handler was checking `key.delete` to detect backspace, switch to checking `key.backspace` instead. Review and update any relevant input handling logic.

affects: >=7.0.0

gotchaInk relies on `process.stdout` and `process.stdin` for rendering and input. When running tests, ensure you mock or properly handle these streams, or use `renderToString()` for synchronous string output to capture rendered content.

fix

For testing, use `renderToString()` for snapshot testing, or mock `stdout` and `stdin` as needed. The `ink-testing-library` package can also assist with testing components.

affects: >=1.0.0

gotchaInk components can flicker, especially with rapid updates or complex layouts, due to terminal rendering limitations. While `synchronizedUpdate` (v6.7.0+) and `incrementalRendering` (v6.5.0+) options help, heavy animations might still be challenging.

fix

Enable `synchronizedUpdate: true` in `render` options and `incrementalRendering: true` to mitigate flickering. Optimize component re-renders and consider `maxFps` to cap update rates for less critical animations.

affects: >=6.5.0

Errors

Common errors & fixes

Error: Ink requires Node.js version >=22.0.0

Attempting to run an Ink v7+ application on an incompatible Node.js version.

fix

Update Node.js to version 22 or higher. You can use `nvm install 22 && nvm use 22`.

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

Typically indicates that a React component from Ink (e.g., `Text`) was imported incorrectly or not imported at all, resulting in `undefined` being used where a component is expected.

fix

Verify that all Ink components (`Text`, `Box`, etc.) are correctly imported as named exports, e.g., `import { Text } from 'ink';`

TypeError: Cannot read properties of undefined (reading 'exit')

Attempting to call `app.exit()` without properly destructuring `exit` from the `useApp()` hook, or calling it outside of a component context.

fix

Ensure `exit` is correctly destructured from `useApp()` within a functional component: `const { exit } = useApp();`

Upgrade

Version history

0.0.1latest on npm

Audit

Dependencies

reactrequiredRequired as Ink is a React renderer.

@types/reactoptionalTypeScript type definitions for React, required for TypeScript projects.

react-devtools-coreoptionalEnables React DevTools integration for debugging Ink applications.

Agent activity

7 hits · last 30 days

node

Amazon

Resources

githubhttps://github.com/vadimdemedes/ink ↗

packagehttps://www.npmjs.com/package/ink ↗

homepagehttps://inkjs.dev ↗