DEV Community

Cover image for I built shadcn/ui for the terminal — meet InkUI
kamlesh yadav
kamlesh yadav

Posted on

I built shadcn/ui for the terminal — meet InkUI

The problem

Every CLI I build with Ink ends up copy-pasting the same spinner from my last project. Same progress bar. Same select menu. It's boilerplate that shouldn't exist.

What I built

InkUI works exactly like shadcn/ui — run one command:

npx inkui add table
Enter fullscreen mode Exit fullscreen mode

You get the TypeScript source file dropped into ./components/ui/table/ in your own project. No black-box npm dependency. You own the code. Modify anything.

What's included

32 components across 4 categories:

Core UI: Spinner, Badge, ProgressBar, TextInput, Select, MultiSelect, Table, Dialog, Toast, StatusIndicator, LoadingBar, Confirm, KeyHint, Divider, Header

Layout & Navigation: Tabs, Accordion, Panel, SplitPane, ScrollArea

AI-era CLI: StreamingText, TokenCounter, CodeBlock, DiffView, Typewriter

Data & Power: TreeView, Autocomplete, Stepper, DataTable, Gauge, Sparkline, Markdown, JSONViewer

The copy-paste model

Shadcn/ui proved that owning your component source beats depending on a versioned package. The same argument holds for terminal UIs:

  • You might need to change the spinner frame timing for your specific use case
  • You might need a custom border style the library doesn't support
  • You don't want a major version bump to break your deploy CLI in production

Owning the source solves all three.

Theming

import type { InkUITheme } from '@inkui-cli/core';

const myTheme: InkUITheme = {
  colors: {
    primary: 'magenta',
    success: 'green',
    error: 'red',
    // ...
  },
  border: 'rounded',
};

<Table theme={myTheme} columns={cols} data={rows} />
Enter fullscreen mode Exit fullscreen mode

Try it

npx inkui list          # see all 32 components
npx inkui add spinner   # add one
npx inkui add --all     # add everything
Enter fullscreen mode Exit fullscreen mode

Docs: https://inkui-lib.vercel.app

GitHub: https://github.com/kamlesh723/InkUI

Feedback welcome — especially on whether the copy-paste model makes sense for terminal components the same way it does for web.

Top comments (0)