@vertz/tui 0.2.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +124 -0
- package/dist/index.d.ts +720 -0
- package/dist/index.js +2374 -0
- package/dist/jsx-runtime/index.d.ts +111 -0
- package/dist/jsx-runtime/index.js +134 -0
- package/dist/shared/chunk-5x9fb9b2.js +52 -0
- package/dist/shared/chunk-6y95cgnx.js +137 -0
- package/dist/test/index.d.ts +109 -0
- package/dist/test/index.js +40 -0
- package/package.json +61 -0
package/README.md
ADDED
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
# @vertz/tui
|
|
2
|
+
|
|
3
|
+
Terminal UI toolkit for building interactive CLI applications. Powers `@vertz/cli` and generated CLIs.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @vertz/tui
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Quick Start
|
|
12
|
+
|
|
13
|
+
```tsx
|
|
14
|
+
import { tui, Text, Box, Spinner } from '@vertz/tui';
|
|
15
|
+
|
|
16
|
+
function App() {
|
|
17
|
+
return (
|
|
18
|
+
<Box direction="column" gap={1}>
|
|
19
|
+
<Text bold>My CLI App</Text>
|
|
20
|
+
<Spinner label="Loading..." />
|
|
21
|
+
</Box>
|
|
22
|
+
);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
const app = tui(<App />, { mode: 'inline' });
|
|
26
|
+
await app.waitUntilExit();
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
## Prompts
|
|
30
|
+
|
|
31
|
+
Interactive prompts for collecting user input — text, select, multi-select, confirm, and password:
|
|
32
|
+
|
|
33
|
+
```typescript
|
|
34
|
+
import { prompt } from '@vertz/tui';
|
|
35
|
+
|
|
36
|
+
const name = await prompt.text({ message: 'Project name' });
|
|
37
|
+
|
|
38
|
+
const runtime = await prompt.select({
|
|
39
|
+
message: 'Pick a runtime',
|
|
40
|
+
options: [
|
|
41
|
+
{ label: 'Bun', value: 'bun' },
|
|
42
|
+
{ label: 'Node.js', value: 'node' },
|
|
43
|
+
{ label: 'Deno', value: 'deno' },
|
|
44
|
+
],
|
|
45
|
+
});
|
|
46
|
+
|
|
47
|
+
const features = await prompt.multiSelect({
|
|
48
|
+
message: 'Enable features',
|
|
49
|
+
options: [
|
|
50
|
+
{ label: 'TypeScript', value: 'ts' },
|
|
51
|
+
{ label: 'Linting', value: 'lint' },
|
|
52
|
+
],
|
|
53
|
+
});
|
|
54
|
+
|
|
55
|
+
const confirmed = await prompt.confirm({ message: 'Continue?' });
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
## Wizard
|
|
59
|
+
|
|
60
|
+
Multi-step flows with typed results:
|
|
61
|
+
|
|
62
|
+
```typescript
|
|
63
|
+
import { wizard } from '@vertz/tui';
|
|
64
|
+
|
|
65
|
+
const result = await wizard({
|
|
66
|
+
steps: [
|
|
67
|
+
{ id: 'name', prompt: () => prompt.text({ message: 'Project name' }) },
|
|
68
|
+
{ id: 'runtime', prompt: () => prompt.select({ message: 'Runtime', options: runtimes }) },
|
|
69
|
+
] as const,
|
|
70
|
+
});
|
|
71
|
+
|
|
72
|
+
console.log(result.name); // string
|
|
73
|
+
console.log(result.runtime); // typed from options
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
## Components
|
|
77
|
+
|
|
78
|
+
### Layout
|
|
79
|
+
|
|
80
|
+
- **`Box`** — Flexbox-style container with `direction`, `gap`, `padding`, `border`
|
|
81
|
+
- **`Text`** — Styled text with `bold`, `italic`, `underline`, `color`, `dimmed`
|
|
82
|
+
- **`Spacer`** — Flexible space between elements
|
|
83
|
+
- **`Divider`** — Horizontal line separator
|
|
84
|
+
|
|
85
|
+
### Data Display
|
|
86
|
+
|
|
87
|
+
- **`Table`** — Tabular data with typed columns
|
|
88
|
+
- **`KeyValue`** — Key-value pairs
|
|
89
|
+
- **`Log`** / **`LogStream`** — Log output with timestamps
|
|
90
|
+
- **`Banner`** — Highlighted banner messages
|
|
91
|
+
- **`DiagnosticView`** — Compiler diagnostic display with source context
|
|
92
|
+
|
|
93
|
+
### Interactive
|
|
94
|
+
|
|
95
|
+
- **`TextInput`** — Text input field
|
|
96
|
+
- **`Select`** — Single-choice selection
|
|
97
|
+
- **`MultiSelect`** — Multi-choice selection
|
|
98
|
+
- **`Confirm`** — Yes/no confirmation
|
|
99
|
+
- **`PasswordInput`** — Masked password input
|
|
100
|
+
|
|
101
|
+
### Feedback
|
|
102
|
+
|
|
103
|
+
- **`Spinner`** — Loading indicator
|
|
104
|
+
- **`ProgressBar`** — Progress bar with percentage
|
|
105
|
+
- **`TaskRunner`** — Task list with status indicators (pending, running, done, error)
|
|
106
|
+
- **`Dashboard`** — Multi-panel dashboard layout
|
|
107
|
+
|
|
108
|
+
## Utilities
|
|
109
|
+
|
|
110
|
+
- **`symbols`** — Unicode symbols (`✓`, `✗`, `⚠`, `ℹ`, `➜`, `❯`, `●`, `─`)
|
|
111
|
+
- **`colors`** — Semantic color mappings (success, error, warning, info)
|
|
112
|
+
- **`useKeyboard`** — Keyboard input hook
|
|
113
|
+
- **`useFocus`** — Focus management for interactive components
|
|
114
|
+
- **`isInteractive`** — Detect if running in an interactive terminal
|
|
115
|
+
- **`renderToString`** — Render components to string (for testing or non-interactive output)
|
|
116
|
+
|
|
117
|
+
## Related Packages
|
|
118
|
+
|
|
119
|
+
- [`@vertz/cli`](../cli) — The Vertz CLI (built with this package)
|
|
120
|
+
- [`@vertz/cli-runtime`](../cli-runtime) — Runtime for generated CLIs
|
|
121
|
+
|
|
122
|
+
## License
|
|
123
|
+
|
|
124
|
+
MIT
|