| name | blessed-widget-generator |
| description | Generate blessed widgets for Node.js terminal UIs with boxes, lists, forms, and dashboard layouts. |
| allowed-tools | Read, Write, Edit, Bash, Glob, Grep |
| graph | {"domains":["domain:software-engineering"],"specializations":["specialization:cli-mcp-development"],"skillAreas":["skill-area:cli-design","skill-area:command-line-interface-tools"],"roles":["role:backend-engineer","role:platform-engineer"],"workflows":["workflow:feature-development"],"topics":["topic:developer-experience"]} |
Blessed Widget Generator
Generate blessed widgets for Node.js terminal UIs.
Capabilities
- Generate blessed widget definitions
- Create dashboard layouts
- Set up interactive forms
- Implement custom components
- Configure styling and borders
- Create event handling patterns
Usage
Invoke this skill when you need to:
- Build terminal dashboards with Node.js
- Create complex TUI layouts
- Implement monitoring interfaces
- Set up blessed project structure
Inputs
| Parameter | Type | Required | Description |
|---|
| projectName | string | Yes | Project name |
| layout | string | No | Layout type (dashboard, form, list) |
| widgets | array | No | Widget definitions |
Generated Patterns
Dashboard Layout
const blessed = require('blessed');
const contrib = require('blessed-contrib');
const screen = blessed.screen({
smartCSR: true,
title: 'System Dashboard',
});
const grid = new contrib.grid({
rows: 12,
cols: 12,
screen: screen,
});
const cpuLine = grid.set(0, 0, 4, 6, contrib.line, {
style: { line: 'yellow', text: 'green', baseline: 'black' },
xLabelPadding: 3,
xPadding: 5,
showLegend: true,
label: 'CPU Usage',
});
const memGauge = grid.set(0, 6, 4, 6, contrib.gauge, {
label: ,
: ,
: ,
});
logBox = grid.(, , , , contrib., {
: ,
: ,
: ,
});
processTable = grid.(, , , , contrib., {
: ,
: ,
: ,
: ,
: ,
: ,
: ,
: [, , , ],
});
() {
cpuLine.([{
: ,
: [, , , , ],
: [.() * , .() * , .() * , .() * , .() * ],
}]);
memGauge.(.() * );
logBox.();
processTable.({
: [, , , ],
: [
[, , , ],
[, , , ],
],
});
screen.();
}
screen.([, , ], process.());
(updateDashboard, );
();
screen.();
Form Widget
const blessed = require('blessed');
const screen = blessed.screen({
smartCSR: true,
title: 'Configuration Form',
});
const form = blessed.form({
parent: screen,
keys: true,
left: 'center',
top: 'center',
width: 60,
height: 20,
border: { type: 'line' },
style: { border: { fg: 'blue' } },
});
blessed.text({
parent: form,
top: 1,
left: 2,
content: 'Username:',
});
const usernameInput = blessed.textbox({
parent: form,
name: 'username',
top: 1,
left: 12,
height: 1,
width: 40,
inputOnFocus: true,
style: { fg: , : },
});
blessed.({
: form,
: ,
: ,
: ,
});
passwordInput = blessed.({
: form,
: ,
: ,
: ,
: ,
: ,
: ,
: ,
: { : , : },
});
submitBtn = blessed.({
: form,
: ,
: ,
: ,
: ,
: ,
: {
: ,
: ,
: { : },
},
});
submitBtn.(, {
form.();
});
form.(, {
.(, data);
process.();
});
screen.([, ], process.());
screen.();
Dependencies
{
"dependencies": {
"blessed": "^0.1.81",
"blessed-contrib": "^4.10.1"
}
}
Target Processes
- tui-application-framework
- dashboard-monitoring-tui
- interactive-form-implementation