claudeup 1.8.0 → 3.3.0

package/src/data/statuslines.ts

@@ -0,0 +1,188 @@
+import type { StatusLineConfig } from "../types/index.js";
+
+export interface StatusLineCategory {
+	name: string;
+	color: string;
+	presets: StatusLineConfig[];
+}
+
+export const statusLineCategories: StatusLineCategory[] = [
+	{
+		name: "🎨 Color Themes",
+		color: "magenta",
+		presets: [
+			{
+				name: "🌸 Catppuccin",
+				description: "Soothing pastel (most popular 2024)",
+				template:
+					"* {model} | {git_branch} | {input_tokens}v {output_tokens}^ | ${cost} | {cwd}",
+			},
+			{
+				name: "🧛 Dracula",
+				description: "Classic dark with purple vibes",
+				template:
+					"{model} > {git_branch} > {input_tokens}v {output_tokens}^ > ${cost} > {cwd}",
+			},
+			{
+				name: "❄️ Nord",
+				description: "Arctic, bluish & clean",
+				template:
+					"~ {model} | {git_branch} | {input_tokens}< {output_tokens}> | ${cost} | {cwd}",
+			},
+			{
+				name: "🍂 Gruvbox",
+				description: "Warm retro terminal feel",
+				template:
+					">> {model} :: {git_branch} :: {input_tokens}v {output_tokens}^ :: ${cost} :: {cwd}",
+			},
+			{
+				name: "🌃 Tokyo Night",
+				description: "Neon city vibes",
+				template:
+					"> {model} | {git_branch} | {input_tokens}v {output_tokens}^ | ${cost} | {cwd}",
+			},
+			{
+				name: "🌹 Rose Pine",
+				description: "Soft, romantic & elegant",
+				template:
+					"@ {model} : {git_branch} : {input_tokens}v {output_tokens}^ : ${cost} : {cwd}",
+			},
+		],
+	},
+	{
+		name: "🚀 Shell Prompts",
+		color: "cyan",
+		presets: [
+			{
+				name: "⭐ Starship",
+				description: "Blazing fast, minimal & smart",
+				template:
+					"-> {model} | {git_branch} | {input_tokens}v {output_tokens}^ | ${cost} | {cwd}",
+			},
+			{
+				name: "⚡ Powerline",
+				description: "Classic powerline segments",
+				template:
+					"{model} > {git_branch} > {input_tokens}v {output_tokens}^ > ${cost} > {cwd}",
+			},
+		],
+	},
+	{
+		name: "💻 Developer",
+		color: "green",
+		presets: [
+			{
+				name: "🖥️ Hacker",
+				description: "Matrix-inspired with all metrics",
+				template:
+					"[{model}] [{git_branch}] [v{input_tokens} ^{output_tokens}] [${cost}] [{cwd}]",
+			},
+			{
+				name: "🔧 DevOps",
+				description: "Infrastructure-focused",
+				template:
+					"# {model} | {git_branch} | {input_tokens}/{output_tokens} | ${cost} | {cwd}",
+			},
+			{
+				name: "📊 Metrics",
+				description: "Data-focused with stats",
+				template:
+					"* {model} | {session_duration} | v{input_tokens} ^{output_tokens} | ${cost}",
+			},
+			{
+				name: "🌿 Git First",
+				description: "Branch name prominent",
+				template: "[{git_branch}] {model} | ${cost} | {cwd}",
+			},
+		],
+	},
+	{
+		name: "✨ Minimal",
+		color: "white",
+		presets: [
+			{
+				name: "🧘 Zen",
+				description: "Minimalist & distraction-free",
+				template: "{model_short} - ${cost}",
+			},
+			{
+				name: "💎 Clean",
+				description: "Simple & elegant",
+				template: "{model} -- ${cost} -- {cwd}",
+			},
+			{
+				name: "➡️ Arrow",
+				description: "Compact with direction",
+				template: "> {model} > ${cost} > {git_branch}",
+			},
+		],
+	},
+	{
+		name: "🎮 Fun",
+		color: "yellow",
+		presets: [
+			{
+				name: "👾 Retro",
+				description: "8-bit gaming aesthetic",
+				template:
+					"[ {model} ] * {git_branch} * v{input_tokens} ^{output_tokens} * ${cost}",
+			},
+			{
+				name: "📦 Brackets",
+				description: "Everything in brackets",
+				template:
+					"[{model}] [{git_branch}] [in:{input_tokens}] [out:{output_tokens}] [${cost}] [{cwd}]",
+			},
+			{
+				name: "🔀 Pipes",
+				description: "Unix pipe style",
+				template:
+					"{model} | {git_branch} | in:{input_tokens} out:{output_tokens} | ${cost} | {cwd}",
+			},
+		],
+	},
+	{
+		name: "📱 Compact",
+		color: "blue",
+		presets: [
+			{
+				name: "🔬 Micro",
+				description: "Ultra-compact essentials",
+				template: "{model_short} ${cost}",
+			},
+			{
+				name: "〉Chevron",
+				description: "Chevron separators",
+				template: "{model_short} > ${cost} > {git_branch}",
+			},
+		],
+	},
+	{
+		name: "⏱️ Time",
+		color: "red",
+		presets: [
+			{
+				name: "⏰ Timer",
+				description: "Session time focused",
+				template:
+					"[{session_duration}] {model} | v{input_tokens} ^{output_tokens} | ${cost}",
+			},
+			{
+				name: "📅 Session",
+				description: "Full session overview",
+				template:
+					"{model} | {session_duration} | {input_tokens}/{output_tokens} | ${cost} | {cwd}",
+			},
+		],
+	},
+];
+
+// Flatten for backward compatibility
+export const statusLinePresets: StatusLineConfig[] =
+	statusLineCategories.flatMap((cat) => cat.presets);
+
+export function getStatusLineByName(
+	name: string,
+): StatusLineConfig | undefined {
+	return statusLinePresets.find((s) => s.name === name);
+}

package/src/index.js

@@ -0,0 +1,4 @@
+#!/usr/bin/env bun
+// Re-export main entry point
+export { App, VERSION } from "./ui/App.js";
+export { default } from "./ui/App.js";

package/src/index.ts

@@ -0,0 +1,5 @@
+#!/usr/bin/env bun
+
+// Re-export main entry point
+export { App, VERSION } from "./ui/App.js";
+export { default } from "./ui/App.js";

package/{dist → src}/main.js

@@ -1,61 +1,66 @@
-#!/usr/bin/env node
-import { jsx as _jsx } from "react/jsx-runtime";
-import { render } from 'ink';
-import { spawn } from 'node:child_process';
-import { App, VERSION } from './ui/InkApp.js';
-import { prerunClaude } from './prerunner/index.js';
-import { checkForUpdates } from './services/version-check.js';
-// ANSI escape codes for terminal control
-const ENTER_ALT_SCREEN = '\x1b[?1049h';
-const EXIT_ALT_SCREEN = '\x1b[?1049l';
-const HIDE_CURSOR = '\x1b[?25l';
-const SHOW_CURSOR = '\x1b[?25h';
-const CLEAR_SCREEN = '\x1b[2J\x1b[H';
+#!/usr/bin/env bun
+import { jsx as _jsx } from "@opentui/react/jsx-runtime";
+import { createCliRenderer } from "@opentui/core";
+import { createRoot } from "@opentui/react";
+import { spawn } from "node:child_process";
+import { App } from "./ui/App.js";
+import { prerunClaude } from "./prerunner/index.js";
+import { checkForUpdates } from "./services/version-check.js";
+export const VERSION = "3.0.0";
+// Note: OpenTUI renderer handles alternate screen buffer automatically
+// No need for manual ANSI escape codes
 async function main() {
     const args = process.argv.slice(2);
     // Handle "claudeup claude [args]" - prerunner mode
-    if (args[0] === 'claude') {
+    if (args[0] === "claude") {
         const claudeArgs = args.slice(1);
-        const exitCode = await prerunClaude(claudeArgs);
+        // Parse prerunner-specific flags
+        const forceUpdate = claudeArgs.includes("--force") || claudeArgs.includes("-f");
+        // Remove prerunner flags before passing to claude
+        const filteredArgs = claudeArgs.filter((arg) => arg !== "--force" && arg !== "-f");
+        const exitCode = await prerunClaude(filteredArgs, { force: forceUpdate });
         process.exit(exitCode);
         return;
     }
     // Handle "claudeup update" - self-update command
-    if (args[0] === 'update') {
+    if (args[0] === "update") {
         // Detect how claudeup was installed by checking the executable path
-        const { execSync } = await import('node:child_process');
+        const { execSync } = await import("node:child_process");
         let usesBun = false;
         try {
-            const claudeupPath = execSync('which claudeup', { encoding: 'utf-8' }).trim();
-            usesBun = claudeupPath.includes('.bun') || claudeupPath.includes('bun/bin');
+            const claudeupPath = execSync("which claudeup", {
+                encoding: "utf-8",
+            }).trim();
+            usesBun =
+                claudeupPath.includes(".bun") || claudeupPath.includes("bun/bin");
         }
         catch {
             // If which fails, default to npm
         }
-        const pkgManager = usesBun ? 'bun' : 'npm';
+        const pkgManager = usesBun ? "bun" : "npm";
         console.log(`Updating claudeup using ${pkgManager}...`);
         const installArgs = usesBun
-            ? ['install', '-g', 'claudeup@latest']
-            : ['install', '-g', 'claudeup@latest'];
+            ? ["install", "-g", "claudeup@latest"]
+            : ["install", "-g", "claudeup@latest"];
         const proc = spawn(pkgManager, installArgs, {
-            stdio: 'inherit',
+            stdio: "inherit",
             shell: false, // Avoid shell for security (fixes DEP0190 warning)
         });
-        proc.on('exit', (code) => process.exit(code || 0));
+        proc.on("exit", (code) => process.exit(code || 0));
         return;
     }
     // Handle --version flag - show version and check for updates
-    if (args.includes('--version') || args.includes('-v')) {
+    if (args.includes("--version") || args.includes("-v")) {
         console.log(`claudeup v${VERSION}`);
         const result = await checkForUpdates();
         if (result.updateAvailable) {
             console.log(`\nUpdate available: v${result.latestVersion}`);
-            console.log('Run: claudeup update');
+            console.log("Run: claudeup update");
         }
         process.exit(0);
     }
     // Handle --help flag
-    if (args.includes('--help') || args.includes('-h')) {
+    if (args.includes("--help") || args.includes("-h")) {
         console.log(`claudeup v${VERSION}
 
 TUI tool for managing Claude Code plugins, MCPs, and configuration.
@@ -71,6 +76,7 @@ Options:
 
 Commands:
   claude [args...]   Check for plugin updates (1h cache), then run claude
+    -f, --force      Force update check (bypass 1h cache)
   update             Update claudeup itself to latest version
 
 Navigation:
@@ -90,35 +96,28 @@ Keys:
 `);
         process.exit(0);
     }
-    // Enter alternate screen buffer for clean TUI rendering
-    process.stdout.write(ENTER_ALT_SCREEN + HIDE_CURSOR + CLEAR_SCREEN);
+    // Create OpenTUI renderer (handles alternate screen buffer automatically)
+    const renderer = await createCliRenderer();
+    const root = createRoot(renderer);
     // Cleanup function to restore terminal
     const cleanup = () => {
-        process.stdout.write(SHOW_CURSOR + EXIT_ALT_SCREEN);
+        root.unmount();
+        renderer.destroy(); // CRITICAL: Never use process.exit() directly
     };
-    // Render the Ink app
-    const { waitUntilExit, clear, unmount } = render(_jsx(App, {}), {
-        exitOnCtrlC: false, // We'll handle it ourselves
-    });
     // Handle cleanup on exit signals
     const handleExit = () => {
-        clear();
-        unmount();
         cleanup();
+        // Exit after cleanup completes
         process.exit(0);
     };
-    process.on('SIGINT', handleExit);
-    process.on('SIGTERM', handleExit);
-    // Wait for the app to exit
-    try {
-        await waitUntilExit();
-    }
-    finally {
-        cleanup();
-    }
+    process.on("SIGINT", handleExit);
+    process.on("SIGTERM", handleExit);
+    // Render the OpenTUI app with exit handler
+    root.render(_jsx(App, { onExit: handleExit }));
+    // Wait indefinitely (app runs until user exits)
+    await new Promise(() => { });
 }
 main().catch((error) => {
-    console.error('Error starting claudeup:', error);
+    console.error("Error starting claudeup:", error);
     process.exit(1);
 });
-//# sourceMappingURL=main.js.map

package/src/main.tsx

@@ -0,0 +1,145 @@
+#!/usr/bin/env bun
+
+import { createCliRenderer } from "@opentui/core";
+import { createRoot } from "@opentui/react";
+import { spawn } from "node:child_process";
+import { App } from "./ui/App.js";
+import { prerunClaude } from "./prerunner/index.js";
+import { checkForUpdates } from "./services/version-check.js";
+
+export const VERSION = "3.0.0";
+
+// Note: OpenTUI renderer handles alternate screen buffer automatically
+// No need for manual ANSI escape codes
+
+async function main(): Promise<void> {
+	const args = process.argv.slice(2);
+
+	// Handle "claudeup claude [args]" - prerunner mode
+	if (args[0] === "claude") {
+		const claudeArgs = args.slice(1);
+
+		// Parse prerunner-specific flags
+		const forceUpdate =
+			claudeArgs.includes("--force") || claudeArgs.includes("-f");
+
+		// Remove prerunner flags before passing to claude
+		const filteredArgs = claudeArgs.filter(
+			(arg) => arg !== "--force" && arg !== "-f",
+		);
+
+		const exitCode = await prerunClaude(filteredArgs, { force: forceUpdate });
+		process.exit(exitCode);
+		return;
+	}
+
+	// Handle "claudeup update" - self-update command
+	if (args[0] === "update") {
+		// Detect how claudeup was installed by checking the executable path
+		const { execSync } = await import("node:child_process");
+		let usesBun = false;
+		try {
+			const claudeupPath = execSync("which claudeup", {
+				encoding: "utf-8",
+			}).trim();
+			usesBun =
+				claudeupPath.includes(".bun") || claudeupPath.includes("bun/bin");
+		} catch {
+			// If which fails, default to npm
+		}
+
+		const pkgManager = usesBun ? "bun" : "npm";
+		console.log(`Updating claudeup using ${pkgManager}...`);
+
+		const installArgs = usesBun
+			? ["install", "-g", "claudeup@latest"]
+			: ["install", "-g", "claudeup@latest"];
+
+		const proc = spawn(pkgManager, installArgs, {
+			stdio: "inherit",
+			shell: false, // Avoid shell for security (fixes DEP0190 warning)
+		});
+		proc.on("exit", (code) => process.exit(code || 0));
+		return;
+	}
+
+	// Handle --version flag - show version and check for updates
+	if (args.includes("--version") || args.includes("-v")) {
+		console.log(`claudeup v${VERSION}`);
+		const result = await checkForUpdates();
+		if (result.updateAvailable) {
+			console.log(`\nUpdate available: v${result.latestVersion}`);
+			console.log("Run: claudeup update");
+		}
+		process.exit(0);
+	}
+
+	// Handle --help flag
+	if (args.includes("--help") || args.includes("-h")) {
+		console.log(`claudeup v${VERSION}
+
+TUI tool for managing Claude Code plugins, MCPs, and configuration.
+
+Usage: claudeup [options]
+       claudeup claude [args...]  Run claude with auto-update prerunner
+       claudeup update            Update claudeup to latest version
+
+Options:
+  -v, --version  Show version and check for updates
+  -h, --help     Show this help message
+  --no-refresh   Skip auto-refresh of marketplaces on startup
+
+Commands:
+  claude [args...]   Check for plugin updates (1h cache), then run claude
+    -f, --force      Force update check (bypass 1h cache)
+  update             Update claudeup itself to latest version
+
+Navigation:
+  [1] Plugins    Manage plugin marketplaces and installed plugins
+  [2] MCP        Setup and manage MCP servers
+  [3] Status     Configure status line display
+  [4] Env        Environment variables for MCP servers
+  [5] Tools      Install and update AI coding CLI tools
+
+Keys:
+  ↑/↓ or j/k     Navigate
+  Enter          Select / Toggle
+  g              Toggle global/project scope (in Plugins)
+  r              Refresh current screen
+  ?              Show help
+  q / Escape     Back / Quit
+`);
+		process.exit(0);
+	}
+
+	// Create OpenTUI renderer (handles alternate screen buffer automatically)
+	const renderer = await createCliRenderer();
+	const root = createRoot(renderer);
+
+	// Cleanup function to restore terminal
+	const cleanup = () => {
+		root.unmount();
+		renderer.destroy(); // CRITICAL: Never use process.exit() directly
+	};
+
+	// Handle cleanup on exit signals
+	const handleExit = () => {
+		cleanup();
+		// Exit after cleanup completes
+		process.exit(0);
+	};
+
+	process.on("SIGINT", handleExit);
+	process.on("SIGTERM", handleExit);
+
+	// Render the OpenTUI app with exit handler
+	root.render(<App onExit={handleExit} />);
+
+	// Wait indefinitely (app runs until user exits)
+	await new Promise(() => {});
+}
+
+main().catch((error) => {
+	console.error("Error starting claudeup:", error);
+	process.exit(1);
+});

package/src/opentui.d.ts

@@ -0,0 +1,191 @@
+/**
+ * Type declarations for OpenTUI React
+ *
+ * These declarations extend OpenTUI's types to be compatible with React 19's
+ * more permissive return types. React 19 allows components to return ReactNode
+ * (which includes undefined), while OpenTUI's intrinsic elements expect
+ * ReactElement | null.
+ */
+
+import type { ReactNode } from "react";
+
+declare global {
+	namespace JSX {
+		interface IntrinsicElements {
+			box: BoxProps & { children?: ReactNode };
+			text: TextProps & { children?: ReactNode };
+			input: InputProps;
+			select: SelectProps;
+			"tab-select": TabSelectProps;
+			scrollbox: ScrollboxProps & { children?: ReactNode };
+			"ascii-font": AsciiFontProps;
+			code: CodeProps;
+			"line-number": LineNumberProps;
+			diff: DiffProps;
+			br: Record<string, never>;
+			strong: { children?: ReactNode };
+			em: { children?: ReactNode };
+			u: { children?: ReactNode };
+			dim: { children?: ReactNode };
+			a: { href?: string; children?: ReactNode };
+			span: { fg?: string; bg?: string; children?: ReactNode };
+		}
+	}
+}
+
+interface BaseBoxProps {
+	// Borders
+	border?: boolean;
+	borderStyle?: "single" | "double" | "rounded" | "bold";
+	borderColor?: string;
+	title?: string;
+	titleAlignment?: "left" | "center" | "right";
+
+	// Colors
+	backgroundColor?: string;
+
+	// Layout (Flexbox)
+	flexDirection?: "row" | "column";
+	justifyContent?:
+		| "flex-start"
+		| "flex-end"
+		| "center"
+		| "space-between"
+		| "space-around";
+	alignItems?: "flex-start" | "flex-end" | "center" | "stretch";
+	flexWrap?: "wrap" | "nowrap";
+	gap?: number;
+
+	// Spacing
+	padding?: number;
+	paddingTop?: number;
+	paddingBottom?: number;
+	paddingLeft?: number;
+	paddingRight?: number;
+	margin?: number;
+	marginTop?: number;
+	marginBottom?: number;
+	marginLeft?: number;
+	marginRight?: number;
+
+	// Dimensions
+	width?: number | `${number}%` | "auto";
+	height?: number | `${number}%` | "auto";
+	minWidth?: number;
+	minHeight?: number;
+	maxWidth?: number;
+	maxHeight?: number;
+	flexGrow?: number;
+	flexShrink?: number;
+	flexBasis?: number | `${number}%` | "auto";
+
+	// Overflow
+	overflow?: "hidden" | "visible";
+
+	// Events
+	onMouseDown?: (e: MouseEvent) => void;
+	onMouseUp?: (e: MouseEvent) => void;
+	onMouseMove?: (e: MouseEvent) => void;
+}
+
+interface BoxProps extends BaseBoxProps {
+	children?: ReactNode;
+}
+
+interface TextProps {
+	content?: string;
+	fg?: string;
+	bg?: string;
+	selectable?: boolean;
+	children?: ReactNode;
+}
+
+interface InputProps {
+	value: string;
+	onChange: (value: string) => void;
+	placeholder?: string;
+	focused?: boolean;
+	width?: number;
+	backgroundColor?: string;
+	textColor?: string;
+	cursorColor?: string;
+	focusedBackgroundColor?: string;
+}
+
+interface SelectOption {
+	name: string;
+	description?: string;
+	value?: string;
+}
+
+interface SelectProps {
+	options: SelectOption[];
+	onChange?: (index: number, option: SelectOption) => void;
+	onSelect?: (index: number, option: SelectOption) => void;
+	selectedIndex?: number;
+	focused?: boolean;
+	showScrollIndicator?: boolean;
+	height?: number;
+}
+
+interface TabSelectProps {
+	options: { name: string; description?: string }[];
+	onChange?: (index: number, option: { name: string }) => void;
+	tabWidth?: number;
+	focused?: boolean;
+}
+
+interface ScrollboxProps {
+	focused?: boolean;
+	style?: {
+		rootOptions?: Record<string, unknown>;
+		wrapperOptions?: Record<string, unknown>;
+		viewportOptions?: Record<string, unknown>;
+		contentOptions?: Record<string, unknown>;
+		scrollbarOptions?: {
+			showArrows?: boolean;
+			trackOptions?: {
+				foregroundColor?: string;
+				backgroundColor?: string;
+			};
+		};
+	};
+	children?: ReactNode;
+}
+
+interface AsciiFontProps {
+	text: string;
+	font?: "tiny" | "block" | "slick" | "shade";
+	color?: string;
+}
+
+interface CodeProps {
+	code: string;
+	language?: string;
+	showLineNumbers?: boolean;
+	highlightLines?: number[];
+}
+
+interface LineNumberProps {
+	code: string;
+	language?: string;
+	startLine?: number;
+	highlightedLines?: number[];
+	diagnostics?: { line: number; severity: string; message: string }[];
+}
+
+interface DiffProps {
+	oldCode: string;
+	newCode: string;
+	language?: string;
+	mode?: "unified" | "split";
+	showLineNumbers?: boolean;
+}
+
+interface MouseEvent {
+	x: number;
+	y: number;
+	button: number;
+}
+
+export {};