@nexusbloom/cli 0.2.12 → 0.3.1

package/src/ui.js

@@ -0,0 +1,175 @@
+/**
+ * ui.js — Terminal UI helpers for the nxb CLI.
+ *
+ * Lightweight: pagination engine, inquirer prompt wrappers, simple text helpers.
+ * No box drawing, no background badges, no heavy tables.
+ */
+
+import chalk from "chalk";
+import {
+  select,
+  input,
+  confirm,
+  number,
+  checkbox,
+  Separator,
+} from "@inquirer/prompts";
+
+// ─── Constants ───────────────────────────────────────────────────────────────
+
+export const PAGE_SIZE = 10;
+
+// ─── Simple helpers ──────────────────────────────────────────────────────────
+
+/**
+ * Print a simple bold header line.
+ *
+ *   renderHeader("Results", { subtitle: "3 items" })
+ *   // → "Results  —  3 items"
+ */
+export function renderHeader(title, { subtitle, color = "cyan" } = {}) {
+  const prefix = chalk.bold[color](`  ${title}`);
+  if (subtitle) {
+    console.log(`\n${prefix}  ${chalk.gray("—")}  ${chalk.dim(subtitle)}\n`);
+  } else {
+    console.log(`\n${prefix}\n`);
+  }
+}
+
+/**
+ * Wraps an array of content lines in a simple bordered box.
+ * Used sparingly (e.g. in the interactive runner's generated command).
+ */
+export function renderBox(title, lines = [], { width = 60 } = {}) {
+  const inner = Math.max(width - 4, 30);
+  const top = chalk.gray(`┌─ ${chalk.bold(title)} ${"─".repeat(Math.max(0, inner - title.length - 2))}┐`);
+  console.log(`\n${top}`);
+  for (const line of lines) {
+    if (line === "") {
+      console.log(chalk.gray(`│ ${" ".repeat(inner)} │`));
+    } else {
+      console.log(`${chalk.gray("│ ")}${String(line).padEnd(inner)}${chalk.gray(" │")}`);
+    }
+  }
+  const bottom = chalk.gray(`└${"─".repeat(inner + 2)}┘\n`);
+  console.log(bottom);
+}
+
+/**
+ * Simple text badge, no background colours.
+ *
+ *   renderBadge("builtin")   → "[builtin]"
+ *   renderBadge("text")      → "[text]"
+ */
+export function renderBadge(text) {
+  return chalk.bold(chalk.gray(`[${text}]`));
+}
+
+/** Short type indicator for a tool. */
+export function typeBadge(tool) {
+  const t = tool?.type || "builtin";
+  const styles = {
+    local: chalk.cyan,
+    builtin: chalk.green,
+    community: chalk.magenta,
+  };
+  const colorFn = styles[t] || chalk.gray;
+  return colorFn(`[${t}]`);
+}
+
+/** Short category indicator. */
+export function categoryBadge(cat) {
+  return chalk.gray(`[${(cat || "other").slice(0, 10)}]`);
+}
+
+// ─── Pagination engine ───────────────────────────────────────────────────────
+
+/**
+ * Pure pagination: slice a list + return navigation metadata.
+ *
+ *   paginate(items, 10, 2) → { items, page, totalPages, total, ... }
+ */
+export function paginate(items, pageSize = PAGE_SIZE, currentPage = 1) {
+  const list = items || [];
+  const total = list.length;
+  const totalPages = Math.max(1, Math.ceil(total / pageSize));
+  const page = Math.max(1, Math.min(currentPage, totalPages));
+  const startIndex = (page - 1) * pageSize;
+  const endIndex = Math.min(startIndex + pageSize, total);
+  return {
+    items: list.slice(startIndex, endIndex),
+    page,
+    totalPages,
+    total,
+    pageSize,
+    startIndex,
+    endIndex,
+    hasPrev: page > 1,
+    hasNext: page < totalPages,
+  };
+}
+
+/**
+ * Interactive paginator: renders via `renderPage`, offers prev/next/done/cancel.
+ * Returns the last page result or null on cancel.
+ */
+export async function paginateInteractive(items, pageSize, renderPage, options = {}) {
+  const all = items || [];
+  if (all.length === 0) {
+    renderPage(paginate([], pageSize, 1));
+    return null;
+  }
+
+  let page = 1;
+  let result = paginate(all, pageSize, page);
+
+  while (true) {
+    renderPage(result);
+
+    if (result.totalPages <= 1) return result;
+
+    const nav = [];
+    if (result.hasPrev) nav.push({ name: "◀ Prev", value: "prev" });
+    nav.push({ name: "→ Done", value: "done" });
+    if (result.hasNext) nav.push({ name: "Next ▶", value: "next" });
+    nav.push({ name: "✕ Cancel", value: "cancel" });
+
+    const action = await select({
+      message: chalk.gray(`Page ${result.page}/${result.totalPages} · ${result.total} items`),
+      choices: [new Separator(), ...nav],
+      pageSize: 8,
+    });
+
+    if (action === "cancel") return null;
+    if (action === "done") return result;
+    if (action === "prev") page = Math.max(1, page - 1);
+    if (action === "next") page = Math.min(result.totalPages, page + 1);
+    result = paginate(all, pageSize, page);
+  }
+}
+
+// ─── Prompt wrappers ─────────────────────────────────────────────────────────
+
+export async function promptSelect(message, choices, opts = {}) {
+  return select({ message: chalk.cyan(message), choices, pageSize: opts.pageSize || 10, ...opts });
+}
+
+export async function promptInput(message, { defaultValue, validate, ...opts } = {}) {
+  return input({ message: chalk.cyan(message), default: defaultValue, ...(validate ? { validate } : {}), ...opts });
+}
+
+export async function promptConfirm(message, { default: def = true } = {}) {
+  return confirm({ message: chalk.cyan(message), default: def });
+}
+
+export async function promptNumber(message, { min, max, ...opts } = {}) {
+  return number({ message: chalk.cyan(message), ...(min != null ? { min } : {}), ...(max != null ? { max } : {}), ...opts });
+}
+
+export async function promptCheckbox(message, choices, opts = {}) {
+  return checkbox({ message: chalk.cyan(message), choices, pageSize: opts.pageSize || 10, ...opts });
+}
+
+export function sep(label = "") {
+  return new Separator(label ? ` — ${label} — ` : "");
+}