@aristobyte-ui/cli 2.13.2 → 2.14.0

package/commands/init.js

@@ -0,0 +1,130 @@
+import { execa } from 'execa';
+import { select, text, spinner } from "@clack/prompts";
+import color from "picocolors";
+const TEMPLATES = [
+    {
+        id: "aristobyte-ui-template-nextjs-15-app-router",
+        name: "Next App Router",
+        desc: "A Next.js 15 with app-router directory template pre-configured with AristoByteUI.",
+        repo: "https://github.com/aristobyte-team/aristobyte-ui-template-nextjs-15-app-router.git",
+    },
+    {
+        id: "aristobyte-ui-template-nextjs-15-pages",
+        name: "Next Pages",
+        desc: "A Next.js 15 with pages directory template pre-configured with AristoByteUI.",
+        repo: "https://github.com/aristobyte-team/aristobyte-ui-template-nextjs-15-pages.git",
+    },
+    {
+        id: "aristobyte-ui-template-vite",
+        name: "Vite",
+        desc: "A Vite template pre-configured with AristoByteUI.",
+        repo: "https://github.com/aristobyte-team/aristobyte-ui-template-vite.git",
+    },
+    {
+        id: "aristobyte-ui-template-vike",
+        name: "Vike",
+        desc: "A Vike template pre-configured with AristoByteUI.",
+        repo: "https://github.com/aristobyte-team/aristobyte-ui-template-vike.git",
+    },
+    {
+        id: "aristobyte-ui-template-astro",
+        name: "Astro",
+        desc: "An Astro template pre-configured with AristoByteUI.",
+        repo: "https://github.com/aristobyte-team/aristobyte-ui-template-astro.git",
+    },
+    {
+        id: "aristobyte-ui-template-rsbuild",
+        name: "RS Build",
+        desc: "An RS Build template pre-configured with AristoByteUI.",
+        repo: "https://github.com/aristobyte-team/aristobyte-ui-template-rsbuild.git",
+    },
+];
+const PACKAGE_MANAGERS = ["npm", "yarn", "pnpm", "bun"];
+const DEFAULT_NAME = "aristobyte-ui-app";
+export async function init(myProjectName, options) {
+    if (options.listTemplates) {
+        console.log(`${color.cyan("Available templates:")}
+${TEMPLATES.map((t) => `${color.green("◇")} ${t.id.split("aristobyte-ui-template-")[1]} - ${color.gray(t.desc)}`).join("\n")}`);
+        process.exit(0);
+    }
+    if (options.listPackageManagers) {
+        console.log(`${color.cyan("Available package managers:")}
+${PACKAGE_MANAGERS.map((pm) => `${color.green("◇")} ${pm}`).join("\n")}`);
+        process.exit(0);
+    }
+    console.log(color.cyan("┌  Create a new project"));
+    let projectName = myProjectName || DEFAULT_NAME;
+    if (!myProjectName) {
+        projectName = (await text({
+            message: "New project name (Enter to skip with default name)",
+            placeholder: DEFAULT_NAME,
+            defaultValue: DEFAULT_NAME,
+        }));
+    }
+    else {
+        console.log(`${color.gray("│")}
+${color.green("◇")}  ${color.white("Your project name is:")}
+${color.gray("│")}  ${color.green(projectName)}`);
+    }
+    let template = TEMPLATES.find((t) => t.id ===
+        `aristobyte-ui-template-${options?.template?.toLowerCase()?.replaceAll(" ", "")}`);
+    if (!template) {
+        const templateIndex = await select({
+            message: "Select a template (Enter to select)",
+            options: TEMPLATES.map((t, i) => ({
+                value: i.toString(),
+                label: `${t.name} (${t.desc})`,
+            })),
+        });
+        template = TEMPLATES[Number(templateIndex)];
+    }
+    else {
+        console.log(`${color.gray("│")}
+${color.green("◇")}  ${color.white("Template selected:")}
+${color.gray("│")}  ${color.green(template.name)}`);
+    }
+    let packageManager = PACKAGE_MANAGERS.find((pm) => pm.toLowerCase() === options.packageManager?.toLowerCase());
+    if (!packageManager) {
+        const packageManagerIndex = await select({
+            message: "Select a package manager (Enter to select)",
+            options: PACKAGE_MANAGERS.map((pm, i) => ({
+                value: i.toString(),
+                label: pm,
+            })),
+        });
+        packageManager = PACKAGE_MANAGERS[Number(packageManagerIndex)];
+    }
+    else {
+        console.log(`${color.gray("│")}
+${color.green("◇")}  ${color.white("Package manager selected:")}
+${color.gray("│")}  ${color.green(packageManager)}`);
+    }
+    console.log(`${color.gray("│")}
+${color.green("◇")}  ${color.cyan("Template created successfully!")}
+${color.gray("│")}`);
+    const s = spinner();
+    try {
+        s.start(`Preparing '${template.name}' with ${packageManager} configuration...`);
+        await execa("git", [
+            "clone",
+            "--branch",
+            packageManager,
+            "--single-branch",
+            template.repo,
+            projectName,
+        ], { stdio: "ignore" });
+        await execa("rm", ["-rf", ".git"], { cwd: projectName, stdio: "ignore" });
+        s.stop(`${color.green("✔ Project initialized successfully!")}`);
+        console.log(`
+${color.gray("│")}
+${color.green("◇")}  ${color.cyan("To get started:")}
+${color.gray("│")}
+${color.gray("├─")} ${color.white("cd " + projectName)}
+${color.gray("├─")} ${color.white(`${packageManager} install`)}
+${color.gray("├─")} ${color.white(`${packageManager} run dev`)}`);
+    }
+    catch (err) {
+        s.stop();
+        console.error(color.red("× Failed to initialize project"), err);
+    }
+}

package/commands/list.js

@@ -0,0 +1,95 @@
+import fs from 'fs';
+import color from 'picocolors';
+import { getCurrentPackageManager } from '../utils/getCurrentPackageManager.js';
+export async function remoteList() { }
+export async function list(options, endBlock) {
+    let handled = false;
+    if (options.all) {
+        handled = true;
+        const url = 'https://registry.npmjs.org/-/org/aristobyte-ui/package';
+        const omit = ['cli', 'react'];
+        try {
+            const res = await fetch(url);
+            if (!res.ok)
+                throw new Error(`Registry request failed: ${res.status}`);
+            const data = await res.json();
+            const packages = Object.keys(data)
+                .map((dep) => dep.split('/')[1])
+                .filter((dep) => !omit.includes(dep))
+                .sort();
+            console.log(`${color.green('◇')}  ${color.white('Listing AristoByteUI packages:')}
+${packages.map((dep) => `${color.gray('|')}   ${color.cyan(dep)}`).join('\n')}`);
+        }
+        catch (err) {
+            console.error(color.red('× Failed to fetch package list from npm registry'));
+            console.error(color.dim(String(err)));
+        }
+        if (endBlock)
+            console.log(color.green('◇'));
+        process.exit(0);
+    }
+    if (options.installed) {
+        handled = true;
+        try {
+            const pkgJson = JSON.parse(fs.readFileSync('package.json', 'utf-8'));
+            const deps = pkgJson.dependencies || {};
+            const aristobyteDeps = Object.keys(deps)
+                .filter((d) => d.startsWith('@aristobyte-ui/'))
+                .map((dep) => (dep.includes('react') ? 'all' : dep.split('/')[1]));
+            console.log(`${color.green('◇')}  ${color.white('Listing installed AristoByteUI packages:')}
+${aristobyteDeps.map((dep) => `${color.gray('|')}   ${color.cyan(dep)}`).join('\n')}`);
+        }
+        catch (err) {
+            console.error(color.red('× Failed to list packages'), err);
+        }
+        if (endBlock)
+            console.log(color.green('◇'));
+        process.exit(0);
+    }
+    if (options.outdated) {
+        handled = true;
+        const packagesToUpdate = [];
+        try {
+            const pkgJson = JSON.parse(fs.readFileSync('package.json', 'utf-8'));
+            const deps = pkgJson.dependencies || {};
+            const installed = Object.keys(deps).filter((d) => d.startsWith('@aristobyte-ui/'));
+            if (installed.length === 0) {
+                console.log(color.yellow('No AristoByteUI packages installed.'));
+                process.exit(0);
+            }
+            console.log(`${color.green('◇')}  ${color.white('Checking for outdated AristoByteUI packages...')}`);
+            for (const pkg of installed) {
+                const localVersion = deps[pkg].replace(/^[^\d]*/, '');
+                const registryUrl = `https://registry.npmjs.org/${pkg}`;
+                try {
+                    const res = await fetch(registryUrl);
+                    if (!res.ok)
+                        throw new Error(`Registry request failed: ${res.status}`);
+                    const data = await res.json();
+                    const latest = data['dist-tags']?.latest;
+                    if (!latest)
+                        continue;
+                    if (latest !== localVersion) {
+                        const p = pkg.replace('@aristobyte-ui/', '');
+                        packagesToUpdate.push([p, latest]);
+                        console.log(`${color.gray('|')}   ${color.cyan(p)} ` + `${color.red(localVersion)} → ${color.green(latest)}`);
+                    }
+                }
+                catch (err) {
+                    console.error(color.red(`× Failed to check ${pkg} on npm registry`), err);
+                }
+            }
+        }
+        catch (err) {
+            console.error(color.red('× Failed to check outdated packages'), err);
+        }
+        const pkgManager = getCurrentPackageManager();
+        if (endBlock)
+            console.log(`${color.gray('|')}
+${color.green('◇')}  ${packagesToUpdate.length > 0 ? color.gray(`Tip: run '${pkgManager} upgrade ${packagesToUpdate.map((p) => `${p[0]}@${p[1]}`).join(' ')}'`) : color.green('✔ Everything is up to date!')}`);
+        process.exit(0);
+    }
+    if (!handled) {
+        console.log(color.gray("No option provided. Use 'aristobyte-ui list --help' for usage."));
+    }
+}

package/commands/remove.js

@@ -0,0 +1,46 @@
+import { getCurrentPackageManager } from '../utils/getCurrentPackageManager.js';
+import { spinner, text } from '@clack/prompts';
+import { execa } from 'execa';
+import color from 'picocolors';
+import { list } from './list.js';
+export async function remove(component, options) {
+    if (options.list) {
+        await list({ installed: true }, true);
+    }
+    const pkgManager = getCurrentPackageManager();
+    if (options.packageManager) {
+        console.log(`${color.cyan('Current package manager:')}
+${color.green('◇')} ${pkgManager}`);
+        process.exit(0);
+    }
+    const s = spinner();
+    let packageName;
+    if (!component) {
+        console.log(`${color.green('◇')}  ${color.white('You did not specify, which package should be removed')}
+${color.gray('|')}   ${color.gray('Please select one of the installed packages below to proceed.')}
+${color.gray('|')}`);
+        await list({ installed: true });
+        packageName = (await text({
+            message: `Component name to remove (Required filled)`,
+            placeholder: '<package-name>',
+        }));
+    }
+    else {
+        packageName = component;
+    }
+    if (!packageName) {
+        console.log(color.red(`Invalid Package name. <package-name> should be specified:\naristobyte-ui remove <package-name>`));
+        return;
+    }
+    try {
+        const pkgName = packageName === 'all' ? '@aristobyte-ui/react' : `@aristobyte-ui/${packageName}`;
+        s.start(`Removing ${pkgName}...`);
+        await execa(pkgManager, ['remove', pkgName], { stdio: 'inherit' });
+        s.stop();
+        console.log(color.green(`✔ ${pkgName} removed successfully!`));
+    }
+    catch (err) {
+        s.stop();
+        console.error(color.red(`× Failed to remove component ${packageName}`), err);
+    }
+}

package/commands/upgrade.js

@@ -0,0 +1,38 @@
+import { getCurrentPackageManager } from '../utils/getCurrentPackageManager.js';
+import { spinner } from '@clack/prompts';
+import { execa } from 'execa';
+import color from 'picocolors';
+export async function upgrade(component, options) {
+    if (!component && !options.all) {
+        console.error(color.red('× No component specified for upgrade.'));
+        console.log(color.gray("Use: 'aristobyte-ui upgrade <component>' or 'aristobyte-ui upgrade --all'"));
+        process.exit(0);
+    }
+    const s = spinner();
+    const pkgManager = getCurrentPackageManager();
+    try {
+        const isAll = options.all || component === 'all';
+        const targets = isAll ? ['@aristobyte-ui/react'] : component ? [`@aristobyte-ui/${component}`] : [];
+        if (targets.length === 0) {
+            console.error(color.red('× No component specified for upgrade.'));
+            console.log(color.gray('Use: aristobyte-ui upgrade <component> or --all'));
+            process.exit(1);
+        }
+        const versionSuffix = options.to ? `@${options.to}` : '';
+        const sLabel = isAll ? 'Upgrading all AristoByteUI components...' : `Upgrading ${targets.join(', ')}...`;
+        s.start(sLabel);
+        for (const pkg of targets) {
+            const fullSpecifier = `${pkg}${versionSuffix}`;
+            await execa(pkgManager, ['upgrade', fullSpecifier], {
+                stdio: 'inherit',
+            });
+        }
+        s.stop();
+        console.log(color.green(`✔ Upgrade complete${options.to ? ` → version ${options.to}` : ''}!`));
+    }
+    catch (err) {
+        s.stop();
+        console.error(color.red(`× Upgrade failed.`));
+        console.error(color.dim(String(err)));
+    }
+}

package/index.js

@@ -0,0 +1,140 @@
+#!/usr/bin/env node
+import { Command } from 'commander';
+import { readFileSync } from 'fs';
+import { resolve, dirname } from 'path';
+import { fileURLToPath } from 'url';
+import { add } from './commands/add.js';
+import { init } from './commands/init.js';
+import { remove } from './commands/remove.js';
+import { upgrade } from './commands/upgrade.js';
+import { list } from './commands/list.js';
+import { doctor } from './commands/doctor.js';
+import { env } from './commands/env.js';
+import { logoSmallGradient, logo3, logo4, darkGrey, lightGrey } from './utils/colors.js';
+import { usage } from './utils/typography.js';
+import { parseHelp } from './utils/parseHelp.js';
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+const pkgPath = resolve(__dirname, '../package.json');
+const pkg = JSON.parse(readFileSync(pkgPath, 'utf-8'));
+const COMMANDS = ['init', 'add', 'remove', 'upgrade', 'list', 'doctor', 'env', 'help'];
+const aristobyteui = new Command();
+aristobyteui
+    .name('aristobyte-ui')
+    .usage(usage(['command', 'options']))
+    .description('Create new AristoByteUI projects or manage existing projects with full control\n  over components, dependencies, and UI stack configuration. Supports initialization,\n  addition, removal, upgrading of components, and project diagnostics.')
+    .version(pkg.version ?? '0.0.0', '-V, --version', 'Output the CLI version')
+    .helpOption('-H, --help', 'Show help information')
+    .configureHelp({
+    formatHelp: (cmd, helper) => parseHelp(cmd, helper),
+});
+aristobyteui
+    .command('init [myProjectName]')
+    .usage(usage(['options', 'myProjectName']))
+    .description('Initialize a new AristoByteUI project')
+    .option('-LT, --list-templates', 'Display a list of available templates')
+    .option('-LPM, --list-package-managers', 'Display a list of available package managers')
+    .option('-T, --template <templateName>', 'Specify a template to use')
+    .option('-P, --package-manager <packageManager>', 'Select a package manager (npm, yarn, pnpm, bun)')
+    .configureHelp({
+    formatHelp: (cmd, helper) => parseHelp(cmd, helper),
+})
+    .action(init);
+aristobyteui
+    .command('add [component]')
+    .usage(usage(['options', 'components...']))
+    .description('Add a UI component')
+    .option('-L, --list', 'Display a list of available packages, to be added')
+    .option('-P, --package-manager', 'Show the package manager used in current project')
+    .configureHelp({
+    formatHelp: (cmd, helper) => parseHelp(cmd, helper),
+})
+    .action(add);
+aristobyteui
+    .command('remove [component]')
+    .usage(usage(['options', 'components...']))
+    .description('Remove a UI component')
+    .option('-L, --list', 'Display a list of installed packages, to be removed')
+    .option('-P, --package-manager', 'Show the package manager used in current project')
+    .configureHelp({
+    formatHelp: (cmd, helper) => parseHelp(cmd, helper),
+})
+    .action(remove);
+aristobyteui
+    .command('upgrade [component]')
+    .usage(usage(['options', 'components...']))
+    .description('Upgrade a UI component')
+    .option('-A, --all', 'Upgrade all AristoByteUI components')
+    .option('-T, --to <version>', 'Upgrade to a specific version')
+    .configureHelp({
+    formatHelp: (cmd, helper) => parseHelp(cmd, helper),
+})
+    .action(upgrade);
+aristobyteui
+    .command('list')
+    .usage(usage(['options']))
+    .description('List installed components')
+    .option('-A, --all', 'Display the list of all packages')
+    .option('-I, --installed', 'Display the list of installed packages')
+    .option('-O, --outdated', 'Check for available updates')
+    .configureHelp({
+    formatHelp: (cmd, helper) => parseHelp(cmd, helper),
+})
+    .action((options) => list(options, true));
+aristobyteui
+    .command('doctor')
+    .usage(usage(['options']))
+    .description('Check system and project health')
+    .option('-A, --all', 'Run all diagnostics')
+    .option('-C, --configs', 'Validate project config files')
+    .option('-D, --deps', 'Validate installed AristoByteUI dependencies')
+    .option('-J, --json', 'Output diagnostics as JSON')
+    .option('-N, --network', 'Verify registry/network connectivity')
+    .option('-P, --pm', 'Check package manager state')
+    .option('-S, --system', 'Check system environment')
+    .configureHelp({
+    formatHelp: (cmd, helper) => parseHelp(cmd, helper),
+})
+    .action(doctor);
+aristobyteui
+    .command('env')
+    .usage(usage(['options']))
+    .description('Display environment info')
+    .option('-A, --all', 'Display all environment diagnostics')
+    .option('-J, --json', 'Output environment info as JSON')
+    .option('-M, --pm', 'Show package manager details')
+    .option('-N, --network', 'Check registry/network connectivity')
+    .option('-P, --packages', 'Show installed AristoByteUI packages')
+    .option('-S, --system', 'Show system information')
+    .configureHelp({
+    formatHelp: (cmd, helper) => parseHelp(cmd, helper),
+})
+    .action(env);
+aristobyteui
+    .command('help')
+    .usage(usage(['options']))
+    .description('Display help for command')
+    .action(env);
+aristobyteui.command('help', { hidden: true });
+aristobyteui.exitOverride(async (err) => {
+    if (err.code === 'commander.unknownCommand') {
+        console.error(logoSmallGradient(' ◆ Possible commands are: \n'), ...COMMANDS.map((cmd) => cmd === err.message.split('Did you mean ')[1].split('?')[0]
+            ? `${logoSmallGradient('│  ')}${logo4('● aristobyte-ui')} ${logo4(`${cmd}`)}\n`
+            : `${logoSmallGradient('│  ○ aristobyte-ui')} ${logo3(`${cmd}`)}\n`));
+    }
+    process.exit(1);
+});
+(async () => {
+    const args = process.argv.slice(2);
+    if (args.length === 0) {
+        aristobyteui.outputHelp();
+        process.exit(0);
+    }
+    try {
+        await aristobyteui.parseAsync(args, { from: 'user' });
+    }
+    catch (err) {
+        console.error(darkGrey('Error:'), lightGrey(err.message));
+        process.exit(1);
+    }
+})();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@aristobyte-ui/cli",
   "description": "The official AristoByteUI CLI — initialize projects, install, upgrade, remove, and manage UI components seamlessly.",
-  "version": "2.13.2",
+  "version": "2.14.0",
   "license": "MIT",
   "private": false,
   "author": "AristoByte <info@aristobyte.com>",
@@ -30,39 +30,24 @@
     "project-bootstrap",
     "package-management"
   ],
-  "files": [
-    "es",
-    "lib",
-    "bin"
-  ],
   "publishConfig": {
     "access": "public"
   },
-  "main": "lib/index.js",
-  "module": "es/index.js",
-  "types": "es/index.d.ts",
+  "type": "module",
+  "main": "index.js",
   "bin": {
-    "aristobyte-ui": "dist/index.js"
-  },
-  "peerDependencies": {
-    "react": "^19.1.0",
-    "react-dom": "^19.1.0",
-    "sass": "^1.97.3"
+    "aristobyte-ui": "index.js"
   },
   "dependencies": {
     "@clack/prompts": "^0.11.0",
-    "axios": "^1.6.0",
     "chalk": "^4.1.2",
     "commander": "^10",
     "execa": "^7",
     "gradient-string": "^3.0.0"
   },
   "exports": {
-    ".": {
-      "types": "./es/index.d.ts",
-      "import": "./es/index.js",
-      "require": "./lib/index.js"
-    },
+    ".": "./index.js",
     "./package.json": "./package.json"
-  }
+  },
+  "types": "index.d.ts"
 }

package/utils/checkVersion.js

@@ -0,0 +1,8 @@
+import { compareVersions } from "./compareVersions.js";
+import color from "picocolors";
+export function checkVersion(name, version, minVersion) {
+    if (version === "unknown" || compareVersions(version, minVersion) < 0) {
+        return color.red(`× ${name} >= ${minVersion} required`);
+    }
+    return color.green(`✔ ${version}`);
+}

package/utils/colors.js

@@ -0,0 +1,58 @@
+import chalk from "chalk";
+import gradient from "gradient-string";
+const LOGO_COLORS = ["#ffee27", "#fec800", "#f18e35", "#e95f32", "#e2312d"];
+export function logo1(text) {
+    return chalk.hex(LOGO_COLORS[0])(text);
+}
+export function logo2(text) {
+    return chalk.hex(LOGO_COLORS[1])(text);
+}
+export function logo3(text) {
+    return chalk.hex(LOGO_COLORS[2])(text);
+}
+export function logo4(text) {
+    return chalk.hex(LOGO_COLORS[3])(text);
+}
+export function logo5(text) {
+    return chalk.hex(LOGO_COLORS[4])(text);
+}
+export function reset(text) {
+    return chalk.reset(text);
+}
+export function red(text) {
+    return chalk.redBright(text);
+}
+export function lightGrey(text) {
+    return chalk.hex("#afbfff")(text);
+}
+export function darkGrey(text) {
+    return chalk.hex("#7580aa")(text);
+}
+export function white(text) {
+    return chalk.hex("#cfd5edff")(text);
+}
+export function yellow(text) {
+    return chalk.yellow(text);
+}
+export function redBright(text) {
+    return chalk.redBright(text);
+}
+export function logoGradient(text) {
+    return gradient([
+        ...LOGO_COLORS,
+        ...LOGO_COLORS.reverse(),
+        ...LOGO_COLORS,
+        ...LOGO_COLORS.reverse(),
+        ...LOGO_COLORS,
+    ]).multiline(text);
+}
+export function logoSmallGradient(text) {
+    return gradient([
+        LOGO_COLORS[0],
+        LOGO_COLORS[1],
+        LOGO_COLORS[1],
+        LOGO_COLORS[0],
+        LOGO_COLORS[0],
+        LOGO_COLORS[1],
+    ]).multiline(text);
+}

package/{es/utils → utils}/compareVersions.js

@@ -1,7 +1,7 @@
 export function compareVersions(v1, v2) {
-    var a = v1.replace(/^v/, "").split(".").map(Number);
-    var b = v2.replace(/^v/, "").split(".").map(Number);
-    for (var i = 0; i < 3; i++) {
+    const a = v1.replace(/^v/, "").split(".").map(Number);
+    const b = v2.replace(/^v/, "").split(".").map(Number);
+    for (let i = 0; i < 3; i++) {
         if (a[i] > b[i])
             return 1;
         if (a[i] < b[i])