@sanity/ui 4.0.0-v4.1 → 5.0.0-alpha.2

package/dist/cli/index.js

@@ -0,0 +1,69 @@
+import { resolve } from 'node:path';
+import process from 'node:process';
+import { parseArgs } from 'node:util';
+import { runDoctor } from './doctor.js';
+import { runInit } from './init.js';
+import { color, fail, info } from './log.js';
+import { readSelfPackage } from './selfPackage.js';
+const HELP = `${color.bold('@sanity/ui')} setup CLI
+
+${color.bold('Usage')}
+  npx @sanity/ui@alpha <command> [options]
+
+${color.bold('Commands')}
+  init      Scaffold a correct Sanity UI install (deps, stylesheet, tsconfig)
+  doctor    Check an existing setup and report fixes
+
+${color.bold('Options')}
+  --dry        Print the plan and exit without changing anything (init)
+  --yes, -y    Accept every prompt with its default (non-interactive)
+  --cwd <dir>  Run against another directory (default: current directory)
+  --version    Print the CLI version
+  --help, -h   Show this help
+`;
+/**
+ * Parses arguments and dispatches to a command. `parseArgs` runs in strict mode,
+ * so an unknown flag throws from here and is caught by the bin wrapper. Exit
+ * codes: 0 on success or an explicit `--help`, 1 on misuse (no or unknown command).
+ */
+export async function main(argv) {
+    const { values, positionals } = parseArgs({
+        args: argv,
+        allowPositionals: true,
+        options: {
+            dry: { type: 'boolean', default: false },
+            yes: { type: 'boolean', short: 'y', default: false },
+            cwd: { type: 'string' },
+            version: { type: 'boolean', default: false },
+            help: { type: 'boolean', short: 'h', default: false },
+        },
+    });
+    if (values.version) {
+        info(readSelfPackage().version ?? 'unknown');
+        return 0;
+    }
+    const command = positionals[0];
+    if (values.help) {
+        info(HELP);
+        return 0;
+    }
+    if (!command) {
+        info(HELP);
+        return 1;
+    }
+    const options = {
+        dry: values.dry ?? false,
+        yes: values.yes ?? false,
+        cwd: values.cwd ? resolve(process.cwd(), values.cwd) : process.cwd(),
+    };
+    switch (command) {
+        case 'init':
+            return runInit(options);
+        case 'doctor':
+            return runDoctor(options);
+        default:
+            fail(`Unknown command: ${command}`);
+            info(HELP);
+            return 1;
+    }
+}

package/dist/cli/init.js

@@ -0,0 +1,189 @@
+import { basename } from 'node:path';
+import process from 'node:process';
+import { verifyAfterInit } from './checks.js';
+import { buildConfig, CONFIG_FILE, configExists, writeConfig } from './config.js';
+import { detect, LEGACY_COEXISTENCE_HINT, PACKAGE_NAME } from './detect.js';
+import { printChecks } from './doctor.js';
+import { installCommand, resolveInstallSpecs, resolveTypeSpecs, runInstall } from './install.js';
+import { color, confirm, fail, heading, info, step, success, warn } from './log.js';
+import { inspectStylesheet, STYLES_SPECIFIER, wireStylesheet } from './styles.js';
+import { inspectTsconfig, reconcileTsconfig } from './tsconfig.js';
+import { meetsNode, meetsReact, NODE_REQUIREMENT, REACT_MIN } from './versions.js';
+/**
+ * Prints the React and Node checks. Missing React only warns, since the user may
+ * be scaffolding before installing it; an out-of-range React or Node sets
+ * `blocking`. `blocking` never hard-stops init. It only triggers a louder warning
+ * before the apply confirmation, so the user stays in control either way.
+ */
+function reportPrereqs({ react }) {
+    let blocking = false;
+    const reactVersion = react.version;
+    if (!reactVersion) {
+        warn(`React not detected. This package needs React >= ${REACT_MIN}.`);
+    }
+    else if (meetsReact(reactVersion)) {
+        success(`React ${reactVersion} meets the >= ${REACT_MIN} requirement.`);
+    }
+    else {
+        warn(`React ${reactVersion} is below ${REACT_MIN}. Components may not render correctly.`);
+        info(`  ${color.dim('fix:')} Upgrade React to >= ${REACT_MIN}`);
+        blocking = true;
+    }
+    const nodeVersion = process.versions.node;
+    if (meetsNode(nodeVersion)) {
+        success(`Node ${nodeVersion} meets the ${NODE_REQUIREMENT} requirement.`);
+    }
+    else {
+        warn(`Node ${nodeVersion} is outside ${NODE_REQUIREMENT}. Install may behave unexpectedly.`);
+        info(`  ${color.dim('fix:')} Use Node ${NODE_REQUIREMENT}`);
+        blocking = true;
+    }
+    return { blocking };
+}
+function parseReactMajor(version) {
+    const match = typeof version === 'string' ? version.match(/\d+/) : null;
+    return match ? Number(match[0]) : 19;
+}
+function buildPlan(cwd, detected) {
+    const specs = resolveInstallSpecs();
+    const { command, args } = installCommand(detected.packageManager, specs);
+    const reactMajor = parseReactMajor(detected.react.version);
+    const typeSpecs = detected.typescript ? resolveTypeSpecs(cwd, { reactMajor }) : [];
+    const stylesheet = inspectStylesheet(cwd, detected.entry);
+    const tsconfig = detected.typescript ? inspectTsconfig(cwd) : null;
+    return { specs, typeSpecs, install: `${command} ${args.join(' ')}`, stylesheet, tsconfig };
+}
+function printPlan(cwd, detected, plan) {
+    heading('Plan');
+    step(`Install: ${color.bold(plan.install)}`);
+    if (plan.typeSpecs.length > 0) {
+        step(`Dev types: ${color.bold(plan.typeSpecs.join(' '))}`);
+    }
+    if (plan.stylesheet.imported) {
+        step(`Stylesheet: already imported in ${plan.stylesheet.importedIn ?? detected.entry}`);
+    }
+    else if (plan.stylesheet.exists) {
+        step(`Stylesheet: add ${color.bold(`import '${STYLES_SPECIFIER}'`)} to ${detected.entry}`);
+    }
+    else {
+        step(`Stylesheet: entry ${detected.entry} not found, will skip (add the import manually)`);
+    }
+    if (!detected.typescript || !plan.tsconfig) {
+        step('tsconfig: no TypeScript detected, skipping');
+    }
+    else if (!plan.tsconfig.exists) {
+        step('tsconfig: create tsconfig.json with required options');
+    }
+    else if (plan.tsconfig.changes.length === 0) {
+        step('tsconfig: already has required options');
+    }
+    else {
+        const summary = plan.tsconfig.changes.map((c) => c.key).join(', ');
+        step(`tsconfig: update ${basename(plan.tsconfig.file)} (${summary})`);
+    }
+    step(configExists(cwd) ? `${CONFIG_FILE}: overwrite` : `${CONFIG_FILE}: create`);
+}
+/**
+ * The init lifecycle: detect the project, report prerequisites, build and print
+ * the plan, confirm, apply each step, then verify. `--dry` stops after the plan;
+ * `--yes` accepts the confirmation without prompting.
+ */
+export async function runInit(options) {
+    const { cwd, dry, yes } = options;
+    const detected = detect(cwd);
+    heading('Sanity UI init');
+    info(color.dim(`framework: ${detected.framework} · package manager: ${detected.packageManager} · entry: ${detected.entry} · typescript: ${detected.typescript}`));
+    if (detected.aliasedInstall) {
+        fail(`This project installs v5 under the alias "${detected.aliasedInstall}". init is for new apps only.`);
+        info(`  ${color.dim('fix:')} ${LEGACY_COEXISTENCE_HINT}`);
+        return 1;
+    }
+    if (detected.legacyInstall) {
+        fail(`This project already has ${PACKAGE_NAME}@${detected.legacyInstall} (pre-v5). init is for new apps only.`);
+        info(`  ${color.dim('fix:')} ${LEGACY_COEXISTENCE_HINT}`);
+        return 1;
+    }
+    heading('Requirements');
+    const { blocking } = reportPrereqs(detected);
+    const plan = buildPlan(cwd, detected);
+    printPlan(cwd, detected, plan);
+    if (dry) {
+        info('');
+        info(color.dim('Dry run: no changes made.'));
+        return 0;
+    }
+    if (blocking) {
+        info('');
+        warn('Some requirements are unmet (see above). Continuing may not work.');
+    }
+    // Without a TTY there's no one to answer the prompt, so confirm() falls back to
+    // the default (apply). Say so explicitly rather than appearing to act silently;
+    // --dry is the preview-only path for anyone who doesn't want writes.
+    if (!yes && !process.stdin.isTTY) {
+        info('');
+        info(color.dim('Non-interactive (no TTY): applying automatically. Use --dry to preview.'));
+    }
+    const proceed = await confirm('\nApply these changes?', { defaultValue: true, assumeYes: yes });
+    if (!proceed) {
+        info('Aborted. No changes made.');
+        return 0;
+    }
+    heading('Applying');
+    step(`Installing with ${detected.packageManager}…`);
+    const install = runInstall(cwd, detected.packageManager, plan.specs);
+    if (install.ok) {
+        success('Dependencies installed.');
+    }
+    else if (install.reason === 'spawn') {
+        warn(`Could not run ${detected.packageManager}: ${install.message ?? 'unknown error'}`);
+        info(`  ${color.dim('fix:')} Install manually: ${install.command} ${install.args.join(' ')}`);
+    }
+    else {
+        warn(`Install exited with code ${install.status ?? 'unknown'}.`);
+        info(`  ${color.dim('hint:')} This is usually a peer-dependency conflict. Re-run the install and read the conflict, or retry with your package manager's legacy peer-deps flag.`);
+    }
+    if (plan.typeSpecs.length > 0) {
+        step('Installing React type definitions…');
+        const typeInstall = runInstall(cwd, detected.packageManager, plan.typeSpecs, { dev: true });
+        if (typeInstall.ok)
+            success('Type definitions installed.');
+        else
+            warn(`Could not install ${plan.typeSpecs.join(' ')}. Add them manually.`);
+    }
+    if (plan.stylesheet.exists && !plan.stylesheet.imported) {
+        const wired = wireStylesheet(cwd, detected.entry, { dryRun: false });
+        if (wired.wrote)
+            success(`Imported the stylesheet in ${detected.entry}.`);
+    }
+    else if (plan.stylesheet.imported) {
+        success('Stylesheet already imported.');
+    }
+    else {
+        warn(`Could not find ${detected.entry}. Add \`import '${STYLES_SPECIFIER}'\` manually.`);
+    }
+    if (detected.typescript) {
+        const result = reconcileTsconfig(cwd, { dryRun: false });
+        if (result.created)
+            success('Created tsconfig.json with required options.');
+        else if (result.unreadable)
+            warn('tsconfig.json could not be parsed; left untouched.');
+        else if (result.changes.length === 0)
+            success('tsconfig already has the required options.');
+        else
+            success(`Updated tsconfig: ${result.changes.map((c) => c.key).join(', ')}.`);
+    }
+    const config = buildConfig({ framework: detected.framework, entry: detected.entry });
+    writeConfig(cwd, config);
+    success(`Wrote ${CONFIG_FILE}.`);
+    heading('Verifying');
+    const results = verifyAfterInit(cwd);
+    printChecks(results);
+    const failed = results.filter((c) => c.status === 'fail');
+    info('');
+    if (failed.length === 0) {
+        success('Setup verified. Import components from @sanity/ui and start building.');
+        return 0;
+    }
+    fail(`${failed.length} check${failed.length === 1 ? '' : 's'} failed. Run \`npx ${PACKAGE_NAME}@alpha doctor\` for details.`);
+    return 1;
+}

package/dist/cli/install.js

@@ -0,0 +1,78 @@
+import { spawnSync } from 'node:child_process';
+import process from 'node:process';
+import { isPackageInstalled, PACKAGE_NAME } from './detect.js';
+import { readSelfPackage } from './selfPackage.js';
+const ICONS = '@sanity/icons';
+const DEV_FLAG = {
+    npm: '--save-dev',
+    pnpm: '-D',
+    yarn: '-D',
+    bun: '-d',
+};
+/** Strips range operators to the exact floor version, e.g. "^3.7.4" -> "3.7.4". */
+function exactFromRange(range) {
+    if (typeof range !== 'string')
+        return null;
+    const match = range.match(/\d+\.\d+\.\d+(?:-[\w.]+)?/);
+    return match ? match[0] : null;
+}
+/**
+ * Builds the exact specs to install from this package's own manifest: the
+ * package at its shipped version, and icons at the version it declares in
+ * dependencies. Nothing here is invented.
+ *
+ * Icons is already a dependency, so the package manager installs it either way.
+ * It is listed explicitly because apps import icons directly to pass to
+ * components (`<Button iconStart={AddIcon} />`), and under pnpm an import that
+ * isn't in the app's own package.json doesn't resolve. Dependencies the app
+ * never imports itself (react-refractor, clsx) are left to the package manager.
+ * React/react-dom are peers that belong to the host app, so they are left out
+ * too (the prereq check verifies them).
+ */
+export function resolveInstallSpecs() {
+    const self = readSelfPackage();
+    const deps = self.dependencies ?? {};
+    const specs = [`${PACKAGE_NAME}@${self.version ?? 'latest'}`];
+    const iconsVersion = exactFromRange(deps[ICONS]);
+    specs.push(iconsVersion ? `${ICONS}@${iconsVersion}` : ICONS);
+    return specs;
+}
+/**
+ * The React type packages a TypeScript project needs to type-check JSX and the
+ * component props. Only the ones not already installed are returned, pinned to
+ * the project's React major (defaulting to the supported React 19).
+ */
+export function resolveTypeSpecs(cwd, { reactMajor = 19 } = {}) {
+    const major = Number.isInteger(reactMajor) ? reactMajor : 19;
+    return ['@types/react', '@types/react-dom']
+        .filter((name) => !isPackageInstalled(cwd, name))
+        .map((name) => `${name}@^${major}`);
+}
+export function installCommand(packageManager, specs, { dev = false } = {}) {
+    const verb = packageManager === 'npm' ? 'install' : 'add';
+    const flags = dev ? [DEV_FLAG[packageManager]] : [];
+    return { command: packageManager, args: [verb, ...flags, ...specs] };
+}
+/**
+ * Runs the install with inherited stdio. Returns a structured result so the
+ * caller can explain a peer-dependency conflict in plain language instead of
+ * failing silently.
+ */
+export function runInstall(cwd, packageManager, specs, { dev = false } = {}) {
+    const { command, args } = installCommand(packageManager, specs, { dev });
+    // On Windows the package managers are .cmd shims, and spawning them without a
+    // shell throws (ENOENT, or EINVAL since the Node .cmd security fix). The args
+    // are package specs we build ourselves, so there is nothing to escape.
+    const result = spawnSync(command, args, {
+        cwd,
+        stdio: 'inherit',
+        shell: process.platform === 'win32',
+    });
+    if (result.error) {
+        return { ok: false, reason: 'spawn', message: result.error.message, command, args };
+    }
+    if (result.status !== 0) {
+        return { ok: false, reason: 'exit', status: result.status, command, args };
+    }
+    return { ok: true, command, args };
+}

package/dist/cli/log.js

@@ -0,0 +1,66 @@
+import process from 'node:process';
+import readline from 'node:readline/promises';
+// Colorize only a real terminal, and honor the NO_COLOR convention (https://no-color.org).
+const noColor = process.env['NO_COLOR'] !== undefined;
+const supportsColor = process.stdout.isTTY && !noColor;
+function paint(code, text) {
+    if (!supportsColor)
+        return text;
+    return `\u001b[${code}m${text}\u001b[0m`;
+}
+export const color = {
+    bold: (t) => paint('1', t),
+    dim: (t) => paint('2', t),
+    red: (t) => paint('31', t),
+    green: (t) => paint('32', t),
+    yellow: (t) => paint('33', t),
+    blue: (t) => paint('34', t),
+    cyan: (t) => paint('36', t),
+};
+export function info(message) {
+    process.stdout.write(`${message}\n`);
+}
+export function step(message) {
+    process.stdout.write(`${color.cyan('›')} ${message}\n`);
+}
+export function success(message) {
+    process.stdout.write(`${color.green('✓')} ${message}\n`);
+}
+export function warn(message) {
+    process.stdout.write(`${color.yellow('!')} ${message}\n`);
+}
+export function fail(message) {
+    process.stdout.write(`${color.red('✗')} ${message}\n`);
+}
+/** Real errors (unexpected exceptions) go to stderr; report output uses fail(). */
+export function errorLine(message) {
+    // Gate color on stderr (where this writes), not stdout, so a redirected stderr
+    // doesn't receive ANSI codes while stdout is still a TTY.
+    const mark = process.stderr.isTTY && !noColor ? '\u001b[31m✗\u001b[0m' : '✗';
+    process.stderr.write(`${mark} ${message}\n`);
+}
+export function heading(message) {
+    process.stdout.write(`\n${color.bold(message)}\n`);
+}
+/**
+ * Ask a yes/no question. In non-interactive contexts (no TTY) it resolves to
+ * the provided default so CI and agents never block.
+ */
+export async function confirm(question, options = {}) {
+    const { defaultValue = true, assumeYes = false } = options;
+    if (assumeYes || !process.stdin.isTTY)
+        return defaultValue;
+    const rl = readline.createInterface({ input: process.stdin, output: process.stdout });
+    try {
+        const hint = defaultValue ? 'Y/n' : 'y/N';
+        const answer = (await rl.question(`${question} ${color.dim(`(${hint})`)} `))
+            .trim()
+            .toLowerCase();
+        if (answer === '')
+            return defaultValue;
+        return answer === 'y' || answer === 'yes';
+    }
+    finally {
+        rl.close();
+    }
+}

package/dist/cli/selfPackage.js

@@ -0,0 +1,11 @@
+import { readFileSync } from 'node:fs';
+/**
+ * Reads this package's own package.json so the CLI installs the exact version
+ * it ships with and the real declared ranges, never invented ones. The path is
+ * two levels up from both src/cli (dev) and dist/cli (published), which both
+ * resolve to the package root.
+ */
+export function readSelfPackage() {
+    const url = new URL('../../package.json', import.meta.url);
+    return JSON.parse(readFileSync(url, 'utf8'));
+}

package/dist/cli/styles.js

@@ -0,0 +1,185 @@
+import { existsSync, readdirSync, readFileSync, statSync, writeFileSync } from 'node:fs';
+import { dirname, join, relative } from 'node:path';
+export const STYLES_SPECIFIER = '@sanity/ui/styles.css';
+const IMPORT_LINE = `import '${STYLES_SPECIFIER}'`;
+// Match a real import/require of the stylesheet, not a bare mention. A
+// commented-out or string occurrence of the path must not count as "wired",
+// or doctor/init would report success when the import isn't active.
+const SPEC = String.raw `@sanity/ui/styles\.css`;
+const PRESENT = new RegExp(String.raw `(?:^|\n)\s*import\s+(?:[^\n'"]*\bfrom\s+)?['"]${SPEC}['"]` +
+    String.raw `|\brequire\(\s*['"]${SPEC}['"]\s*\)`);
+const SOURCE_EXT = /\.[jt]sx?$|\.astro$/;
+const SKIP_DIRS = new Set([
+    'node_modules',
+    'dist',
+    'build',
+    '.next',
+    '.react-router',
+    '.git',
+    'out',
+]);
+const SOURCE_ROOTS = ['src', 'app', 'pages', 'components'];
+const MAX_FILES = 800;
+export function hasStylesImport(content) {
+    return PRESENT.test(content);
+}
+function fileImports(file) {
+    try {
+        return hasStylesImport(readFileSync(file, 'utf8'));
+    }
+    catch {
+        return false;
+    }
+}
+/** Bounded recursive walk that returns the first source file importing the stylesheet. */
+function findImportInDir(root, budget) {
+    const stack = [root];
+    while (stack.length > 0 && budget.count < MAX_FILES) {
+        const dir = stack.pop();
+        if (dir === undefined)
+            break;
+        let entries;
+        try {
+            entries = readdirSync(dir, { withFileTypes: true });
+        }
+        catch {
+            continue;
+        }
+        for (const entry of entries) {
+            const full = join(dir, entry.name);
+            if (entry.isDirectory()) {
+                if (!SKIP_DIRS.has(entry.name))
+                    stack.push(full);
+            }
+            else if (SOURCE_EXT.test(entry.name)) {
+                budget.count++;
+                if (budget.count > MAX_FILES)
+                    break;
+                if (fileImports(full))
+                    return full;
+            }
+        }
+    }
+    return null;
+}
+/**
+ * Reports whether the stylesheet is imported. The import only needs to exist
+ * once in the module graph, so beyond the prescribed entry we scan the project
+ * source roots (bounded) before reporting it missing. That catches imports
+ * placed in App.tsx, a route file, or a layout component.
+ */
+export function inspectStylesheet(cwd, entry) {
+    const file = join(cwd, entry);
+    const exists = existsSync(file);
+    if (exists && fileImports(file))
+        return { entry, file, exists, imported: true };
+    const budget = { count: 0 };
+    const roots = new Set([dirname(entry), ...SOURCE_ROOTS].map((r) => join(cwd, r)));
+    for (const root of Array.from(roots)) {
+        if (!existsSync(root))
+            continue;
+        try {
+            if (!statSync(root).isDirectory())
+                continue;
+        }
+        catch {
+            continue;
+        }
+        const found = findImportInDir(root, budget);
+        if (found)
+            return {
+                entry,
+                file,
+                exists,
+                imported: true,
+                importedIn: relative(cwd, found),
+            };
+    }
+    return { entry, file, exists, imported: false };
+}
+function isDirective(line) {
+    const trimmed = line.trim();
+    return /^['"]use (client|server|strict)['"];?$/.test(trimmed);
+}
+function isImportLine(line) {
+    return /^\s*import\b/.test(line);
+}
+/**
+ * True when an import statement finishes on this line: either it ends with a
+ * `from '...'` clause or it is a bare side-effect `import '...'`. Used to find
+ * the real end of an import block so we never split a multiline import.
+ */
+function importStatementEnds(line) {
+    const t = line.trim();
+    return /\bfrom\s*['"][^'"]+['"];?\s*$/.test(t) || /^import\s+['"][^'"]+['"];?\s*$/.test(t);
+}
+/** Inserts the import into a JS/TS module after any leading directive + import block. */
+function injectIntoModule(content) {
+    const lines = content.split('\n');
+    let insertAt = 0;
+    while (insertAt < lines.length) {
+        const line = lines[insertAt] ?? '';
+        if (isDirective(line) || line.trim() === '')
+            insertAt++;
+        else
+            break;
+    }
+    // Track the last line that closes an import statement so a multiline import
+    // (`import {\n  a,\n} from 'x'`) is treated as a single unit and we insert
+    // after its closing line, never between its lines.
+    let lastImport = -1;
+    let inMultilineImport = false;
+    for (let i = insertAt; i < lines.length; i++) {
+        const line = lines[i] ?? '';
+        if (inMultilineImport) {
+            if (importStatementEnds(line)) {
+                inMultilineImport = false;
+                lastImport = i;
+            }
+            continue;
+        }
+        if (isImportLine(line)) {
+            lastImport = i;
+            if (!importStatementEnds(line))
+                inMultilineImport = true;
+        }
+        else if (line.trim() !== '' && lastImport !== -1) {
+            break;
+        }
+    }
+    const at = lastImport === -1 ? insertAt : lastImport + 1;
+    lines.splice(at, 0, IMPORT_LINE);
+    return lines.join('\n');
+}
+/** Inserts the import inside an Astro frontmatter fence, creating one if absent. */
+function injectIntoAstro(content) {
+    if (content.startsWith('---')) {
+        const end = content.indexOf('\n---', 3);
+        if (end !== -1) {
+            const head = content.slice(0, end);
+            const tail = content.slice(end);
+            return `${head}\n${IMPORT_LINE}${tail}`;
+        }
+    }
+    return `---\n${IMPORT_LINE}\n---\n${content}`;
+}
+export function wireStylesheet(cwd, entry, { dryRun = false } = {}) {
+    const file = join(cwd, entry);
+    if (!existsSync(file))
+        return { entry, file, missing: true, imported: false, wrote: false };
+    const content = readFileSync(file, 'utf8');
+    if (hasStylesImport(content)) {
+        return {
+            entry,
+            file,
+            missing: false,
+            imported: true,
+            wrote: false,
+            already: true,
+        };
+    }
+    const next = entry.endsWith('.astro') ? injectIntoAstro(content) : injectIntoModule(content);
+    if (!dryRun)
+        writeFileSync(file, next);
+    return { entry, file, missing: false, imported: true, wrote: !dryRun };
+}

package/dist/cli/test-utils.js

@@ -0,0 +1,8 @@
+import { mkdirSync, writeFileSync } from 'node:fs';
+import { join } from 'node:path';
+import { PACKAGE_NAME } from './detect.js';
+export function writeInstalledUiVersion(dir, version) {
+    const root = join(dir, 'node_modules', PACKAGE_NAME);
+    mkdirSync(root, { recursive: true });
+    writeFileSync(join(root, 'package.json'), JSON.stringify({ name: PACKAGE_NAME, version }));
+}