@phnx-labs/agents-cli 1.20.34 → 1.20.36

package/dist/commands/repo.js

@@ -106,13 +106,12 @@ export function resourceUnit(file) {
     return { kind: 'other', unit: file };
 }
 /**
- * Render a set of changed files as a resource-level summary, e.g.
- * `2 new skills, 1 changed hook`. Counts distinct resource units (a skill whose
- * three files all changed is "1 changed skill"), grouped by action then kind,
- * and colors each phrase green/yellow/red for new/changed/removed. Caps at
- * `maxParts` phrases, appending `+N more` so a big diff stays scannable.
+ * Collapse a changed-file set to distinct resource units, then count them by
+ * (action, kind). A skill whose three files all changed counts as one changed
+ * skill; a unit with mixed add+modify reads as a single change. This is the
+ * shared structured core behind every SYNC / CHANGES rendering.
  */
-export function formatResourceDelta(entries, maxParts = 5) {
+export function resourceDelta(entries) {
     // Gather every action seen across a unit's files, then collapse to one action.
     const units = new Map();
     for (const { action, file } of entries) {
@@ -136,19 +135,28 @@ export function formatResourceDelta(entries, maxParts = 5) {
         const key = `${action} ${kind}`;
         counts.set(key, (counts.get(key) ?? 0) + 1);
     }
-    const COLOR = {
-        new: chalk.green, changed: chalk.yellow, removed: chalk.red,
-    };
-    const parts = [];
+    const ordered = [];
     for (const action of ['new', 'changed', 'removed']) {
         for (const kind of RESOURCE_ORDER) {
             const n = counts.get(`${action} ${kind}`);
-            if (!n)
-                continue;
-            const [singular, plural] = RESOURCE_LABELS[kind];
-            parts.push(COLOR[action](`${n} ${action} ${n === 1 ? singular : plural}`));
+            if (n)
+                ordered.push({ action, kind, count: n });
         }
     }
+    return { counts: ordered, total: units.size };
+}
+const ACTION_COLOR = {
+    new: chalk.green, changed: chalk.yellow, removed: chalk.red,
+};
+/** One colored phrase per counted resource, e.g. `2 new skills`. */
+function deltaPhrases(delta) {
+    return delta.counts.map(({ action, kind, count }) => {
+        const [singular, plural] = RESOURCE_LABELS[kind];
+        return ACTION_COLOR[action](`${count} ${action} ${count === 1 ? singular : plural}`);
+    });
+}
+/** Join phrases with `, `, capping at `maxParts` and appending `+N more`. */
+function joinPhrases(parts, maxParts) {
     if (parts.length > maxParts) {
         const shown = parts.slice(0, maxParts);
         shown.push(chalk.gray(`+${parts.length - maxParts} more`));
@@ -156,6 +164,36 @@ export function formatResourceDelta(entries, maxParts = 5) {
     }
     return parts.join(', ');
 }
+/**
+ * Kind-only brief for the compact (wide-terminal) layout: `(24 skills, 9 commands, +20)`
+ * — the top `maxKinds` kinds by display order, with a `+N` remainder. Drops the
+ * new/changed verb (the arrow already carries direction) to stay short. Returns
+ * '' when there is nothing to summarize.
+ */
+export function deltaBrief(delta, maxKinds = 2) {
+    if (delta.total === 0)
+        return '';
+    const shown = delta.counts.slice(0, maxKinds);
+    const shownUnits = shown.reduce((s, c) => s + c.count, 0);
+    const rest = delta.total - shownUnits;
+    const kinds = shown.map(({ kind, count }) => {
+        const [singular, plural] = RESOURCE_LABELS[kind];
+        return `${count} ${count === 1 ? singular : plural}`;
+    });
+    if (rest > 0)
+        kinds.push(`+${rest}`);
+    return chalk.gray(`(${kinds.join(', ')})`);
+}
+/**
+ * Render a set of changed files as a resource-level summary, e.g.
+ * `2 new skills, 1 changed hook`. Counts distinct resource units (a skill whose
+ * three files all changed is "1 changed skill"), grouped by action then kind,
+ * and colors each phrase green/yellow/red for new/changed/removed. Caps at
+ * `maxParts` phrases, appending `+N more` so a big diff stays scannable.
+ */
+export function formatResourceDelta(entries, maxParts = 5) {
+    return joinPhrases(deltaPhrases(resourceDelta(entries)), maxParts);
+}
 /** Parse `git diff --name-status <range>` into resource-delta entries. */
 async function diffResourceEntries(git, range) {
     let raw;
@@ -189,9 +227,10 @@ function padVisible(s, width) {
     return s + ' '.repeat(Math.max(0, width - visibleWidth(s)));
 }
 /**
- * Render one repo's row data: branch, resource-level sync (what a pull/push would
- * move), resource-level local edits, and the remote URL + commit. Used by
- * `agents repo list` and the hidden `agents repo status` alias.
+ * Read one repo's status into structured data: branch, resource-level sync (what
+ * a pull/push would move), resource-level local edits, and remote URL + commit.
+ * Formatting is deferred to the layout renderers so the same data can drive both
+ * the wide table and the narrow cards.
  */
 async function renderRepoRow(t) {
     if (!fs.existsSync(t.dir)) {
@@ -205,29 +244,19 @@ async function renderRepoRow(t) {
         const status = await git.status();
         // Show the local branch name; the upstream remote is already implied by URL.
         const branch = status.current || (status.tracking ? status.tracking.replace(/^origin\//, '') : '(detached)');
+        const row = { alias: t.alias, branch, tracking: !!status.tracking };
         // SYNC: what a pull brings in / a push sends out, described by resource.
         const ahead = status.ahead ?? 0;
         const behind = status.behind ?? 0;
-        let sync;
-        if (!status.tracking) {
-            sync = chalk.gray('no upstream');
-        }
-        else if (ahead === 0 && behind === 0) {
-            sync = chalk.green('up to date');
-        }
-        else {
-            const pieces = [];
+        if (status.tracking) {
             if (behind > 0) {
                 // Three-dot isolates upstream's side via the merge-base, so a diverged
                 // branch reports exactly what a pull adds (not the inverse of local commits).
-                const incoming = formatResourceDelta(await diffResourceEntries(git, 'HEAD...@{upstream}'));
-                pieces.push(`${incoming || chalk.yellow(`${behind} commit${behind > 1 ? 's' : ''}`)} ${chalk.gray('to pull')}`);
+                row.pull = { delta: resourceDelta(await diffResourceEntries(git, 'HEAD...@{upstream}')), commits: behind };
             }
             if (ahead > 0) {
-                const outgoing = formatResourceDelta(await diffResourceEntries(git, '@{upstream}...HEAD'));
-                pieces.push(`${outgoing || chalk.yellow(`${ahead} commit${ahead > 1 ? 's' : ''}`)} ${chalk.gray('to push')}`);
+                row.push = { delta: resourceDelta(await diffResourceEntries(git, '@{upstream}...HEAD')), commits: ahead };
             }
-            sync = pieces.join(chalk.gray('  ·  '));
         }
         // CHANGES: uncommitted working-tree edits, described by resource.
         const localEntries = [
@@ -238,28 +267,183 @@ async function renderRepoRow(t) {
             ...status.renamed.map((r) => ({ action: 'changed', file: r.to })),
             ...status.deleted.map((f) => ({ action: 'removed', file: f })),
         ];
-        const changes = status.isClean() ? chalk.green('clean') : formatResourceDelta(localEntries);
+        row.clean = status.isClean();
+        if (!row.clean)
+            row.local = resourceDelta(localEntries);
         const remotes = await git.getRemotes(true);
         const origin = remotes.find((r) => r.name === 'origin');
-        const url = origin?.refs?.fetch || '';
-        const commit = (await git.log({ maxCount: 1 })).latest?.hash.slice(0, 8) || '';
-        const remote = url
-            ? chalk.gray(`${url}${commit ? ` (${commit})` : ''}`)
-            : commit
-                ? chalk.gray(`(${commit})`)
-                : '';
-        return { alias: t.alias, cells: [branch, sync, changes, remote] };
+        row.url = origin?.refs?.fetch || '';
+        row.commit = (await git.log({ maxCount: 1 })).latest?.hash.slice(0, 8) || '';
+        return row;
     }
     catch (err) {
         return { alias: t.alias, raw: `${chalk.red('error')} ${err.message}` };
     }
 }
+/** Terminal width at or above which `list` uses the wide table instead of cards. */
+const WIDE_COLS = 120;
+const commitsWord = (n) => chalk.yellow(`${n} commit${n > 1 ? 's' : ''}`);
+/** `owner/repo` from a git URL, for the compact card header. Falls back to the raw URL. */
+export function repoSlug(url) {
+    const m = url.match(/github\.com[:/]([^/]+\/[^/]+?)(?:\.git)?$/);
+    return m ? m[1] : url;
+}
+/** Full SYNC string: `24 new skills, ... to pull  ·  ... to push` (verbose table). */
+function syncFull(row) {
+    if (!row.tracking)
+        return chalk.gray('no upstream');
+    if (!row.pull && !row.push)
+        return chalk.green('up to date');
+    const pieces = [];
+    if (row.pull) {
+        const detail = joinPhrases(deltaPhrases(row.pull.delta), 5) || commitsWord(row.pull.commits);
+        pieces.push(`${detail} ${chalk.gray('to pull')}`);
+    }
+    if (row.push) {
+        const detail = joinPhrases(deltaPhrases(row.push.delta), 5) || commitsWord(row.push.commits);
+        pieces.push(`${detail} ${chalk.gray('to push')}`);
+    }
+    return pieces.join(chalk.gray('  ·  '));
+}
+/** Compact SYNC for the wide table: `↓53 (24 skills, 9 commands, +20)  ↑13`. */
+function syncCompact(row) {
+    if (!row.tracking)
+        return chalk.gray('no upstream');
+    if (!row.pull && !row.push)
+        return chalk.green('up to date');
+    const pieces = [];
+    if (row.pull) {
+        const n = row.pull.delta.total || row.pull.commits;
+        const brief = deltaBrief(row.pull.delta);
+        pieces.push(`${chalk.yellow(`↓${n}`)}${brief ? ` ${brief}` : ''}`);
+    }
+    if (row.push) {
+        const n = row.push.delta.total || row.push.commits;
+        pieces.push(chalk.magenta(`↑${n}`));
+    }
+    return pieces.join('  ');
+}
+/** Full CHANGES string for the verbose table. */
+function changesFull(row) {
+    if (row.clean)
+        return chalk.green('clean');
+    return joinPhrases(deltaPhrases(row.local), 5);
+}
+/** Compact CHANGES for the wide table: `clean` or `~1 edit`. */
+function changesCompact(row) {
+    if (row.clean)
+        return chalk.green('clean');
+    const n = row.local.total;
+    return chalk.yellow(`~${n} edit${n === 1 ? '' : 's'}`);
+}
+/**
+ * Print the aligned table. `compact` picks short (arrow-count) SYNC/CHANGES cells
+ * that keep the table bounded; verbose passes `compact: false` for full detail.
+ * Only the trailing REMOTE column is allowed to run long.
+ */
+function renderTable(rows, compact) {
+    const cells = new Map();
+    for (const r of rows) {
+        if (r.raw)
+            continue;
+        const remote = r.url
+            ? chalk.gray(`${r.url}${r.commit ? ` (${r.commit})` : ''}`)
+            : r.commit ? chalk.gray(`(${r.commit})`) : '';
+        cells.set(r.alias, [
+            r.branch ?? '',
+            compact ? syncCompact(r) : syncFull(r),
+            compact ? changesCompact(r) : changesFull(r),
+            remote,
+        ]);
+    }
+    const headers = ['REPO', 'BRANCH', 'SYNC', 'CHANGES'];
+    const tableCells = [...cells.values()];
+    const aliasW = Math.max(headers[0].length, ...rows.map((r) => r.alias.length));
+    const branchW = Math.max(headers[1].length, 0, ...tableCells.map((c) => visibleWidth(c[0])));
+    const syncW = Math.max(headers[2].length, 0, ...tableCells.map((c) => visibleWidth(c[1])));
+    const changesW = Math.max(headers[3].length, 0, ...tableCells.map((c) => visibleWidth(c[2])));
+    console.log(`  ${chalk.gray(headers[0].padEnd(aliasW))}  ${chalk.gray(headers[1].padEnd(branchW))}  ${chalk.gray(headers[2].padEnd(syncW))}  ${chalk.gray(headers[3].padEnd(changesW))}  ${chalk.gray('REMOTE')}`);
+    for (const r of rows) {
+        const aliasCol = chalk.cyan(r.alias.padEnd(aliasW));
+        const c = cells.get(r.alias);
+        if (c) {
+            console.log(`  ${aliasCol}  ${padVisible(c[0], branchW)}  ${padVisible(c[1], syncW)}  ${padVisible(c[2], changesW)}  ${c[3]}`);
+        }
+        else {
+            console.log(`  ${aliasCol}  ${r.raw}`);
+        }
+    }
+}
+/** Pack colored phrases into `, `-joined lines no wider than `width`. */
+export function wrapPhrases(parts, width) {
+    const lines = [];
+    let cur = '';
+    for (const p of parts) {
+        const cand = cur ? `${cur}, ${p}` : p;
+        if (cur && visibleWidth(cand) > width) {
+            lines.push(cur);
+            cur = p;
+        }
+        else {
+            cur = cand;
+        }
+    }
+    if (cur)
+        lines.push(cur);
+    return lines;
+}
+/**
+ * Print one block per repo, width-independent. The category list wraps under an
+ * indented `↓ pull` / `↑ push` / `local` label instead of running off the edge,
+ * so a narrow terminal stays readable.
+ */
+function renderCards(rows, cols) {
+    const LABEL = '      '; // indent for detail labels
+    const detailWidth = Math.max(20, cols - LABEL.length - 9); // 9 ≈ "↓ pull   "
+    let first = true;
+    for (const r of rows) {
+        if (!first)
+            console.log('');
+        first = false;
+        if (r.raw) {
+            console.log(`  ${chalk.cyan(r.alias)}  ${r.raw}`);
+            continue;
+        }
+        const head = [r.branch, r.commit || null, r.url ? repoSlug(r.url) : null].filter(Boolean).join(chalk.gray(' · '));
+        console.log(`  ${chalk.green('●')} ${chalk.cyan(r.alias)}  ${chalk.gray(head)}`);
+        const detail = (label, div, color) => {
+            const phrases = div.delta.total ? deltaPhrases(div.delta) : [commitsWord(div.commits)];
+            const lines = wrapPhrases(phrases, detailWidth);
+            lines.forEach((line, i) => {
+                const lab = i === 0 ? color(label.padEnd(9)) : ' '.repeat(9);
+                console.log(`${LABEL}${lab}${line}`);
+            });
+        };
+        if (r.tracking === false) {
+            console.log(`${LABEL}${chalk.gray('no upstream')}`);
+        }
+        else if (r.pull || r.push) {
+            if (r.pull)
+                detail('↓ pull', r.pull, chalk.yellow);
+            if (r.push)
+                detail('↑ push', r.push, chalk.magenta);
+        }
+        const local = r.clean ? chalk.green('clean') : wrapPhrases(deltaPhrases(r.local), detailWidth);
+        if (Array.isArray(local)) {
+            local.forEach((line, i) => console.log(`${LABEL}${chalk.gray((i === 0 ? 'local' : '').padEnd(9))}${line}`));
+        }
+        else {
+            console.log(`${LABEL}${chalk.gray('local'.padEnd(9))}${local}`);
+        }
+    }
+}
 /**
  * Shared action body for `agents repo list` and the hidden `agents repo status`
- * alias. Prints an aligned table: repo, branch, resource-level sync (to pull /
- * to push), resource-level local changes, and remote URL + short commit.
+ * alias. Responsive: a wide terminal gets an aligned table with compact SYNC /
+ * CHANGES cells; a narrow one gets one card per repo with wrapping detail;
+ * `--verbose` forces the full-detail table at any width.
  */
-async function listRepos(alias) {
+async function listRepos(alias, opts = {}) {
     const targets = collectRepoTargets(alias);
     if (!targets) {
         process.exitCode = 1;
@@ -270,25 +454,17 @@ async function listRepos(alias) {
         return;
     }
     const rows = await Promise.all(targets.map(renderRepoRow));
-    const tableRows = rows.filter((r) => r.cells);
-    // Column widths grow to fit the widest visible content (resource summaries vary
-    // a lot in length), so the table stays aligned without truncating detail.
-    const headers = ['REPO', 'BRANCH', 'SYNC', 'CHANGES'];
-    const aliasW = Math.max(headers[0].length, ...rows.map((r) => r.alias.length));
-    const branchW = Math.max(headers[1].length, 0, ...tableRows.map((r) => visibleWidth(r.cells[0])));
-    const syncW = Math.max(headers[2].length, 0, ...tableRows.map((r) => visibleWidth(r.cells[1])));
-    const changesW = Math.max(headers[3].length, 0, ...tableRows.map((r) => visibleWidth(r.cells[2])));
+    // TTY width when interactive; fall back to $COLUMNS (honored when piped) then 80.
+    const cols = process.stdout.columns || Number(process.env.COLUMNS) || 80;
     console.log('');
-    console.log(`  ${chalk.gray(headers[0].padEnd(aliasW))}  ${chalk.gray(headers[1].padEnd(branchW))}  ${chalk.gray(headers[2].padEnd(syncW))}  ${chalk.gray(headers[3].padEnd(changesW))}  ${chalk.gray('REMOTE')}`);
-    for (const r of rows) {
-        const aliasCol = chalk.cyan(r.alias.padEnd(aliasW));
-        if (r.cells) {
-            const [branch, sync, changes, remote] = r.cells;
-            console.log(`  ${aliasCol}  ${padVisible(branch, branchW)}  ${padVisible(sync, syncW)}  ${padVisible(changes, changesW)}  ${remote}`);
-        }
-        else {
-            console.log(`  ${aliasCol}  ${r.raw}`);
-        }
+    if (opts.verbose) {
+        renderTable(rows, false);
+    }
+    else if (cols >= WIDE_COLS) {
+        renderTable(rows, true);
+    }
+    else {
+        renderCards(rows, cols);
     }
     const userDir = getUserAgentsDir();
     if (!isGitRepo(userDir) && fs.existsSync(userDir)) {
@@ -495,8 +671,9 @@ export function registerRepoCommands(program) {
         .command('list [alias]')
         .alias('ls')
         .description('Show all repos with resource-level sync (skills/commands/plugins to pull or push) and local changes.')
-        .action(async (alias) => {
-        await listRepos(alias);
+        .option('-v, --verbose', 'Full per-resource detail in a table, regardless of terminal width')
+        .action(async (alias, options) => {
+        await listRepos(alias, options);
     });
     repoCmd
         .command('view [name]')
@@ -743,8 +920,9 @@ export function registerRepoCommands(program) {
     repoCmd
         .command('status [alias]', { hidden: true })
         .description('Alias of `list` (kept for muscle memory).')
-        .action(async (alias) => {
-        await listRepos(alias);
+        .option('-v, --verbose', 'Full per-resource detail in a table, regardless of terminal width')
+        .action(async (alias, options) => {
+        await listRepos(alias, options);
     });
 }
 /**

package/dist/commands/resource-view.d.ts

@@ -36,5 +36,25 @@ export interface ResourceViewOptions {
 }
 /** Display a resource list: interactive picker in TTY mode, plain table otherwise. */
 export declare function showResourceList(opts: ResourceViewOptions): Promise<void>;
+export interface ResourceLayout {
+    mode: 'table' | 'cards';
+    nameW: number;
+    extraW: number;
+    extra2W: number;
+    descW: number;
+    syncW: number;
+}
+/**
+ * Pure column arithmetic. Decides table vs. cards for the effective terminal
+ * width and sizes the flexible Description column from whatever is left after the
+ * fixed columns and a capped Sync column — so the table fits `cols` instead of
+ * the old fixed 22+10+16+42+∞ layout that overflowed every narrow terminal.
+ */
+export declare function resourceLayout(cols: number, o: {
+    hasExtra: boolean;
+    hasExtra2: boolean;
+    nameW: number;
+    syncW: number;
+}): ResourceLayout;
 /** Build the sync targets section showing version pills grouped by agent. */
 export declare function buildTargetsSection(targets: SyncTarget[]): string;

package/dist/commands/resource-view.js

@@ -10,6 +10,7 @@ import chalk from 'chalk';
 import { agentLabel } from '../lib/agents.js';
 import { itemPicker } from '../lib/picker.js';
 import { isInteractiveTerminal, isPromptCancelled, printWithPager } from './utils.js';
+import { terminalWidth, truncateToWidth, padToWidth, stringWidth, stripAnsi } from '../lib/session/width.js';
 /** Display a resource list: interactive picker in TTY mode, plain table otherwise. */
 export async function showResourceList(opts) {
     if (opts.rows.length === 0) {
@@ -76,23 +77,49 @@ function formatPickerRow(row, opts) {
     const sync = formatSyncSummary(row.targets, opts);
     return `${name} ${extra}${extra2}${desc} ${sync}`;
 }
-/** Render resources as a plain-text table (used when output is piped). */
+/** Max width for the Name column in the wide table. */
+const NAME_CAP = 22;
+/** Below this many columns of description budget, the list stacks into cards. */
+const MIN_DESC_W = 24;
+/**
+ * Pure column arithmetic. Decides table vs. cards for the effective terminal
+ * width and sizes the flexible Description column from whatever is left after the
+ * fixed columns and a capped Sync column — so the table fits `cols` instead of
+ * the old fixed 22+10+16+42+∞ layout that overflowed every narrow terminal.
+ */
+export function resourceLayout(cols, o) {
+    const extraW = o.hasExtra ? 10 : 0;
+    const extra2W = o.hasExtra2 ? 16 : 0;
+    // Cap Sync so a long "missing on …" tail can't starve the description.
+    const syncW = Math.min(o.syncW, Math.max(14, Math.floor(cols * 0.32)));
+    const fixed = o.nameW + 1 + (extraW ? extraW + 1 : 0) + (extra2W ? extra2W + 1 : 0) + 1 + syncW;
+    const descW = cols - fixed;
+    return {
+        mode: descW >= MIN_DESC_W ? 'table' : 'cards',
+        nameW: o.nameW,
+        extraW,
+        extra2W,
+        descW,
+        syncW,
+    };
+}
+/** Render resources (used when output is piped). Responsive: wide table or cards. */
 function printResourceTable(opts) {
-    const header = buildTableHeader(opts);
-    console.log(header);
-    console.log(chalk.gray('─'.repeat(Math.min(process.stdout.columns || 100, 120))));
-    for (const row of opts.rows) {
-        const name = chalk.cyan(padRight(row.name, 22));
-        const extra = opts.extraLabel
-            ? padRight(row.extra ?? '-', 10)
-            : '';
-        const extra2 = opts.extra2Label
-            ? padRight(row.extra2 ?? '-', 16)
-            : '';
-        const descRaw = row.description ? truncate(row.description, 40) : '-';
-        const desc = padRight(chalk.gray(descRaw), 42);
-        const sync = formatSyncSummary(row.targets, opts);
-        console.log(`${name} ${extra}${extra2}${desc} ${sync}`);
+    const cols = terminalWidth();
+    const syncStrings = opts.rows.map((r) => formatSyncSummary(r.targets, opts));
+    const nameW = Math.min(NAME_CAP, Math.max('Name'.length, ...opts.rows.map((r) => stringWidth(r.name))));
+    const syncMax = Math.max('Synced'.length, ...syncStrings.map((s) => stringWidth(s)));
+    const layout = resourceLayout(cols, {
+        hasExtra: Boolean(opts.extraLabel),
+        hasExtra2: Boolean(opts.extra2Label),
+        nameW,
+        syncW: syncMax,
+    });
+    if (layout.mode === 'cards') {
+        renderResourceCards(opts, cols, syncStrings);
+    }
+    else {
+        renderResourceWideTable(opts, layout, syncStrings);
     }
     console.log();
     const summary = [
@@ -103,18 +130,53 @@ function printResourceTable(opts) {
     }
     console.log(chalk.gray(summary.join(' · ')));
 }
-/** Build the column header line for the plain-text table. */
-function buildTableHeader(opts) {
-    const name = chalk.bold(padRight('Name', 22));
-    const extra = opts.extraLabel
-        ? chalk.bold(padRight(opts.extraLabel, 10))
-        : '';
-    const extra2 = opts.extra2Label
-        ? chalk.bold(padRight(opts.extra2Label, 16))
-        : '';
-    const desc = padRight(chalk.bold('Description'), 42);
-    const sync = chalk.bold('Synced');
-    return `${name} ${extra}${extra2}${desc} ${sync}`;
+/** Wide aligned table: Name · [Extra] · [Extra2] · Description (flex) · Synced. */
+function renderResourceWideTable(opts, L, syncStrings) {
+    const cell = (text, width, color) => {
+        const clipped = truncateToWidth(text, width);
+        return padToWidth(color ? color(clipped) : clipped, width);
+    };
+    // Pass the colour as the third arg: cell() truncates the plain text first, then
+    // colours the result. Pre-colouring here would be stripped by truncateToWidth.
+    const headerParts = [cell('Name', L.nameW, chalk.bold)];
+    if (L.extraW)
+        headerParts.push(cell(opts.extraLabel ?? '', L.extraW, chalk.bold));
+    if (L.extra2W)
+        headerParts.push(cell(opts.extra2Label ?? '', L.extra2W, chalk.bold));
+    headerParts.push(cell('Description', L.descW, chalk.bold));
+    headerParts.push(chalk.bold('Synced'));
+    console.log(headerParts.join(' '));
+    const contentW = L.nameW + 1 + (L.extraW ? L.extraW + 1 : 0) + (L.extra2W ? L.extra2W + 1 : 0) + L.descW + 1 + L.syncW;
+    console.log(chalk.gray('─'.repeat(Math.min(contentW, terminalWidth()))));
+    opts.rows.forEach((row, i) => {
+        const parts = [cell(row.name, L.nameW, chalk.cyan)];
+        if (L.extraW)
+            parts.push(cell(row.extra ?? '-', L.extraW));
+        if (L.extra2W)
+            parts.push(cell(row.extra2 ?? '-', L.extra2W));
+        parts.push(cell(row.description ?? '-', L.descW, chalk.gray));
+        let sync = syncStrings[i] ?? '';
+        if (stringWidth(sync) > L.syncW)
+            sync = chalk.gray(truncateToWidth(sync, L.syncW));
+        parts.push(sync);
+        console.log(parts.join(' '));
+    });
+}
+/** Stacked cards for narrow terminals: name + meta on one line, description below. */
+function renderResourceCards(opts, cols, syncStrings) {
+    opts.rows.forEach((row, i) => {
+        const meta = [row.extra, row.extra2, stripAnsi(syncStrings[i] ?? '')]
+            .filter((s) => Boolean(s && s.trim()))
+            .join(' · ');
+        const metaBudget = Math.max(8, cols - stringWidth(row.name) - 2);
+        const line1 = meta
+            ? `${chalk.cyan(row.name)}  ${chalk.gray(truncateToWidth(meta, metaBudget))}`
+            : chalk.cyan(row.name);
+        console.log(line1);
+        if (row.description) {
+            console.log(`    ${chalk.gray(truncateToWidth(row.description, cols - 4))}`);
+        }
+    });
 }
 /** Compact sync summary: "everywhere", "14 of 16 installs", or "not installed". */
 function formatSyncSummary(targets, opts) {