@lewishowles/cli-style 0.9.0 → 0.11.0

package/CHANGELOG.md

@@ -2,6 +2,25 @@
 
 ## Unreleased
 
+## 0.11.0 - 2026-07-24
+
+### Added
+
+- Added a spinner/loading indicator for long-running JavaScript tasks: `ui.spinner.run(text, fn)` wraps a single async call, and `ui.spinner(text)` returns a handle (`update`, `succeed`, `fail`, `stop`) for cases that don't fit one call. Output always goes to stderr, animates only on an interactive terminal, and falls back to a static start/result line under CI, plain, JSON, or agent profiles. JavaScript-only; not available through the Bash, Python, or Swift adapters.
+
+## 0.10.0 - 2026-07-20
+
+### Added
+
+- Added light and dark ANSI-256 colour palettes with automatic theme detection (explicit flag/option, `COLORFGBG`, then a `COLORTERM`/`TERM_PROGRAM` best-effort signal, falling back to dark).
+- Added `cli-style list` and `cli-style describe` for static renderer catalogue discovery.
+- Added a `sparkline()` renderer (`sparkline` for `cli-style render`) for compact trend display with latest, minimum, and maximum values.
+- Added a `diffBlock()` renderer (`diff-block` for `cli-style render`) for structured added/removed/context/header diff presentation.
+
+### Fixed
+
+- Fixed panel body text losing legibility against its background fill in some theme/terminal combinations by giving panels their own explicit theme-matched text colour instead of relying on the terminal-inherited default.
+
 ## 0.9.0 - 2026-07-16
 
 ### Added

package/README.md

@@ -241,10 +241,12 @@ Renderer names are stable for `cli-style render`, `cli_style_render`, and Python
 | `table`               | `table(options)`                      | Use `cli_style_render`               | Use `render("table", ...)`         | Use `CliStyle.render`                  | Tabular records with narrow-width fallback.                     |
 | `progress-bar`        | `progressBar(options)`                | Use `cli_style_render`               | Use `render("progress-bar", ...)`  | Use `CliStyle.render`                  | Single progress value with numeric text.                        |
 | `bar-chart`           | `barChart(options)`                   | Use `cli_style_render`               | Use `render("bar-chart", ...)`     | Use `CliStyle.render`                  | Multi-row bar chart.                                            |
+| `sparkline`           | `sparkline(options)`                  | Use `cli_style_render`               | Use `render("sparkline", ...)`     | Use `CliStyle.render`                  | Compact trend with latest, minimum, and maximum values.         |
 | `step`                | `step(label, state, options)`         | Use `cli_style_render`               | Use `render("step", ...)`          | Use `CliStyle.render`                  | One workflow step.                                              |
 | `step-progress`       | `stepProgress(options)`               | Use `cli_style_render`               | Use `render("step-progress", ...)` | Use `CliStyle.render`                  | Numbered workflow steps.                                        |
 | `empty-state`         | `emptyState(title, detail, options)`  | Use `cli_style_render`               | Use `render("empty-state", ...)`   | Use `CliStyle.render`                  | Empty result message.                                           |
 | `error-block`         | `errorBlock(title, lines, options)`   | Use `cli_style_render`               | Use `render("error-block", ...)`   | Use `CliStyle.render`                  | Structured error block.                                         |
+| `diff-block`          | `diffBlock(diff, options)`            | Use `cli_style_render`               | Use `render("diff-block", ...)`    | Use `CliStyle.render`                  | Structured added, removed, context, and header lines.           |
 
 Use `render("<renderer>", data, ...)` (Python) or `CliStyle.render(_:data:options:)` (Swift) for aggregate patterns (`diagnostic-report`, `agent-transcript`, `compact-data-table`) or any renderer with multi-item fields.
 
@@ -337,6 +339,7 @@ Pre-render a `span` when only part of the hint needs emphasis.
 | `table`         | `columns`, `rows`, `width`             |
 | `progress-bar`  | `value`, `max`, `barWidth`, `tone`     |
 | `bar-chart`     | `rows`, `barWidth`                     |
+| `sparkline`     | `values`, `label`, `tone`, `width`     |
 | `step`          | `label`, `state`                       |
 | `step-progress` | `steps`, `current`                     |
 | `empty-state`   | `title`, `detail`                      |
@@ -344,6 +347,35 @@ Pre-render a `span` when only part of the hint needs emphasis.
 
 For visual examples, run `cli-style gallery --section primitives`.
 
+### `sparkline`
+
+Pass finite numbers in time order. The rendered trend always includes `latest`, `min`, and `max` context. Set `width` to limit plotted samples, `tone` to choose an optional semantic colour, `colour: false` to disable ANSI output, or `unicode: false` for an ASCII-only ramp.
+
+```js
+sparkline({ label: "Deploys", values: [1, 2, 3, 5, 8] });
+// Deploys: ▁▂▃▅█ latest=8 min=1 max=8
+
+sparkline({ label: "Rollback rate", values: [8, 6, 4, 2], tone: "warning" });
+// Rollback rate: █▆▃▁ latest=2 min=2 max=8
+
+sparkline({ label: "Flat", values: [4, 4, 4, 4] });
+// Flat: ▄▄▄▄ latest=4 min=4 max=4
+
+sparkline({ label: "Negative", values: [-6, -4, -2], colour: false });
+// Negative: ▁▅█ latest=-2 min=-6 max=-2
+
+sparkline({ label: "Narrow", values: [0, 10, -5, 5, 2, 8], width: 4 });
+// Narrow: ▃█▁▇ latest=8 min=-5 max=10
+
+sparkline({ label: "No colour", values: [1, 3, 2], colour: false });
+// No colour: ▁█▅ latest=2 min=1 max=3
+
+sparkline({ label: "No Unicode", values: [1, 3, 2], unicode: false });
+// No Unicode: .#= latest=2 min=1 max=3
+```
+
+Empty or unusable `values` return `""`.
+
 ## Patterns
 
 Patterns are built-in composite renderers for common report shapes. They use the same lower-level primitives internally, but accept structured objects so callers do not need to assemble panels, statuses, tables, and rows by hand.
@@ -358,6 +390,33 @@ Patterns are built-in composite renderers for common report shapes. They use the
 | `confirmation-result` | `confirmationResult(confirmation, options)` | Confirmation outcome with detail.     | `title`, `state`, `action`, `item`, `detail`                                         |
 | `next-step-block`     | `nextStepBlock(nextStep, options)`          | Next-step guidance.                   | `title`, `next`, `reason`, `commands`, `alternatives`                                |
 | `compact-data-table`  | `compactDataTable(data, options)`           | Titled compact data table.            | `title`, `summary`, `columns`, `rows`                                                |
+| `diff-block`          | `diffBlock(diff, options)`                  | Structured diff presentation.         | `title`, `path`, `lines`                                                             |
+
+### `diff-block`
+
+Pass structured lines with one of four types. The renderer adds stable textual prefixes, so colour is optional and never carries meaning alone.
+
+```json
+{
+	"title": "Renderer change",
+	"path": "src/render.js",
+	"lines": [
+		{ "type": "header", "text": "render()" },
+		{ "type": "added", "newLineNumber": 102, "text": "return nextStep;" },
+		{ "type": "removed", "oldLineNumber": 101, "text": "return currentStep;" },
+		{
+			"type": "context",
+			"oldLineNumber": 100,
+			"newLineNumber": 100,
+			"text": "const currentStep = getStep();"
+		}
+	]
+}
+```
+
+`oldLineNumber` and `newLineNumber` are optional caller-supplied fields. Added lines use the new number, removed lines use the old number, and context lines use both. Numbered blocks show a stable gutter and computed `(+added -removed)` summary. Missing numbers fall back to the unnumbered output.
+
+`diff-block` presents structured data only. It does not parse unified-diff strings, calculate patches or line numbers, or apply changes. Invalid line entries are ignored safely.
 
 For visual examples, run `cli-style gallery --section patterns`.
 
@@ -523,6 +582,31 @@ const reporter = createReporter({
 });
 ```
 
+## Spinner
+
+Use a spinner when a JavaScript script runs a long task and needs progress feedback. Spinner output always goes to stderr, so piped or JSON stdout stays clean. On a non-interactive target (CI, plain, JSON, agent profiles, or non-TTY stdout) it prints a static start line and result line instead of animating.
+
+```js
+import { createCliStyle } from "@lewishowles/cli-style";
+
+const ui = createCliStyle();
+
+await ui.spinner.run("Building", async () => {
+	await runBuild();
+});
+```
+
+For cases that don't fit one awaited call, use the manual handle:
+
+```js
+const spinner = ui.spinner("Building");
+
+spinner.update("Building (2/3)");
+spinner.succeed("Build complete");
+```
+
+Only one spinner can be active at a time; starting a second while one is running throws.
+
 ## Options and flags
 
 ### JavaScript options
@@ -533,16 +617,18 @@ Most renderers accept the same output options:
 | --------- | ------------------------------------------------------------------------- |
 | `profile` | Output profile: `human`, `agent`, `diagnostic`, `ci`, `plain`, or `json`. |
 | `colour`  | Whether ANSI colour should be applied.                                    |
+| `theme`   | `auto`, `light`, or `dark` semantic colour palette.                       |
 | `unicode` | Whether Unicode symbols should be used.                                   |
 | `width`   | Available output width for renderers that adapt layout.                   |
 
-Use `createCliStyle()` to resolve these options from `argv`, `env`, `stdout`, CI, TTY, `NO_COLOR`, `FORCE_COLOR`, and terminal capability.
+Use `createCliStyle()` to resolve these options from `argv`, `env`, `stdout`, CI, TTY, `NO_COLOR`, `FORCE_COLOR`, and terminal capability. `theme: "auto"` resolves in this order: explicit `--light`/`--dark` flags or `theme: "light"`/`"dark"`, recognised `COLORFGBG` background slot, `COLORTERM` or `TERM_PROGRAM`, then a dark fallback. The additional environment signals are best-effort terminal identifiers, so they select the conservative dark palette rather than claiming a light or dark preference. `NO_COLOR`, `TERM=dumb`, `--plain`, and explicit no-colour flags still disable colour.
 
 ### CLI and Bash flags
 
 | Flag                         | Purpose                                |
 | ---------------------------- | -------------------------------------- |
 | `--profile <name>`           | Render with a named profile.           |
+| `--light` / `--dark`         | Override automatic terminal theme.     |
 | `--plain`                    | Disable colour and Unicode decoration. |
 | `--no-colour` / `--no-color` | Disable ANSI colour.                   |
 | `--no-unicode`               | Use ASCII symbols.                     |
@@ -606,6 +692,19 @@ Tone values used by public APIs include `info`, `success`, `warning`, `danger`,
 
 ## Gallery
 
+## Renderer discovery
+
+List the available renderers or inspect one renderer before constructing a JSON payload:
+
+```bash
+cli-style list
+cli-style list --json
+cli-style describe progress-bar
+cli-style describe progress-bar --json
+```
+
+`describe` includes the JavaScript API name, main input fields, and a focused gallery command when one is available.
+
 Use the gallery to review current renderer output:
 
 ```bash
@@ -617,6 +716,8 @@ cli-style gallery --fixture audit-finding
 cli-style gallery --profile agent
 cli-style gallery --width 64
 cli-style gallery --variants
+cli-style gallery --light --section primitives
+cli-style gallery --dark --section primitives
 ```
 
 Use `--interactive` to select a section or fixture with `fzf` when it is installed.

package/bin/cli-style.js

@@ -3,6 +3,7 @@
 import { Buffer } from "node:buffer";
 import { createCliStyle, renderGallery, renderHelp } from "../src/index.js";
 import { parseAdapterPathRequest, renderAdapterPath } from "../src/cli/adapter-path-command.js";
+import { parseCatalogueRequest, renderCatalogue } from "../src/cli/catalogue-command.js";
 import { parseRenderRequest, renderJsonInput } from "../src/cli/render-command.js";
 
 import {
@@ -54,6 +55,15 @@ if (command === undefined || command === "--help" || command === "-h") {
 		console.error(error.message);
 		process.exitCode = 1;
 	}
+} else if (command === "list" || command === "describe") {
+	try {
+		const request = parseCatalogueRequest(command, args.slice(1));
+
+		print(renderCatalogue(request, ui.options));
+	} catch (error) {
+		console.error(error.message);
+		process.exitCode = 1;
+	}
 } else if (command === "render") {
 	try {
 		const request = parseRenderRequest(args.slice(1));

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@lewishowles/cli-style",
-	"version": "0.9.0",
+	"version": "0.11.0",
 	"description": "Shared terminal output styles for Lewis Howles tools, diagnostics, and package CLIs.",
 	"license": "MIT",
 	"repository": {

package/src/capability/terminal.js

@@ -1,6 +1,11 @@
+import { isTheme, themes } from "../theme/colours.js";
+
 // Default terminal width when no stream width is available.
 const defaultWidth = 80;
 
+// Known terminal signals support a conservative dark palette when no theme is explicit.
+const terminalThemeSignals = ["COLORTERM", "TERM_PROGRAM"];
+
 /**
  * Resolve terminal output capabilities from injected args, env, and stream data.
  *
@@ -47,11 +52,104 @@ export function resolveTerminalCapabilities(options = {}) {
 		isCi,
 		isDumb,
 		isTty,
+		theme: resolveTheme({
+			argv,
+			env,
+			theme: options.theme,
+		}),
 		unicode,
 		width,
 	};
 }
 
+/**
+ * Resolve a terminal theme from explicit overrides and terminal signals.
+ *
+ * @param  {object}  options
+ *     Theme resolution inputs.
+ * @returns  {string}
+ *     Resolved light or dark theme.
+ */
+export function resolveTheme(options = {}) {
+	const flagTheme = readThemeFlag(options.argv ?? []);
+
+	if (flagTheme !== undefined) {
+		return flagTheme;
+	}
+
+	if (isTheme(options.theme) && options.theme !== themes.AUTO) {
+		return options.theme;
+	}
+
+	const colourFgBgTheme = resolveColourFgBgTheme(options.env?.COLORFGBG);
+
+	if (colourFgBgTheme !== themes.AUTO) {
+		return colourFgBgTheme;
+	}
+
+	return resolveTerminalSignalTheme(options.env) ?? themes.DARK;
+}
+
+/**
+ * Resolve a conservative theme from best-effort terminal signals.
+ *
+ * @param  {object}  env
+ *     Environment values to inspect.
+ * @returns  {string|undefined}
+ *     Dark theme when a known terminal signal is present.
+ */
+function resolveTerminalSignalTheme(env = {}) {
+	if (terminalThemeSignals.some((signal) => env[signal])) {
+		return themes.DARK;
+	}
+
+	return undefined;
+}
+
+/**
+ * Resolve known COLORFGBG background slots without guessing custom palettes.
+ *
+ * @param  {string}  colourFgBg
+ *     Terminal foreground and background capability string.
+ * @returns  {string}
+ *     Resolved light, dark, or automatic theme.
+ */
+function resolveColourFgBgTheme(colourFgBg) {
+	const background = colourFgBg?.split(";").at(-1);
+
+	if (background === "0" || background === "8") {
+		return themes.DARK;
+	}
+
+	if (background === "7" || background === "15") {
+		return themes.LIGHT;
+	}
+
+	return themes.AUTO;
+}
+
+/**
+ * Read the final explicit theme flag so later command arguments can override earlier ones.
+ *
+ * @param  {string[]}  argv
+ *     CLI arguments to inspect.
+ * @returns  {string|undefined}
+ *     Explicit theme when present.
+ */
+function readThemeFlag(argv) {
+	let theme;
+
+	for (const argument of argv) {
+		if (argument === "--dark") {
+			theme = themes.DARK;
+		} else if (argument === "--light") {
+			theme = themes.LIGHT;
+		}
+	}
+
+	return theme;
+}
+
 /**
  * Resolve colour support from explicit flags and terminal state.
  *

package/src/catalogue/renderer-catalogue.js

@@ -0,0 +1,62 @@
+// Static renderer metadata shared by CLI discovery and render validation.
+export const rendererCatalogue = [
+	["agent-transcript", "pattern", "agentTranscript", ["entries"], "agent-transcript"],
+	["audit-finding", "pattern", "auditFinding", ["finding", "result"], "audit-finding"],
+	["bar-chart", "primitive", "barChart", ["rows"], undefined],
+	["chip", "primitive", "chip", ["label", "tone"], undefined],
+	["command-result", "pattern", "commandResult", ["result", "summary"], "command-result"],
+	["compact-data-table", "pattern", "compactDataTable", ["columns", "rows"], "compact-data-table"],
+	[
+		"confirmation-result",
+		"pattern",
+		"confirmationResult",
+		["action", "state"],
+		"confirmation-result",
+	],
+	[
+		"diagnostic-report",
+		"pattern",
+		"diagnosticReport",
+		["findings", "summary"],
+		"diagnostic-report",
+	],
+	["diff-block", "pattern", "diffBlock", ["lines"], "diff-block"],
+	["divider", "primitive", "divider", ["label"], undefined],
+	["empty-state", "primitive", "emptyState", ["detail", "title"], undefined],
+	["error-block", "primitive", "errorBlock", ["lines", "title"], undefined],
+	["hint", "primitive", "hint", ["message"], undefined],
+	["next-step-block", "pattern", "nextStepBlock", ["next", "reason"], "next-step-block"],
+	["panel", "primitive", "panel", ["lines", "title", "tone"], undefined],
+	["progress-bar", "primitive", "progressBar", ["max", "value"], undefined],
+	["row", "primitive", "row", ["label", "value"], undefined],
+	["row-group", "primitive", "rowGroup", ["rows"], undefined],
+	["sparkline", "primitive", "sparkline", ["values"], "sparkline"],
+	["span", "primitive", "span", ["tone", "value"], undefined],
+	["status", "primitive", "status", ["detail", "type"], undefined],
+	["step", "primitive", "step", ["label", "state"], undefined],
+	["step-progress", "primitive", "stepProgress", ["current", "steps"], undefined],
+	["table", "primitive", "table", ["columns", "rows"], undefined],
+	["task-summary", "pattern", "taskSummary", ["result", "task"], "task-summary"],
+].map(([name, category, api, fields, fixture]) => ({
+	api,
+	category,
+	fields,
+	fixture,
+	name,
+	purpose: `${api} renderer.`,
+}));
+
+// Stable CLI names derived from the catalogue.
+export const rendererNames = rendererCatalogue.map((renderer) => renderer.name);
+
+/**
+ * Find renderer metadata by its stable CLI name.
+ *
+ * @param  {string}  name
+ *     Renderer name to look up.
+ * @returns  {object|undefined}
+ *     Renderer metadata when found.
+ */
+export function getRendererMetadata(name) {
+	return rendererCatalogue.find((renderer) => renderer.name === name);
+}

package/src/cli/catalogue-command.js

@@ -0,0 +1,108 @@
+import { getRendererMetadata, rendererCatalogue } from "../catalogue/renderer-catalogue.js";
+
+// Rendering flags are resolved before catalogue command parsing.
+const globalRenderingFlags = new Set([
+	"--dark",
+	"--json",
+	"--light",
+	"--no-color",
+	"--no-colour",
+	"--no-unicode",
+	"--plain",
+]);
+
+/**
+ * Parse a catalogue discovery request.
+ *
+ * @param  {string}  command
+ *     Catalogue command name.
+ * @param  {string[]}  args
+ *     Arguments after the command.
+ * @returns  {object}
+ *     Parsed catalogue request.
+ */
+export function parseCatalogueRequest(command, args = []) {
+	const commandArgs = args.filter((argument) => !globalRenderingFlags.has(argument));
+
+	if (command === "list" && commandArgs.length === 0) {
+		return {
+			command,
+		};
+	}
+
+	if (
+		command === "describe" &&
+		commandArgs.length === 1 &&
+		getRendererMetadata(commandArgs[0]) !== undefined
+	) {
+		return {
+			command,
+			renderer: commandArgs[0],
+		};
+	}
+
+	if (command === "describe" && commandArgs.length === 1) {
+		throw new Error(`Unknown renderer: ${commandArgs[0]}`);
+	}
+
+	throw new Error(
+		command === "describe" ? "Usage: cli-style describe <renderer>" : "Usage: cli-style list",
+	);
+}
+
+/**
+ * Render catalogue data for the requested output profile.
+ *
+ * @param  {object}  request
+ *     Parsed catalogue request.
+ * @param  {object}  options
+ *     Resolved rendering options.
+ * @returns  {string}
+ *     Text or JSON catalogue output.
+ */
+export function renderCatalogue(request, options = {}) {
+	const data =
+		request.command === "list" ? rendererCatalogue : getRendererMetadata(request.renderer);
+
+	if (options.profile === "json") {
+		return JSON.stringify(data, null, 2);
+	}
+
+	if (request.command === "describe") {
+		return renderDescription(data);
+	}
+
+	return ["primitive", "pattern"]
+		.flatMap((category) => [
+			category,
+			...rendererCatalogue
+				.filter((renderer) => renderer.category === category)
+				.map((renderer) => `  ${renderer.name}  ${renderer.api}`),
+			"",
+		])
+		.slice(0, -1)
+		.join("\n");
+}
+
+/**
+ * Render one renderer's discovery details.
+ *
+ * @param  {object}  renderer
+ *     Renderer metadata.
+ * @returns  {string}
+ *     Human-readable renderer description.
+ */
+function renderDescription(renderer) {
+	const gallery =
+		renderer.fixture === undefined
+			? "No focused fixture."
+			: `cli-style gallery --fixture ${renderer.fixture}`;
+
+	return [
+		renderer.name,
+		`Category: ${renderer.category}`,
+		`JavaScript: ${renderer.api}`,
+		`Fields: ${renderer.fields.join(", ")}`,
+		`Gallery: ${gallery}`,
+	].join("\n");
+}

package/src/cli/gallery-command.js

@@ -4,7 +4,14 @@ import { galleryFixtures, gallerySections, galleryVariants } from "../gallery/re
 import { isProfile, profiles } from "../profiles/profiles.js";
 
 // Global rendering flags accepted after `gallery` for focused review commands.
-const globalRenderingFlags = new Set(["--no-color", "--no-colour", "--no-unicode", "--plain"]);
+const globalRenderingFlags = new Set([
+	"--dark",
+	"--light",
+	"--no-color",
+	"--no-colour",
+	"--no-unicode",
+	"--plain",
+]);
 
 /**
  * Parse gallery command arguments.

package/src/cli/help.js

@@ -5,18 +5,23 @@ const helpLines = [
 	"Usage:",
 	"  cli-style --help",
 	"  cli-style adapter-path bash|python",
+	"  cli-style list [options]",
+	"  cli-style describe <renderer> [options]",
 	"  cli-style gallery [variant] [options]",
 	"  cli-style render <renderer> [options] < input.json",
 	"",
 	"Commands:",
 	"  adapter-path    Print a Bash or Python adapter path.",
 	"  gallery    Print the read-only style gallery.",
+	"  list       List available primitives and patterns.",
+	"  describe   Describe one renderer and its input fields.",
 	"  render     Render caller-provided JSON from stdin.",
 	"",
 	"Gallery variants:",
 	"  current, no-colour, no-unicode, plain",
 	"",
 	"Options:",
+	"  --light, --dark     Override automatic terminal-theme detection.",
 	"  --section <name>    Show primitives or patterns.",
 	"  --fixture <name>    Show one named pattern fixture.",
 	"  --profile <name>    Render with a text profile.",

package/src/cli/render-command.js

@@ -4,6 +4,7 @@ import { commandResult } from "../patterns/command-result.js";
 import { compactDataTable } from "../patterns/compact-data-table.js";
 import { confirmationResult } from "../patterns/confirmation-result.js";
 import { diagnosticReport } from "../patterns/diagnostic-report.js";
+import { diffBlock } from "../patterns/diff-block.js";
 import { nextStepBlock } from "../patterns/next-step-block.js";
 import { taskSummary } from "../patterns/task-summary.js";
 import { barChart } from "../primitives/bar-chart.js";
@@ -14,11 +15,13 @@ import { panel } from "../primitives/panel.js";
 import { progressBar } from "../primitives/progress-bar.js";
 import { row } from "../primitives/row.js";
 import { rowGroup } from "../primitives/row-group.js";
+import { sparkline } from "../primitives/sparkline.js";
 import { span } from "../primitives/span.js";
 import { status } from "../primitives/status.js";
 import { step, stepProgress } from "../primitives/step-progress.js";
 import { table } from "../primitives/table.js";
 import { isProfile, profiles } from "../profiles/profiles.js";
+export { rendererNames } from "../catalogue/renderer-catalogue.js";
 
 // Renderer names accepted by the custom-input render command.
 const renderers = {
@@ -38,6 +41,7 @@ const renderers = {
 	"compact-data-table": (input, options) => compactDataTable(input, options),
 	"confirmation-result": (input, options) => confirmationResult(input, options),
 	"diagnostic-report": (input, options) => diagnosticReport(input, options),
+	"diff-block": (input, options) => diffBlock(input, options),
 	divider: (input, options) =>
 		divider({
 			...input,
@@ -79,6 +83,11 @@ const renderers = {
 			...input,
 			...options,
 		}),
+	sparkline: (input, options) =>
+		sparkline({
+			...input,
+			...options,
+		}),
 	span: (input, options) =>
 		span(input.value, input.tone, {
 			...input,
@@ -108,10 +117,16 @@ const renderers = {
 };
 
 // Global rendering flags accepted after `render <renderer>`.
-const globalRenderingFlags = new Set(["--no-color", "--no-colour", "--no-unicode", "--plain"]);
+const globalRenderingFlags = new Set([
+	"--dark",
+	"--light",
+	"--no-color",
+	"--no-colour",
+	"--no-unicode",
+	"--plain",
+]);
 
 // Renderer names exposed for help text and tests.
-export const rendererNames = Object.keys(renderers);
 
 /**
  * Parse render command arguments.

package/src/create-cli-style.js

@@ -1,5 +1,6 @@
 import { resolveProfile } from "./capability/resolve-profile.js";
 import { resolveTerminalCapabilities } from "./capability/terminal.js";
+import { runSpinner, spinner as startSpinner } from "./interactive/spinner.js";
 import { profiles } from "./profiles/profiles.js";
 import { createReporter } from "./reporters/create-reporter.js";
 
@@ -23,6 +24,18 @@ export function createCliStyle(options = {}) {
 	applyExplicitOption(resolvedOptions, options, "unicode");
 	applyExplicitOption(resolvedOptions, options, "width");
 
+	const spinner = (text, spinnerOptions = {}) =>
+		startSpinner(text, {
+			...resolvedOptions,
+			...spinnerOptions,
+		});
+
+	spinner.run = (text, fn, spinnerOptions = {}) =>
+		runSpinner(text, fn, {
+			...resolvedOptions,
+			...spinnerOptions,
+		});
+
 	return {
 		options: resolvedOptions,
 		print: (value) => {
@@ -33,6 +46,7 @@ export function createCliStyle(options = {}) {
 				...resolvedOptions,
 				...reporterOptions,
 			}),
+		spinner,
 		write: (value) => {
 			process.stdout.write(value);
 		},