newtui 2.0.0

package/dist/index.js

@@ -0,0 +1,1408 @@
+#!/usr/bin/env node
+import { createRequire } from "node:module";
+import { spawn } from "node:child_process";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import mri from "mri";
+import { cancel, confirm, intro, isCancel, log, multiselect, outro, select, spinner, text } from "@clack/prompts";
+import { z } from "zod";
+import { existsSync } from "node:fs";
+import { mkdir, readFile, writeFile } from "node:fs/promises";
+import color from "picocolors";
+import spawn$1 from "cross-spawn";
+import { resolveCommand } from "package-manager-detector/commands";
+import { detect } from "package-manager-detector/detect";
+
+//#region src/tools/fileSystem.ts
+function pathExists(target) {
+	return existsSync(target);
+}
+/** Resolve a `--cwd` value, failing early when the directory is missing. */
+function resolveCwd(cwd) {
+	const resolved = path.resolve(cwd);
+	if (!existsSync(resolved)) throw new Error(`The path ${resolved} does not exist. Please try again.`);
+	return resolved;
+}
+/** First candidate (relative to `cwd`) that exists on disk. */
+function findFirstExisting(cwd, candidates) {
+	return candidates.find((candidate) => existsSync(path.resolve(cwd, candidate)));
+}
+async function readFileIfExists(target) {
+	if (!existsSync(target)) return null;
+	return readFile(target, "utf8");
+}
+async function readTextFile(target) {
+	return readFile(target, "utf8");
+}
+/** Write a file, creating any missing parent directories first. */
+async function writeFileAt(target, content) {
+	await mkdir(path.dirname(target), { recursive: true });
+	await writeFile(target, content, "utf8");
+}
+function relativePath(cwd, target) {
+	return path.relative(cwd, target);
+}
+
+//#endregion
+//#region src/tools/options.ts
+/**
+* Static option tables for the `newtui` CLI.
+*
+* Everything here is declared `as const` so the derived union types stay in
+* sync with the values the argv parser and the commands actually accept.
+*/
+const COMMANDS = [
+	"init",
+	"add",
+	"list",
+	"diff"
+];
+const PACKAGE_MANAGERS = [
+	"npm",
+	"yarn",
+	"pnpm",
+	"bun"
+];
+/** The UI framework a project targets, and the key registry items carry. */
+const FRAMEWORKS = ["react", "vue"];
+/**
+* The build tool a Vue project uses. Only Vue projects need this — it decides
+* which stylesheet `init` looks for and which setup instructions it prints.
+* Earlier releases of the Vue CLI stored these values under `framework`;
+* `config.ts` migrates such a `components.json` on read.
+*/
+const BUNDLERS = ["nuxt", "vite"];
+const BOOLEAN_FLAGS = [
+	"all",
+	"defaults",
+	"help",
+	"json",
+	"legacy",
+	"overwrite",
+	"skip-install",
+	"version",
+	"yes"
+];
+const STRING_FLAGS = [
+	"bundler",
+	"css",
+	"cwd",
+	"framework",
+	"path",
+	"registry",
+	"type"
+];
+const FLAG_ALIASES = {
+	a: "all",
+	b: "bundler",
+	c: "cwd",
+	d: "defaults",
+	f: "framework",
+	h: "help",
+	o: "overwrite",
+	p: "path",
+	r: "registry",
+	t: "type",
+	v: "version",
+	y: "yes"
+};
+const SHARED_DEPENDENCIES = ["class-variance-authority", "tailwindcss-animate"];
+const PROJECT_DEPENDENCIES_V3 = [
+	"clsx",
+	"tailwind-merge",
+	...SHARED_DEPENDENCIES
+];
+const PROJECT_DEPENDENCIES_V4 = ["cn", ...SHARED_DEPENDENCIES];
+/** Nuxt config files `init` looks for when detecting a Vue project's bundler. */
+const NUXT_CONFIG_CANDIDATES = [
+	"nuxt.config.ts",
+	"nuxt.config.js",
+	"nuxt.config.mjs"
+];
+/** Vite config files `init` looks for when detecting a Vue project's bundler. */
+const VITE_CONFIG_CANDIDATES = [
+	"vite.config.ts",
+	"vite.config.js",
+	"vite.config.mjs"
+];
+/** Next.js config files `init` looks for when detecting a React project. */
+const NEXT_CONFIG_CANDIDATES = [
+	"next.config.ts",
+	"next.config.js",
+	"next.config.mjs"
+];
+/** Global stylesheets `init` looks for, per framework (Vue splits by bundler). */
+const CSS_CANDIDATES = {
+	react: [
+		"app/globals.css",
+		"src/app/globals.css",
+		"styles/globals.css",
+		"src/styles/globals.css",
+		"src/index.css",
+		"src/app.css"
+	],
+	nuxt: [
+		"src/assets/css/tailwind.css",
+		"assets/css/tailwind.css",
+		"src/assets/css/main.css",
+		"assets/css/main.css"
+	],
+	vite: [
+		"src/assets/index.css",
+		"src/assets/main.css",
+		"src/style.css",
+		"src/index.css"
+	]
+};
+/** Tailwind config files `init` looks for, in order of preference. */
+const TAILWIND_CONFIG_CANDIDATES = [
+	"tailwind.config.ts",
+	"tailwind.config.js",
+	"tailwind.config.mjs",
+	"tailwind.config.cjs"
+];
+function isCommandName(value) {
+	return COMMANDS.some((command) => command === value);
+}
+function isFrameworkName(value) {
+	return FRAMEWORKS.some((framework) => framework === value);
+}
+function isBundlerName(value) {
+	return BUNDLERS.some((bundler) => bundler === value);
+}
+/** Read a flag that expects a value, ignoring `--flag` used without one. */
+function flagString(value) {
+	if (value === void 0 || value === true || value === false) return void 0;
+	return value.length > 0 ? value : void 0;
+}
+/** Read a boolean flag, tolerating `--flag=true` style input. */
+function flagBoolean(value) {
+	return value === true || value === "true";
+}
+
+//#endregion
+//#region src/tools/config.ts
+const DEFAULT_STYLE = "default";
+const DEFAULT_COMPONENTS = "@/components";
+const DEFAULT_UTILS = "@/lib/utils";
+const DEFAULT_UI = "@/components/ui";
+const DEFAULT_LIB = "@/lib";
+const DEFAULT_HOOKS = "@/hooks";
+const DEFAULT_COMPOSABLES = "@/composables";
+const DEFAULT_TAILWIND_CONFIG = "tailwind.config.ts";
+const DEFAULT_TAILWIND_BASE_COLOR = "neutral";
+const DEFAULT_FRAMEWORK = "react";
+const DEFAULT_BUNDLER = "nuxt";
+/** Where `init` writes the tokens when it finds no existing stylesheet. */
+const DEFAULT_TAILWIND_CSS = {
+	react: "app/globals.css",
+	vue: "src/assets/css/tailwind.css"
+};
+const CONFIG_FILE_NAME = "components.json";
+const frameworkSchema = z.enum(FRAMEWORKS);
+const bundlerSchema = z.enum(BUNDLERS);
+const rawConfigSchema = z.object({
+	$schema: z.string().optional(),
+	style: z.string().default(DEFAULT_STYLE),
+	framework: frameworkSchema.default(DEFAULT_FRAMEWORK),
+	/** Vue only — which build tool the project uses. */
+	bundler: bundlerSchema.optional(),
+	typescript: z.boolean().default(true),
+	/**
+	* React only, and left optional so a Vue `components.json` does not grow a
+	* field that means nothing there. Kept separate from `typescript` because
+	* it controls whether `"use client"` survives, which TypeScript alone does
+	* not imply. Absent means enabled — see `RSC_DEFAULT`.
+	*/
+	rsc: z.boolean().optional(),
+	/**
+	* Legacy alias of `typescript` written by the React CLI before the two
+	* CLIs merged. Read by `migrateRawConfig` and preserved so an existing
+	* `components.json` keeps validating.
+	*/
+	tsx: z.boolean().optional(),
+	tailwind: z.object({
+		config: z.string().default(DEFAULT_TAILWIND_CONFIG),
+		css: z.string(),
+		baseColor: z.string().default(DEFAULT_TAILWIND_BASE_COLOR),
+		cssVariables: z.boolean().default(true),
+		prefix: z.string().default("").optional()
+	}),
+	aliases: z.object({
+		components: z.string().default(DEFAULT_COMPONENTS),
+		utils: z.string().default(DEFAULT_UTILS),
+		ui: z.string().optional(),
+		lib: z.string().optional(),
+		hooks: z.string().optional(),
+		composables: z.string().optional()
+	}),
+	iconLibrary: z.string().optional(),
+	registry: z.string().optional()
+}).strict();
+const configSchema = rawConfigSchema.extend({ resolvedPaths: z.object({
+	cwd: z.string(),
+	tailwindConfig: z.string(),
+	tailwindCss: z.string(),
+	utils: z.string(),
+	components: z.string(),
+	ui: z.string(),
+	lib: z.string(),
+	hooks: z.string(),
+	composables: z.string()
+}) });
+/**
+* The wire shape of `components.json`: the fields above plus the ones the two
+* CLIs wrote before they merged. `framework` used to name the Vue build tool,
+* and the React CLI spelled "is this project TypeScript" as `tsx`.
+*/
+const componentsFileSchema = z.object({
+	framework: z.enum([...FRAMEWORKS, ...BUNDLERS]).optional(),
+	bundler: bundlerSchema.optional(),
+	typescript: z.boolean().optional(),
+	tsx: z.boolean().optional(),
+	aliases: z.object({ composables: z.string().optional() }).passthrough().optional()
+}).passthrough();
+/**
+* Bring a `components.json` written by either of the old CLIs up to the merged
+* shape, so an existing project keeps working without being re-initialized.
+*/
+function migrateComponentsFile(file) {
+	const migrated = { ...file };
+	if (file.framework === "nuxt" || file.framework === "vite") {
+		migrated.bundler = file.bundler ?? file.framework;
+		migrated.framework = "vue";
+	} else if (file.framework === void 0) migrated.framework = file.typescript !== void 0 || file.aliases?.composables !== void 0 ? "vue" : "react";
+	if (file.typescript === void 0 && file.tsx !== void 0) migrated.typescript = file.tsx;
+	return migrated;
+}
+async function readTsConfigPaths(cwd) {
+	for (const candidate of ["tsconfig.json", "jsconfig.json"]) {
+		const filePath = path.resolve(cwd, candidate);
+		const raw = await readFileIfExists(filePath);
+		if (raw === null) continue;
+		try {
+			const cleaned = raw.replace(/\/\*[\s\S]*?\*\//g, "").replace(/^\s*\/\/.*$/gm, "").replace(/,(\s*[}\]])/g, "$1");
+			const parsed = JSON.parse(cleaned);
+			return {
+				baseUrl: parsed.compilerOptions?.baseUrl ?? ".",
+				paths: parsed.compilerOptions?.paths ?? {}
+			};
+		} catch {}
+	}
+	return {
+		baseUrl: ".",
+		paths: {}
+	};
+}
+/**
+* Resolve an import alias such as `@/components/ui` to an absolute directory.
+* Uses tsconfig `paths` when available, otherwise falls back to `src/` (the
+* layout used by the newt/ui Vite and Nuxt templates) or the project root.
+*/
+async function resolveImport(alias, cwd, preferSrcDir) {
+	const { baseUrl, paths } = await readTsConfigPaths(cwd);
+	const base = path.resolve(cwd, baseUrl);
+	for (const [pattern, targets] of Object.entries(paths)) {
+		const target = targets[0];
+		if (!target) continue;
+		const prefix = pattern.replace(/\*$/, "");
+		if (alias === prefix.replace(/\/$/, "") || alias.startsWith(prefix)) {
+			const rest = alias.slice(prefix.length);
+			const targetPrefix = target.replace(/\*$/, "");
+			return path.resolve(base, targetPrefix + rest);
+		}
+	}
+	const stripped = alias.replace(/^[@~]\//, "");
+	const srcDir = path.resolve(cwd, "src");
+	if (preferSrcDir || pathExists(srcDir)) return path.resolve(srcDir, stripped);
+	return path.resolve(cwd, stripped);
+}
+async function resolveConfigPaths(cwd, config) {
+	const preferSrcDir = config.tailwind.css.startsWith("src/");
+	const utils = await resolveImport(config.aliases.utils, cwd, preferSrcDir);
+	const components = await resolveImport(config.aliases.components, cwd, preferSrcDir);
+	const ui = config.aliases.ui ? await resolveImport(config.aliases.ui, cwd, preferSrcDir) : path.resolve(components, "ui");
+	const lib = config.aliases.lib ? await resolveImport(config.aliases.lib, cwd, preferSrcDir) : path.dirname(utils);
+	const hooks = config.aliases.hooks ? await resolveImport(config.aliases.hooks, cwd, preferSrcDir) : path.resolve(path.dirname(components), "hooks");
+	const composables = config.aliases.composables ? await resolveImport(config.aliases.composables, cwd, preferSrcDir) : path.resolve(path.dirname(components), "composables");
+	return configSchema.parse({
+		...config,
+		resolvedPaths: {
+			cwd,
+			tailwindConfig: path.resolve(cwd, config.tailwind.config),
+			tailwindCss: path.resolve(cwd, config.tailwind.css),
+			utils,
+			components,
+			ui,
+			lib,
+			hooks,
+			composables
+		}
+	});
+}
+async function getRawConfig(cwd) {
+	const configPath = path.resolve(cwd, CONFIG_FILE_NAME);
+	const raw = await readFileIfExists(configPath);
+	if (raw === null) return null;
+	try {
+		return rawConfigSchema.parse(migrateComponentsFile(componentsFileSchema.parse(JSON.parse(raw))));
+	} catch (error) {
+		const detail = error instanceof Error ? error.message : String(error);
+		throw new Error(`Invalid configuration found in ${configPath}.\n${detail}`, { cause: error });
+	}
+}
+async function getConfig(cwd) {
+	const raw = await getRawConfig(cwd);
+	if (!raw) return null;
+	return resolveConfigPaths(cwd, raw);
+}
+
+//#endregion
+//#region src/tools/logger.ts
+const highlighter = {
+	error: (value) => color.red(value),
+	warn: (value) => color.yellow(value),
+	info: (value) => color.cyan(value),
+	success: (value) => color.green(value),
+	dim: (value) => color.dim(value),
+	bold: (value) => color.bold(value)
+};
+const logger = {
+	error(message) {
+		log.error(message);
+	},
+	warn(message) {
+		log.warn(message);
+	},
+	info(message) {
+		log.info(message);
+	},
+	success(message) {
+		log.success(message);
+	},
+	log(message) {
+		log.message(message);
+	},
+	break() {
+		console.log("");
+	}
+};
+function handleError(cause) {
+	const asString = z.string().safeParse(cause);
+	if (asString.success) logger.error(asString.data);
+	else if (cause instanceof Error) logger.error(cause.message);
+	else logger.error("Something went wrong. Please try again.");
+	process.exit(1);
+}
+
+//#endregion
+//#region src/tools/packageManager.ts
+const DEFAULT_PACKAGE_MANAGER = "npm";
+function toPackageManager(name) {
+	return PACKAGE_MANAGERS.find((candidate) => candidate === name) ?? DEFAULT_PACKAGE_MANAGER;
+}
+/** Detect the package manager used by the project at `cwd` (lockfile first). */
+async function detectPackageManager(cwd) {
+	return toPackageManager((await detect({ cwd }))?.name);
+}
+function run(command, args, cwd) {
+	return new Promise((resolve, reject) => {
+		const child = spawn$1(command, args, {
+			cwd,
+			stdio: "inherit"
+		});
+		child.on("error", reject);
+		child.on("close", (code) => {
+			if (code === 0) {
+				resolve();
+				return;
+			}
+			reject(/* @__PURE__ */ new Error(`\`${command} ${args.join(" ")}\` failed with exit code ${code ?? 1}.`));
+		});
+	});
+}
+async function installDependencies(cwd, dependencies, options = {}) {
+	if (dependencies.length === 0) return;
+	const packageManager = await detectPackageManager(cwd);
+	const args = options.dev ? [...dependencies, "-D"] : dependencies;
+	const command = resolveCommand(packageManager, "add", args);
+	if (!command) throw new Error(`Could not resolve an install command for ${packageManager}.`);
+	await run(command.command, command.args, cwd);
+}
+
+//#endregion
+//#region src/tools/prompts.ts
+/** Exit cleanly when the user cancels a prompt (ctrl+c / esc). */
+function unwrap(value) {
+	if (isCancel(value)) {
+		cancel("Operation cancelled.");
+		process.exit(1);
+	}
+	return value;
+}
+async function promptConfirm(message, initialValue = true) {
+	return unwrap(await confirm({
+		message,
+		initialValue
+	}));
+}
+async function promptText(message, initialValue) {
+	return unwrap(await text({
+		message,
+		placeholder: initialValue,
+		defaultValue: initialValue
+	}));
+}
+async function promptSelect(message, options, initialValue) {
+	return unwrap(await select({
+		message,
+		options,
+		initialValue
+	}));
+}
+async function promptMultiselect(message, options) {
+	return unwrap(await multiselect({
+		message,
+		options,
+		required: false
+	}));
+}
+
+//#endregion
+//#region src/tools/schema.ts
+const registryItemTypeSchema = z.enum([
+	"registry:style",
+	"registry:lib",
+	"registry:example",
+	"registry:block",
+	"registry:component",
+	"registry:ui",
+	"registry:hook",
+	"registry:theme",
+	"registry:page",
+	"registry:file"
+]);
+/**
+* Which UI framework an item's files target. Items are served from
+* per-framework registries, so this is informational for consumers that mix
+* both (the docs site, external tooling) rather than a routing key.
+*/
+const registryItemFrameworkSchema = z.enum(["react", "vue"]);
+const registryItemFileSchema = z.union([z.string(), z.object({
+	path: z.string(),
+	content: z.string().optional(),
+	type: registryItemTypeSchema,
+	target: z.string().optional()
+})]);
+/**
+* Tailwind v3 only. Consumers on v4 get the same values through
+* `cssVars.theme`, which maps to an `@theme` block instead of a JS config.
+*/
+const registryItemTailwindSchema = z.object({ config: z.object({
+	content: z.array(z.string()).optional(),
+	theme: z.record(z.string(), z.any()).optional(),
+	plugins: z.array(z.string()).optional()
+}).optional() });
+/**
+* `theme` holds Tailwind v4 `@theme` entries (`--color-*`, `--radius-*`, …);
+* `light`/`dark` hold plain custom properties written into the matching
+* selector. Both are emitted for every item so a single registry serves
+* Tailwind v3 and v4 projects.
+*/
+const registryItemCssVarsSchema = z.object({
+	theme: z.record(z.string(), z.string()).optional(),
+	light: z.record(z.string(), z.string()).optional(),
+	dark: z.record(z.string(), z.string()).optional()
+});
+/**
+* Raw CSS keyed by at-rule or selector — `@layer base`, `@layer components`,
+* `@utility …`, `@keyframes …`. Tailwind v4 consumers get these appended to
+* their stylesheet; v3 consumers get the same rules wrapped by the CLI.
+*/
+const registryItemCssSchema = z.record(z.string(), z.union([z.string(), z.record(z.string(), z.any())]));
+const registryItemSchema = z.object({
+	name: z.string(),
+	type: registryItemTypeSchema,
+	framework: registryItemFrameworkSchema.optional(),
+	title: z.string().optional(),
+	description: z.string().optional(),
+	dependencies: z.array(z.string()).optional(),
+	devDependencies: z.array(z.string()).optional(),
+	registryDependencies: z.array(z.string()).optional(),
+	files: z.array(registryItemFileSchema).optional(),
+	tailwind: registryItemTailwindSchema.optional(),
+	cssVars: registryItemCssVarsSchema.optional(),
+	css: registryItemCssSchema.optional(),
+	meta: z.record(z.string(), z.any()).optional(),
+	docs: z.string().optional(),
+	categories: z.array(z.string()).optional()
+});
+const registrySchema = z.array(registryItemSchema);
+const registryIndexSchema = z.array(registryItemSchema.extend({ files: z.array(z.string()).optional() }));
+
+//#endregion
+//#region src/tools/registry.ts
+/**
+* React and Vue components are served from their own registry, each item
+* carrying a `framework` field naming which one it came from. The project's
+* `components.json` picks the base url; `--registry` and `NEWT_REGISTRY_URL`
+* override it for custom registries.
+*/
+const DEFAULT_REGISTRY_URLS = {
+	react: "https://newtui.dev/r",
+	vue: "https://newtui.dev/vue/r"
+};
+function getRegistryUrl(framework, override) {
+	return (override ?? process.env.NEWT_REGISTRY_URL ?? DEFAULT_REGISTRY_URLS[framework]).replace(/\/+$/, "");
+}
+/** Fetch `url` as JSON and parse it against `schema`, the I/O boundary for all registry reads. */
+async function fetchJson(url, schema) {
+	const response = await fetch(url);
+	if (!response.ok) throw new Error(`Failed to fetch ${url} (${response.status} ${response.statusText}).`);
+	const data = await response.json();
+	return schema.parse(data);
+}
+async function getRegistryIndex(registryUrl) {
+	return fetchJson(`${registryUrl}/index.json`, registryIndexSchema);
+}
+async function getRegistryItem(registryUrl, style, name) {
+	const url = /^https?:\/\//.test(name) ? name : `${registryUrl}/styles/${style}/${name}.json`;
+	try {
+		return await fetchJson(url, registryItemSchema);
+	} catch (error) {
+		if (error instanceof z.ZodError) throw new Error(`Invalid registry item "${name}": ${error.message}`, { cause: error });
+		const detail = error instanceof Error ? error.message : String(error);
+		throw new Error(`Component "${name}" not found in registry.\n${detail}`, { cause: error });
+	}
+}
+/**
+* Resolve the full dependency tree for the given names (including transitive
+* `registryDependencies`) and return items in install order (deps first).
+*/
+async function resolveTree(registryUrl, style, names) {
+	const resolved = /* @__PURE__ */ new Map();
+	const visiting = /* @__PURE__ */ new Set();
+	async function visit(name) {
+		if (resolved.has(name) || visiting.has(name)) return;
+		visiting.add(name);
+		const item = await getRegistryItem(registryUrl, style, name);
+		for (const dep of item.registryDependencies ?? []) await visit(dep);
+		visiting.delete(name);
+		resolved.set(name, item);
+	}
+	for (const name of names) await visit(name);
+	return Array.from(resolved.values());
+}
+
+//#endregion
+//#region src/tools/tailwind.ts
+const TAILWIND_MAJORS = [3, 4];
+/**
+* Which Tailwind major the target project is on.
+*
+* The declared dependency wins, because it is the only unambiguous signal.
+* Otherwise the stylesheet decides: v4 is CSS-first (`@import "tailwindcss"`)
+* while v3 uses the `@tailwind` directives and a JS config. A project with a
+* `tailwind.config.*` and nothing else is treated as v3.
+*/
+async function detectTailwindMajor(cwd, cssPath) {
+	const pkg = await readFileIfExists(path.join(cwd, "package.json"));
+	if (pkg) {
+		const range = readTailwindRange(pkg);
+		const major = range ? majorFromRange(range) : void 0;
+		if (major) return major;
+	}
+	const css = await readFileIfExists(cssPath);
+	if (css) {
+		if (/@import\s+["']tailwindcss["']/.test(css)) return 4;
+		if (/@tailwind\s+(base|components|utilities)/.test(css)) return 3;
+	}
+	return findFirstExisting(cwd, TAILWIND_CONFIG_CANDIDATES) ? 3 : 4;
+}
+/**
+* The `dependencies`/`devDependencies` maps we need out of `package.json`.
+* Each key is left unvalidated (`unknown`) since we only ever look up a
+* single known key (`tailwindcss`) afterwards; a malformed neighbouring
+* dependency entry should not stop that lookup from succeeding.
+*/
+const packageJsonSchema = z.object({
+	dependencies: z.record(z.string(), z.unknown()).optional(),
+	devDependencies: z.record(z.string(), z.unknown()).optional()
+});
+function readTailwindRange(packageJson) {
+	let raw;
+	try {
+		raw = JSON.parse(packageJson);
+	} catch {
+		return;
+	}
+	const parsed = packageJsonSchema.safeParse(raw);
+	if (!parsed.success) return void 0;
+	for (const field of ["dependencies", "devDependencies"]) {
+		const range = z.string().safeParse(parsed.data[field]?.tailwindcss);
+		if (range.success) return range.data;
+	}
+}
+function majorFromRange(range) {
+	const match = /(\d+)/.exec(range);
+	if (!match?.[1]) return void 0;
+	const major = Number.parseInt(match[1], 10);
+	return TAILWIND_MAJORS.find((candidate) => candidate === major);
+}
+/**
+* The stylesheet preamble a fresh project needs, per major.
+*/
+function tailwindPreamble(major) {
+	return major === 4 ? "@import \"tailwindcss\";\n" : "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n";
+}
+/**
+* Render an item's `cssVars` and `css` into a stylesheet block.
+*
+* On v4 the theme entries become an `@theme` block, which is what generates
+* the `bg-newt-*` / `rounded-*` / `shadow-*` utilities — there is no JS config
+* to extend. On v3 those same utilities come from the preset in
+* `tailwind.config`, so only the raw custom properties are written here.
+*/
+function renderItemCss(item, major) {
+	const parts = [];
+	const vars = item.cssVars;
+	if (vars?.theme && major === 4) parts.push(block("@theme", vars.theme));
+	if (vars?.light) parts.push(block(":root", vars.light));
+	if (vars?.dark) {
+		parts.push(block(":root", vars.dark));
+		parts.push(block(".dark", vars.dark));
+	}
+	if (item.css) for (const [selector, body] of Object.entries(item.css)) if (body instanceof Object) parts.push(block(selector, body));
+	else parts.push(`${selector} {\n${indent(body)}\n}`);
+	return parts.length > 0 ? `${parts.join("\n\n")}\n` : "";
+}
+function block(selector, entries) {
+	return `${selector} {\n${Object.entries(entries).map(([key, value]) => `  ${cssProperty(key)}: ${String(value)};`).join("\n")}\n}`;
+}
+/** `newt-brand` and `--newt-brand` both mean the same custom property. */
+function cssProperty(key) {
+	return key.startsWith("--") ? key : `--${key}`;
+}
+function indent(value) {
+	return value.split("\n").map((line) => line.length > 0 ? `  ${line}` : line).join("\n");
+}
+
+//#endregion
+//#region src/tools/transformers.ts
+function normalizeFile(file, fallbackType) {
+	if (!(file instanceof Object)) return null;
+	if (file.content === void 0) return null;
+	return {
+		path: file.path,
+		content: file.content,
+		type: file.type ?? fallbackType,
+		target: file.target
+	};
+}
+/**
+* Rewrite registry-internal import paths to the user's configured aliases.
+* The two registries root their components differently:
+*   React: `@/registry/default/ui/button`     -> `@/components/ui/button`
+*   Vue:   `@/lib/registry/default/ui/button` -> `@/components/ui/button`
+* `@/lib/utils` maps to `<aliases.utils>` in both.
+*/
+function transformImports(content, config) {
+	const uiAlias = config.aliases.ui ?? `${config.aliases.components}/ui`;
+	const libAlias = config.aliases.lib ?? "@/lib";
+	const hooksAlias = config.framework === "vue" ? config.aliases.composables ?? "@/composables" : config.aliases.hooks ?? "@/hooks";
+	const hooksSegment = config.framework === "vue" ? "composables" : "hooks";
+	const escapedRoot = (config.framework === "vue" ? "@/lib/registry" : "@/registry").replace(/[/\\]/g, "\\$&");
+	let out = content;
+	out = out.replace(new RegExp(`${escapedRoot}/[^/"']+/ui/`, "g"), `${uiAlias}/`);
+	out = out.replace(new RegExp(`${escapedRoot}/[^/"']+/${hooksSegment}/`, "g"), `${hooksAlias}/`);
+	out = out.replace(new RegExp(`${escapedRoot}/[^/"']+/lib/`, "g"), `${libAlias}/`);
+	out = out.replace(new RegExp(`${escapedRoot}/[^/"']+/`, "g"), `${config.aliases.components}/`);
+	out = out.replace(/(["'])@\/lib\/utils\1/g, `$1${config.aliases.utils}$1`);
+	return out;
+}
+/**
+* Strip `"use client"` directives when a React project is not using React
+* Server Components.
+*/
+function transformRsc(content, config) {
+	if (config.framework !== "react" || (config.rsc ?? true)) return content;
+	return content.replace(/^["']use client["'];?\s*\n/m, "");
+}
+/**
+* Drop `lang="ts"` from Vue SFC blocks when the project is not using
+* TypeScript. Type annotations are not stripped (a full TS transform is out of
+* scope).
+*/
+function transformTypeScript(content, config) {
+	if (config.framework !== "vue" || config.typescript) return content;
+	return content.replace(/<script([^>]*)\slang="ts"/g, "<script$1");
+}
+/**
+* Convert `.tsx`/`.ts` sources to `.jsx`/`.js` file names when the project is
+* not using TypeScript. `.vue` single-file components keep their extension.
+*/
+function transformFileName(filePath, config) {
+	if (config.typescript) return filePath;
+	return filePath.replace(/\.tsx$/, ".jsx").replace(/\.ts$/, ".js");
+}
+function transformContent(content, config) {
+	return transformTypeScript(transformRsc(transformImports(content, config), config), config);
+}
+/**
+* Vue registry items are directories: `ui/button/Button.vue`, `ui/button/index.ts`.
+* Keep everything below the registry root segment (`ui/`, `lib/`, ...) so the
+* component directory structure is preserved inside the user's project. React
+* items are single files, so they flatten to their base name.
+*/
+function relativeToRoot(filePath, root, config) {
+	if (config.framework !== "vue") return path.basename(filePath);
+	const normalized = filePath.replace(/^\.?\//, "");
+	const prefix = `${root}/`;
+	const index = normalized.indexOf(prefix);
+	const rest = index === -1 ? normalized : normalized.slice(index + prefix.length);
+	return rest.length > 0 ? rest : path.basename(normalized);
+}
+/**
+* Resolve where a registry file should be written based on its type and the user's aliases.
+*/
+function resolveTargetPath(file, item, config) {
+	if (file.target) return path.resolve(config.resolvedPaths.cwd, file.target);
+	switch (file.type ?? item.type) {
+		case "registry:ui": return path.resolve(config.resolvedPaths.ui, transformFileName(relativeToRoot(file.path, "ui", config), config));
+		case "registry:lib": return path.resolve(config.resolvedPaths.lib, transformFileName(relativeToRoot(file.path, "lib", config), config));
+		case "registry:hook": return config.framework === "vue" ? path.resolve(config.resolvedPaths.composables, transformFileName(relativeToRoot(file.path, "composables", config), config)) : path.resolve(config.resolvedPaths.hooks, transformFileName(path.basename(file.path), config));
+		case "registry:block":
+		case "registry:component":
+		case "registry:example": return path.resolve(config.resolvedPaths.components, transformFileName(path.basename(file.path), config));
+		case "registry:page":
+		case "registry:file": return path.resolve(config.resolvedPaths.cwd, transformFileName(file.path, config));
+		default: return path.resolve(config.resolvedPaths.components, transformFileName(path.basename(file.path), config));
+	}
+}
+
+//#endregion
+//#region src/commands/add.ts
+async function add(options) {
+	const cwd = resolveCwd(options.cwd);
+	const config = await getConfig(cwd);
+	if (!config) throw new Error(`Configuration is missing. Please run ${highlighter.info("npx newtui init")} to create a components.json file.`);
+	intro(highlighter.bold("newt/ui — add"));
+	const registryUrl = getRegistryUrl(config.framework, options.registry ?? config.registry);
+	let selected = options.components;
+	if (options.all || selected.length === 0) {
+		const uiItems = (await getRegistryIndex(registryUrl)).filter((item) => item.type === "registry:ui");
+		selected = options.all ? uiItems.map((item) => item.name) : await promptMultiselect("Which components would you like to add?", uiItems.map((item) => ({
+			value: item.name,
+			label: item.title ?? item.name
+		})));
+	}
+	if (selected.length === 0) {
+		logger.warn("No components selected. Exiting.");
+		process.exit(0);
+	}
+	await runAdd(config, registryUrl, selected, options);
+}
+async function runAdd(config, registryUrl, names, options) {
+	const resolveSpinner = spinner();
+	resolveSpinner.start("Resolving registry dependencies...");
+	let tree;
+	try {
+		tree = await resolveTree(registryUrl, config.style, names);
+	} catch (error) {
+		resolveSpinner.stop("Failed to resolve components.");
+		throw error;
+	}
+	resolveSpinner.stop(`Resolved ${tree.length} item(s): ${tree.map((item) => item.name).join(", ")}`);
+	if (!options.yes) {
+		if (!await promptConfirm("Ready to install components and dependencies. Proceed?")) process.exit(0);
+	}
+	const dependencies = /* @__PURE__ */ new Set();
+	const devDependencies = /* @__PURE__ */ new Set();
+	const written = [];
+	const skipped = [];
+	for (const item of tree) {
+		for (const dep of item.dependencies ?? []) dependencies.add(dep);
+		for (const dep of item.devDependencies ?? []) devDependencies.add(dep);
+		for (const rawFile of item.files ?? []) {
+			const file = normalizeFile(rawFile, item.type);
+			if (!file) continue;
+			let target = resolveTargetPath(file, item, config);
+			if (options.path && !file.target) {
+				const relative = relativePath(config.resolvedPaths.ui, target);
+				const inUiDir = !relative.startsWith("..") && !path.isAbsolute(relative);
+				target = path.resolve(config.resolvedPaths.cwd, options.path, inUiDir ? relative : path.basename(target));
+			}
+			if (pathExists(target) && !options.overwrite) {
+				const relative = relativePath(config.resolvedPaths.cwd, target);
+				if (options.yes) {
+					skipped.push(relative);
+					continue;
+				}
+				if (!await promptConfirm(`File ${highlighter.info(relative)} already exists. Overwrite?`, false)) {
+					skipped.push(relative);
+					continue;
+				}
+			}
+			await writeFileAt(target, transformContent(file.content, config));
+			written.push(relativePath(config.resolvedPaths.cwd, target));
+		}
+	}
+	await applyItemStyles(tree, config);
+	for (const file of written) logger.success(`+ ${file}`);
+	for (const file of skipped) logger.warn(`~ ${file} (skipped, use --overwrite to replace)`);
+	if (!options.skipInstall) {
+		if (dependencies.size > 0) {
+			logger.info(`Installing dependencies: ${Array.from(dependencies).join(", ")}`);
+			await installDependencies(config.resolvedPaths.cwd, Array.from(dependencies));
+		}
+		if (devDependencies.size > 0) {
+			logger.info(`Installing devDependencies: ${Array.from(devDependencies).join(", ")}`);
+			await installDependencies(config.resolvedPaths.cwd, Array.from(devDependencies), { dev: true });
+		}
+	} else if (dependencies.size > 0 || devDependencies.size > 0) logger.warn(`Skipped install. Dependencies: ${[...dependencies, ...devDependencies].join(", ")}`);
+	const uiAlias = config.aliases.ui ?? `${config.aliases.components}/ui`;
+	logger.log(tree.map((item) => highlighter.dim(`import { ... } from "${uiAlias}/${item.name}"`)).join("\n"));
+	outro("Done.");
+}
+/**
+* Append any `cssVars` / `css` an item carries to the project stylesheet,
+* rendered for whichever Tailwind major the project is on. Most components
+* need nothing here — they are styled by the tokens `init` wrote.
+*/
+async function applyItemStyles(items, config) {
+	const styled = items.filter((item) => item.cssVars ?? item.css);
+	if (styled.length === 0) return;
+	const cssPath = config.resolvedPaths.tailwindCss;
+	const existing = await readFileIfExists(cssPath) ?? "";
+	const major = await detectTailwindMajor(config.resolvedPaths.cwd, cssPath);
+	const additions = [];
+	for (const item of styled) {
+		const rendered = renderItemCss(item, major);
+		if (rendered.length === 0) continue;
+		if (existing.includes(rendered.trim())) continue;
+		additions.push(`/* newt/ui — ${item.name} */\n${rendered}`);
+	}
+	if (additions.length === 0) return;
+	await writeFileAt(cssPath, `${existing.replace(/\s*$/, "\n")}\n${additions.join("\n")}`);
+	logger.success(`+ ${relativePath(config.resolvedPaths.cwd, cssPath)} (styles)`);
+}
+
+//#endregion
+//#region src/commands/diff.ts
+async function diff(options) {
+	const cwd = resolveCwd(options.cwd);
+	const config = await getConfig(cwd);
+	if (!config) throw new Error(`Configuration is missing. Please run ${highlighter.info("npx newtui init")} first.`);
+	if (!options.component) throw new Error("Please specify a component name, e.g. `newtui diff button`.");
+	intro(highlighter.bold("newt/ui — diff"));
+	const registryUrl = getRegistryUrl(config.framework, options.registry ?? config.registry);
+	const item = await getRegistryItem(registryUrl, config.style, options.component);
+	let changed = 0;
+	for (const rawFile of item.files ?? []) {
+		const file = normalizeFile(rawFile, item.type);
+		if (!file) continue;
+		const target = resolveTargetPath(file, item, config);
+		const relative = relativePath(cwd, target);
+		if (!pathExists(target)) {
+			logger.warn(`${relative}: not installed`);
+			changed++;
+			continue;
+		}
+		const local = await readTextFile(target);
+		const remote = transformContent(file.content, config);
+		if (local === remote) {
+			logger.success(`${relative}: up to date`);
+			continue;
+		}
+		changed++;
+		logger.info(`${relative}: differs`);
+		printLineDiff(local, remote);
+	}
+	if (changed === 0) {
+		outro(highlighter.success("No updates found."));
+		return;
+	}
+	outro(highlighter.dim(`Run ${highlighter.info(`npx newtui add ${item.name} --overwrite`)} to update.`));
+}
+function printLineDiff(local, remote) {
+	const a = local.split("\n");
+	const b = remote.split("\n");
+	const max = Math.max(a.length, b.length);
+	const lines = [];
+	let shown = 0;
+	for (let i = 0; i < max && shown < 40; i++) {
+		const left = a[i];
+		const right = b[i];
+		if (left === right) continue;
+		if (left !== void 0) lines.push(highlighter.error(`- ${left}`));
+		if (right !== void 0) lines.push(highlighter.success(`+ ${right}`));
+		shown++;
+	}
+	if (shown >= 40) lines.push(highlighter.dim("... (truncated)"));
+	if (lines.length > 0) logger.log(lines.join("\n"));
+}
+
+//#endregion
+//#region src/tools/tokens.ts
+/**
+* Locate `registry/html/tokens.css` shipped with this package.
+* Works both from `dist/index.js` (published) and `src/tools/tokens.ts` (dev).
+*/
+function getTokensPath() {
+	const here = path.dirname(fileURLToPath(import.meta.url));
+	const candidates = [path.resolve(here, "../registry/html/tokens.css"), path.resolve(here, "../../registry/html/tokens.css")];
+	for (const candidate of candidates) if (pathExists(candidate)) return candidate;
+	throw new Error("Could not locate registry/html/tokens.css in the newt-ui package.");
+}
+/**
+* Extract the `:root { --newt-* }` block from tokens.css, wrapped for Tailwind `@layer base`.
+*/
+async function getTokensCssBlock() {
+	const raw = await readTextFile(getTokensPath());
+	const match = raw.match(/:root\s*\{[\s\S]*?\n\}/);
+	return [
+		"",
+		"/* newt/ui design tokens — source of truth: newt-ui/registry/html/tokens.css */",
+		"@layer base {",
+		(match ? match[0] : raw).split("\n").map((line) => line.length > 0 ? `  ${line}` : line).join("\n"),
+		"",
+		"  .newt-root {",
+		"    font-family: var(--newt-font-sans);",
+		"    color: var(--newt-text-primary);",
+		"    -webkit-font-smoothing: antialiased;",
+		"  }",
+		"}",
+		""
+	].join("\n");
+}
+const TOKENS_MARKER = "--newt-bg-base";
+
+//#endregion
+//#region src/commands/init.ts
+/** The registry item that carries the design tokens. */
+const THEME_ITEM = "theme-newt";
+const UTILS_SOURCE_V4 = `export { cn } from "cn"
+`;
+const UTILS_SOURCE_V3 = `import { type ClassValue, clsx } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
+`;
+async function init(options) {
+	const cwd = resolveCwd(options.cwd);
+	intro(highlighter.bold("newt/ui — init"));
+	await runInit(cwd, await promptForConfig(cwd, options), options);
+	outro(`Success! Project initialization completed. You may now add components: ${highlighter.info("npx newtui add button")}`);
+}
+/**
+* Decide whether this is a React or a Vue project from the config files it
+* has. A Nuxt or Vite config alone is not enough (Vite builds React apps too),
+* so a Next.js config wins first and the bundler check only runs afterwards.
+*/
+async function detectFramework(cwd) {
+	if (findFirstExisting(cwd, NEXT_CONFIG_CANDIDATES)) return "react";
+	if (findFirstExisting(cwd, NUXT_CONFIG_CANDIDATES)) return "vue";
+	const packageJson = await readFileIfExists(path.resolve(cwd, "package.json"));
+	if (packageJson !== null) {
+		if (/"(vue|nuxt)"\s*:/.test(packageJson)) return "vue";
+		if (/"(react|next)"\s*:/.test(packageJson)) return "react";
+	}
+	if (findFirstExisting(cwd, VITE_CONFIG_CANDIDATES)) return "vue";
+	return DEFAULT_FRAMEWORK;
+}
+/** Vue only — Nuxt and Vite need different stylesheet paths and setup steps. */
+function detectBundler(cwd) {
+	if (findFirstExisting(cwd, NUXT_CONFIG_CANDIDATES)) return "nuxt";
+	if (findFirstExisting(cwd, VITE_CONFIG_CANDIDATES)) return "vite";
+	return DEFAULT_BUNDLER;
+}
+function detectCssPath(cwd, framework, bundler, override) {
+	const candidates = framework === "vue" ? CSS_CANDIDATES[bundler ?? "nuxt"] : CSS_CANDIDATES.react;
+	return override ?? findFirstExisting(cwd, candidates) ?? DEFAULT_TAILWIND_CSS[framework];
+}
+function detectTailwindConfig(cwd) {
+	return findFirstExisting(cwd, TAILWIND_CONFIG_CANDIDATES) ?? "tailwind.config.ts";
+}
+/**
+* Build the `components.json` defaults for a framework. Each framework only
+* carries the aliases its registry actually references.
+*/
+function buildDefaults(cwd, framework, bundler, options) {
+	const isVue = framework === "vue";
+	return rawConfigSchema.parse({
+		$schema: "https://newtui.dev/schema.json",
+		style: "default",
+		framework,
+		bundler: isVue ? bundler ?? "nuxt" : void 0,
+		typescript: true,
+		rsc: isVue ? void 0 : true,
+		tailwind: {
+			config: detectTailwindConfig(cwd),
+			css: detectCssPath(cwd, framework, bundler, options.css),
+			baseColor: "neutral",
+			cssVariables: true,
+			prefix: ""
+		},
+		aliases: {
+			components: DEFAULT_COMPONENTS,
+			utils: DEFAULT_UTILS,
+			ui: DEFAULT_UI,
+			lib: DEFAULT_LIB,
+			hooks: isVue ? void 0 : DEFAULT_HOOKS,
+			composables: isVue ? DEFAULT_COMPOSABLES : void 0
+		},
+		iconLibrary: "lucide"
+	});
+}
+async function promptForConfig(cwd, options) {
+	const detectedFramework = options.framework ?? await detectFramework(cwd);
+	const detectedBundler = detectedFramework === "vue" ? options.bundler ?? detectBundler(cwd) : void 0;
+	const defaults = buildDefaults(cwd, detectedFramework, detectedBundler, options);
+	if (options.defaults || options.yes) return defaults;
+	const framework = frameworkSchema.parse(await promptSelect(`Which ${highlighter.info("framework")} are you using?`, [{
+		value: "react",
+		label: "React"
+	}, {
+		value: "vue",
+		label: "Vue"
+	}], defaults.framework));
+	const bundler = framework === "vue" ? bundlerSchema.parse(await promptSelect(`Which ${highlighter.info("build tool")} are you using?`, [{
+		value: "nuxt",
+		label: "Nuxt"
+	}, {
+		value: "vite",
+		label: "Vite"
+	}], detectedBundler ?? "nuxt")) : void 0;
+	const frameworkDefaults = framework === defaults.framework ? defaults : buildDefaults(cwd, framework, bundler, options);
+	const typescript = await promptConfirm(`Would you like to use ${highlighter.info("TypeScript")} (recommended)?`);
+	const rsc = framework === "react" ? await promptConfirm(`Are you using ${highlighter.info("React Server Components")}?`) : void 0;
+	const tailwindConfig = await promptText(`Where is your ${highlighter.info("tailwind.config")} located?`, frameworkDefaults.tailwind.config);
+	const tailwindCss = await promptText(`Where is your ${highlighter.info("global CSS")} file?`, frameworkDefaults.tailwind.css);
+	const components = await promptText(`Configure the import alias for ${highlighter.info("components")}:`, frameworkDefaults.aliases.components);
+	const utils = await promptText(`Configure the import alias for ${highlighter.info("utils")}:`, frameworkDefaults.aliases.utils);
+	const config = rawConfigSchema.parse({
+		...frameworkDefaults,
+		framework,
+		bundler,
+		typescript,
+		rsc,
+		tailwind: {
+			...frameworkDefaults.tailwind,
+			config: tailwindConfig,
+			css: tailwindCss
+		},
+		aliases: {
+			...frameworkDefaults.aliases,
+			components,
+			utils,
+			ui: `${components}/ui`
+		}
+	});
+	if (!await promptConfirm(`Write configuration to ${highlighter.info("components.json")}. Proceed?`)) process.exit(0);
+	return config;
+}
+async function runInit(cwd, rawConfig, options) {
+	const configSpinner = spinner();
+	configSpinner.start("Writing components.json...");
+	const configPath = path.resolve(cwd, CONFIG_FILE_NAME);
+	await writeFileAt(configPath, JSON.stringify(rawConfig, null, 2) + "\n");
+	configSpinner.stop(`Wrote ${highlighter.info(CONFIG_FILE_NAME)}.`);
+	const config = await resolveConfigPaths(cwd, rawConfig);
+	const cssPath = config.resolvedPaths.tailwindCss;
+	const major = await detectTailwindMajor(cwd, cssPath);
+	const utilsSpinner = spinner();
+	utilsSpinner.start("Writing lib/utils...");
+	const utilsExt = config.typescript ? "ts" : "js";
+	const utilsPath = `${config.resolvedPaths.utils}.${utilsExt}`;
+	if (pathExists(utilsPath)) utilsSpinner.stop(`${relativePath(cwd, utilsPath)} already exists, skipped.`);
+	else {
+		const source = major === 4 ? UTILS_SOURCE_V4 : config.typescript ? UTILS_SOURCE_V3 : UTILS_SOURCE_V3.replace("type ClassValue, ", "").replace(": ClassValue[]", "");
+		await writeFileAt(utilsPath, source);
+		utilsSpinner.stop(`Wrote ${highlighter.info(relativePath(cwd, utilsPath))}.`);
+	}
+	const cssSpinner = spinner();
+	cssSpinner.start("Adding newt/ui design tokens to CSS...");
+	const existingCss = await readFileIfExists(cssPath) ?? "";
+	const theme = await fetchTheme(config.framework, options.registry, config.style);
+	if (existingCss.includes("--newt-bg-base")) cssSpinner.stop(`${relativePath(cwd, cssPath)} already contains newt tokens, skipped.`);
+	else {
+		const header = existingCss.length === 0 ? tailwindPreamble(major) : existingCss;
+		await writeFileAt(cssPath, header.replace(/\s*$/, "\n") + await tokensCssBlock(theme, major));
+		cssSpinner.stop(`Added tokens to ${highlighter.info(relativePath(cwd, cssPath))} (Tailwind v${major}).`);
+	}
+	if (!options.skipInstall) {
+		await installDependencies(cwd, major === 4 ? [...PROJECT_DEPENDENCIES_V4] : [...PROJECT_DEPENDENCIES_V3]);
+		logger.success("Installed dependencies.");
+	}
+	printTailwindInstructions(config.framework, config.tailwind.config, major, theme);
+	if (config.framework === "vue") {
+		if ((config.bundler ?? "nuxt") === "nuxt") printNuxtInstructions(config.tailwind.css);
+		else printViteInstructions(config.tailwind.css);
+	}
+}
+/**
+* The theme item carries the tokens in every shape the two Tailwind majors
+* need. It is fetched rather than derived so the values stay defined once, in
+* the registry. An unreachable registry is not fatal: the tokens bundled with
+* this package still cover the raw `--newt-*` variables, which is what a v3
+* project needs, and a v4 project is told what it is missing.
+*/
+async function fetchTheme(framework, registry, style) {
+	try {
+		return await getRegistryItem(getRegistryUrl(framework, registry), style, THEME_ITEM);
+	} catch {
+		return null;
+	}
+}
+async function tokensCssBlock(theme, major) {
+	const rendered = theme ? renderItemCss(theme, major) : "";
+	if (rendered.length > 0) return [
+		"",
+		"/* newt/ui design tokens — source: the newt/ui registry theme item */",
+		rendered
+	].join("\n");
+	return getTokensCssBlock();
+}
+function printTailwindInstructions(framework, tailwindConfig, major, theme) {
+	logger.log(highlighter.bold("Tailwind setup"));
+	if (major === 4) {
+		logger.log(`Nothing else to configure — Tailwind v4 reads the ${highlighter.info("@theme")} block just written to your stylesheet, which is what generates ${highlighter.info("bg-newt-bg-elevated")}, ${highlighter.info("rounded-md")} and the rest.`);
+		if (!theme) logger.warn(`The registry was unreachable, so only the raw ${highlighter.info("--newt-*")} variables were written. Re-run ${highlighter.info("newtui init")} when you are online to add the @theme block.`);
+		return;
+	}
+	const extend = theme?.tailwind?.config?.theme?.extend;
+	if (!extend) {
+		logger.warn(`The registry was unreachable, so the v3 preset could not be printed. Re-run ${highlighter.info("newtui init")} when you are online.`);
+		return;
+	}
+	const content = framework === "vue" ? `["./src/**/*.{vue,ts}"]` : `["./app/**/*.{ts,tsx}", "./components/**/*.{ts,tsx}"]`;
+	logger.log(`Add the newt/ui preset to ${highlighter.info(tailwindConfig)} so utilities like ${highlighter.info("bg-newt-bg-elevated")} and ${highlighter.info("text-newt-brand")} map to the --newt-* tokens:`);
+	logger.log(highlighter.dim(`  import type { Config } from "tailwindcss"
+
+  const newtPreset = {
+    darkMode: ["class"],
+    theme: { extend: ${JSON.stringify(extend, null, 2).split("\n").join("\n    ")} },
+  } satisfies Omit<Config, "content">
+
+  export default {
+    presets: [newtPreset],
+    content: ${content},
+    plugins: [require("tailwindcss-animate")],
+  } satisfies Config`));
+}
+function printNuxtInstructions(css) {
+	logger.log(highlighter.bold("Nuxt setup"));
+	logger.log(`Make sure ${highlighter.info("@nuxtjs/tailwindcss")} is registered and your CSS entry is loaded in ${highlighter.info("nuxt.config.ts")}:`);
+	logger.log(highlighter.dim(`  export default defineNuxtConfig({
+    modules: ["@nuxtjs/tailwindcss"],
+    css: ["~/${css.replace(/^src\//, "")}"],
+  })`));
+	logger.log(highlighter.dim("  Tip: @newtui/nuxt auto-imports every component in your ui directory — see https://newtui.dev"));
+}
+function printViteInstructions(css) {
+	logger.log(highlighter.bold("Vite setup"));
+	logger.log(`Import ${highlighter.info(css)} from your app entry (usually ${highlighter.info("src/main.ts")}).`);
+}
+
+//#endregion
+//#region src/commands/list.ts
+async function list(options) {
+	const cwd = resolveCwd(options.cwd);
+	const config = await getRawConfig(cwd).catch(() => null);
+	const framework = options.framework ?? config?.framework ?? "react";
+	const registryUrl = getRegistryUrl(framework, options.registry ?? config?.registry);
+	const index = await getRegistryIndex(registryUrl);
+	const filter = options.type ?? "registry:ui";
+	const items = index.filter((item) => filter === "all" || item.type === filter);
+	if (options.json) {
+		console.log(JSON.stringify(items, null, 2));
+		return;
+	}
+	intro(highlighter.bold(`Registry: ${registryUrl} (${framework})`));
+	for (const item of items) {
+		const title = item.title ?? item.name;
+		const description = item.description ? highlighter.dim(` — ${item.description}`) : "";
+		logger.log(`${highlighter.info(item.name.padEnd(22))} ${title}${description}`);
+	}
+	outro(highlighter.dim(`${items.length} item(s). Add with: npx newtui add <name>`));
+}
+
+//#endregion
+//#region src/index.ts
+process.on("SIGINT", () => process.exit(0));
+process.on("SIGTERM", () => process.exit(0));
+function getPackageInfo() {
+	const require = createRequire(import.meta.url);
+	const here = path.dirname(fileURLToPath(import.meta.url));
+	for (const candidate of ["../package.json", "../../package.json"]) try {
+		return require(path.resolve(here, candidate));
+	} catch {}
+	return {
+		name: "newtui",
+		version: "0.0.0"
+	};
+}
+/**
+* `newtui --legacy <args>` delegates to the HTML/CSS CLI (cli/index.js),
+* which is also exposed as the `newtui-html` bin.
+*/
+function runLegacy(args) {
+	const here = path.dirname(fileURLToPath(import.meta.url));
+	const legacy = [path.resolve(here, "../cli/index.js"), path.resolve(here, "../../cli/index.js")].find((candidate) => {
+		try {
+			createRequire(import.meta.url).resolve(candidate);
+			return true;
+		} catch {
+			return false;
+		}
+	});
+	if (!legacy) {
+		console.error("Legacy HTML/CSS CLI (cli/index.js) not found in package.");
+		process.exit(1);
+	}
+	spawn(process.execPath, [legacy, ...args], { stdio: "inherit" }).on("exit", (code) => process.exit(code ?? 0));
+}
+function printHelp() {
+	const { version } = getPackageInfo();
+	console.log(`
+  ${highlighter.bold("newtui")} ${highlighter.dim(`v${version}`)}
+  Add Discord-inspired newt/ui components to your React, Vue or Nuxt project.
+
+  ${highlighter.bold("Usage")}
+    $ newtui <command> [options]
+
+  ${highlighter.bold("Commands")}
+    init                     initialize your project and install dependencies
+    add [components...]      add components to your project
+    list                     list available components in the registry
+    diff <component>         check an installed component against the registry
+
+  ${highlighter.bold("Options")}
+    -c, --cwd <dir>          working directory (default: current directory)
+    -r, --registry <url>     registry base url (overrides NEWT_REGISTRY_URL)
+    -y, --yes                skip confirmation prompts
+    -d, --defaults           use the default configuration (init)
+    -f, --framework <name>   the framework to use: react or vue (init, list)
+    -b, --bundler <name>     the Vue build tool: nuxt or vite (init)
+        --css <path>         path to your global css file (init)
+        --skip-install       skip installing dependencies (init, add)
+    -o, --overwrite          overwrite existing files (add)
+    -a, --all                add every available component (add)
+    -p, --path <path>        the path to add the component to (add)
+    -t, --type <type>        filter by registry item type (list)
+        --json               output as JSON (list)
+        --legacy             use the legacy HTML/CSS CLI (same as newtui-html)
+    -h, --help               display this message
+    -v, --version            display the version number
+
+  ${highlighter.bold("Examples")}
+    $ newtui init --defaults
+    $ newtui add button avatar
+    $ newtui list --framework vue
+    $ newtui diff button
+`);
+}
+/**
+* `--framework` used to name the Vue build tool (`nuxt`/`vite`). It now names
+* the UI framework, so those two values are forwarded to `--bundler` instead
+* of being rejected.
+*/
+function readFrameworkFlags(args) {
+	const rawFramework = flagString(args.framework);
+	const rawBundler = flagString(args.bundler);
+	if (rawBundler !== void 0 && !isBundlerName(rawBundler)) throw new Error(`Unknown bundler "${rawBundler}". Expected "nuxt" or "vite".`);
+	if (rawFramework === void 0) return { bundler: rawBundler };
+	if (isFrameworkName(rawFramework)) return {
+		framework: rawFramework,
+		bundler: rawBundler
+	};
+	if (isBundlerName(rawFramework)) {
+		logger.warn(`--framework ${rawFramework} now means the Vue build tool; use --bundler ${rawFramework} instead.`);
+		return {
+			framework: "vue",
+			bundler: rawBundler ?? rawFramework
+		};
+	}
+	throw new Error(`Unknown framework "${rawFramework}". Expected "react" or "vue".`);
+}
+async function main() {
+	const argv = process.argv.slice(2);
+	const legacyIndex = argv.indexOf("--legacy");
+	if (legacyIndex !== -1) {
+		runLegacy(argv.filter((_, index) => index !== legacyIndex));
+		return;
+	}
+	const args = mri(argv, {
+		alias: { ...FLAG_ALIASES },
+		boolean: [...BOOLEAN_FLAGS],
+		string: [...STRING_FLAGS]
+	});
+	const [command, ...rest] = args._;
+	if (flagBoolean(args.version)) {
+		console.log(getPackageInfo().version);
+		return;
+	}
+	if (!command || flagBoolean(args.help)) {
+		printHelp();
+		return;
+	}
+	if (!isCommandName(command)) {
+		logger.error(`Unknown command "${command}".`);
+		printHelp();
+		process.exit(1);
+	}
+	const cwd = flagString(args.cwd) ?? process.cwd();
+	const registry = flagString(args.registry);
+	const yes = flagBoolean(args.yes);
+	const skipInstall = flagBoolean(args["skip-install"]);
+	switch (command) {
+		case "init": {
+			const { framework, bundler } = readFrameworkFlags(args);
+			await init({
+				cwd,
+				yes,
+				defaults: flagBoolean(args.defaults),
+				skipInstall,
+				css: flagString(args.css),
+				framework,
+				bundler,
+				registry
+			});
+			break;
+		}
+		case "add":
+			await add({
+				components: rest,
+				cwd,
+				registry,
+				yes,
+				overwrite: flagBoolean(args.overwrite),
+				all: flagBoolean(args.all),
+				path: flagString(args.path),
+				skipInstall
+			});
+			break;
+		case "list": {
+			const { framework } = readFrameworkFlags(args);
+			await list({
+				cwd,
+				registry,
+				framework,
+				type: flagString(args.type),
+				json: flagBoolean(args.json)
+			});
+			break;
+		}
+		case "diff": await diff({
+			component: rest[0],
+			cwd,
+			registry
+		});
+	}
+}
+main().catch(handleError);
+
+//#endregion
+export {  };