cli-table-formatter
npx machina-cli add skill a5c-ai/babysitter/cli-table-formatter --openclawCLI Table Formatter
Generate table formatters for structured CLI output.
Capabilities
- Create table formatters with various styles
- Configure column alignment and width
- Implement responsive table sizing
- Support Unicode borders
- Handle multiline cells
- Generate table utilities
Usage
Invoke this skill when you need to:
- Display tabular data in CLI
- Create formatted list output
- Configure column widths
- Support various border styles
Inputs
| Parameter | Type | Required | Description |
|---|---|---|---|
| language | string | Yes | Target language |
| style | string | No | Border style (simple, unicode, markdown) |
| features | array | No | Required features |
Generated Patterns
TypeScript Table Formatter
import chalk from 'chalk';
export interface TableColumn {
key: string;
header: string;
width?: number;
align?: 'left' | 'center' | 'right';
format?: (value: any) => string;
}
export interface TableOptions {
columns: TableColumn[];
borderStyle?: 'simple' | 'unicode' | 'none' | 'markdown';
headerColor?: (text: string) => string;
maxWidth?: number;
}
const borders = {
simple: {
top: '-', bottom: '-', left: '|', right: '|',
topLeft: '+', topRight: '+', bottomLeft: '+', bottomRight: '+',
horizontal: '-', vertical: '|', cross: '+',
},
unicode: {
top: '─', bottom: '─', left: '│', right: '│',
topLeft: '┌', topRight: '┐', bottomLeft: '└', bottomRight: '┘',
horizontal: '─', vertical: '│', cross: '┼',
midLeft: '├', midRight: '┤', topMid: '┬', bottomMid: '┴',
},
none: {
top: '', bottom: '', left: '', right: '',
topLeft: '', topRight: '', bottomLeft: '', bottomRight: '',
horizontal: '', vertical: ' ', cross: '',
},
};
export class TableFormatter {
private columns: TableColumn[];
private options: TableOptions;
private border: typeof borders.unicode;
constructor(options: TableOptions) {
this.options = options;
this.columns = options.columns;
this.border = borders[options.borderStyle || 'unicode'];
}
private calculateWidths(data: Record<string, any>[]): number[] {
return this.columns.map(col => {
const headerWidth = col.header.length;
const maxDataWidth = Math.max(
...data.map(row => String(row[col.key] ?? '').length)
);
return col.width || Math.max(headerWidth, maxDataWidth);
});
}
private padCell(text: string, width: number, align: 'left' | 'center' | 'right' = 'left'): string {
const padding = width - text.length;
if (align === 'center') {
const left = Math.floor(padding / 2);
const right = padding - left;
return ' '.repeat(left) + text + ' '.repeat(right);
}
if (align === 'right') {
return ' '.repeat(padding) + text;
}
return text + ' '.repeat(padding);
}
format(data: Record<string, any>[]): string {
const widths = this.calculateWidths(data);
const lines: string[] = [];
const b = this.border;
// Top border
if (b.top) {
lines.push(
b.topLeft +
widths.map(w => b.top.repeat(w + 2)).join(b.topMid || b.cross) +
b.topRight
);
}
// Header
const headerCells = this.columns.map((col, i) =>
' ' + this.padCell(col.header, widths[i], col.align) + ' '
);
const headerColor = this.options.headerColor || chalk.bold;
lines.push(
b.left +
headerCells.map(c => headerColor(c)).join(b.vertical) +
b.right
);
// Header separator
if (b.horizontal) {
lines.push(
(b.midLeft || b.left) +
widths.map(w => b.horizontal.repeat(w + 2)).join(b.cross) +
(b.midRight || b.right)
);
}
// Data rows
for (const row of data) {
const cells = this.columns.map((col, i) => {
const value = row[col.key] ?? '';
const formatted = col.format ? col.format(value) : String(value);
return ' ' + this.padCell(formatted, widths[i], col.align) + ' ';
});
lines.push(b.left + cells.join(b.vertical) + b.right);
}
// Bottom border
if (b.bottom) {
lines.push(
b.bottomLeft +
widths.map(w => b.bottom.repeat(w + 2)).join(b.bottomMid || b.cross) +
b.bottomRight
);
}
return lines.join('\n');
}
}
// Quick table function
export function table(
data: Record<string, any>[],
columns?: (string | TableColumn)[]
): string {
const cols: TableColumn[] = columns
? columns.map(c => typeof c === 'string' ? { key: c, header: c } : c)
: Object.keys(data[0] || {}).map(key => ({ key, header: key }));
return new TableFormatter({ columns: cols }).format(data);
}
Usage Examples
// Simple table
console.log(table([
{ name: 'Alice', age: 30, role: 'Admin' },
{ name: 'Bob', age: 25, role: 'User' },
]));
// Custom columns
const formatter = new TableFormatter({
columns: [
{ key: 'id', header: 'ID', width: 6, align: 'right' },
{ key: 'name', header: 'Name', width: 20 },
{ key: 'status', header: 'Status', format: (v) =>
v === 'active' ? chalk.green(v) : chalk.red(v)
},
],
borderStyle: 'unicode',
headerColor: chalk.cyan.bold,
});
console.log(formatter.format(data));
Dependencies
{
"dependencies": {
"chalk": "^5.0.0"
}
}
Target Processes
- cli-output-formatting
- dashboard-monitoring-tui
- cli-application-bootstrap
Source
git clone https://github.com/a5c-ai/babysitter/blob/main/plugins/babysitter/skills/babysit/process/specializations/cli-mcp-development/skills/cli-table-formatter/SKILL.mdView on GitHub Overview
Generates table formatters for structured CLI output. It supports configurable column widths, alignment, and responsive sizing, plus Unicode or markdown borders. The approach is driven by a TypeScript example with TableColumn and TableOptions to build flexible, bordered tables.
How This Skill Works
You define an array of TableColumn objects (key, header, width, align, format) and a TableOptions object (columns, borderStyle, headerColor, maxWidth). The TableFormatter is instantiated with these options, calculates per-column widths from headers and data, pads cells according to alignment, and renders the result by assembling borders, headers, and rows via a format(data) call.
When to Use It
- Display tabular data in a CLI app with consistent borders and alignment
- Create a formatted list output with customizable column headers
- Configure column widths to control wrapping and readability
- Switch between border styles (simple, unicode, markdown) for different CLIs
- Handle multiline cells within a tabular output
Quick Start
- Step 1: Define columns with keys and headers in a TableColumn array
- Step 2: Create TableOptions with the columns and a borderStyle (e.g., 'unicode')
- Step 3: Call new TableFormatter(options).format(data) to render the table
Best Practices
- Define clear, concise headers and consistent keys in TableColumn
- Set explicit column widths for predictable layouts and wrap control
- Choose an appropriate borderStyle to match your CLI aesthetic
- Use headerColor to improve header readability without obscuring data
- Test with representative data, including long text, to verify alignment
Example Use Cases
- Inventory table in a CLI tool with columns: ID, Item, Quantity, Price
- Process monitor showing PID, Name, CPU%, Memory% with unicode borders
- Student grades table with aligned numeric scores and letter grades
- Git-style status summary presented as a bordered table
- API call summary listing endpoint, status, duration, and payload size