@roboticela/devkit 3.0.0 → 4.1.0

package/README.md

@@ -180,6 +180,12 @@ devkit init
 Install one or more components into the current project.
 
 ```bash
+# Interactive — browse the registry for your template, multi-select, then pick variants when needed
+devkit add
+
+# Same as above but only print what would be installed
+devkit add --dry-run
+
 # Single component
 devkit add auth
 
@@ -196,6 +202,8 @@ devkit add auth@2.0.0
 devkit add auth --dry-run
 ```
 
+**Interactive mode** (no component names): DevKit loads components from the registry filtered by your template in `devkit.config.json`, excludes anything already in `devkit.lock.json`, and opens a terminal multiselect (space to toggle, enter to confirm). For each selected package that has variants, you get a follow-up prompt unless you passed `--variant=<id>` and that id exists for that component.
+
 **What happens under the hood:**
 
 1. Resolves the component version (latest unless pinned)
@@ -365,6 +373,10 @@ devkit install
 Stop DevKit from tracking a component without deleting its files. After ejecting, the files become entirely yours — no more updates via `devkit update`.
 
 ```bash
+# Interactive — multiselect from installed components (from devkit.lock.json)
+devkit eject
+
+# Eject one component by name
 devkit eject auth
 ```
 

package/dist/commands/add.js

@@ -1,27 +1,126 @@
 import ora from "ora";
 import chalk from "chalk";
+import { intro, outro, multiselect, select, isCancel } from "@clack/prompts";
 import { readConfig, isComponentInstalled } from "../lib/config.js";
 import { installComponent } from "../lib/installer.js";
+import { listComponents } from "../lib/registry.js";
 import { log } from "../lib/logger.js";
+/** `undefined` = no variant; string = chosen id; `"cancel"` = user aborted */
+async function pickVariantForComponent(meta, optsVariant) {
+    if (!meta.hasVariants || !meta.variants?.length)
+        return undefined;
+    if (meta.variants.length === 1)
+        return meta.variants[0].id;
+    if (optsVariant) {
+        const match = meta.variants.find((v) => v.id === optsVariant);
+        if (match)
+            return match.id;
+    }
+    const v = await select({
+        message: `Variant for ${meta.name}`,
+        options: meta.variants.map((x) => ({
+            value: x.id,
+            label: x.label,
+            hint: x.description,
+        })),
+    });
+    if (isCancel(v))
+        return "cancel";
+    return v;
+}
+async function interactiveAddSelections(config, opts, cwd) {
+    let all;
+    try {
+        all = await listComponents(config.template);
+    }
+    catch (e) {
+        log.error(`Could not reach registry: ${e.message}`);
+        log.info("Check DEVKIT_REGISTRY or start the registry locally (see repo README).");
+        return null;
+    }
+    const installable = all.filter((c) => !isComponentInstalled(c.name, cwd));
+    if (installable.length === 0) {
+        log.info("Every component from the registry for your template is already installed.");
+        return [];
+    }
+    console.log();
+    intro(chalk.cyan("Add components"));
+    const pickedRaw = await multiselect({
+        message: "Select components to install (space to toggle, enter to confirm)",
+        options: installable.map((c) => ({
+            value: c.name,
+            label: c.name,
+            hint: c.description.length > 64 ? `${c.description.slice(0, 61)}…` : c.description,
+        })),
+        required: false,
+    });
+    if (isCancel(pickedRaw)) {
+        outro("Cancelled.");
+        return [];
+    }
+    const picked = pickedRaw;
+    if (picked.length === 0) {
+        outro("No components selected.");
+        return [];
+    }
+    const results = [];
+    for (const compName of picked) {
+        const meta = installable.find((x) => x.name === compName);
+        const variant = await pickVariantForComponent(meta, opts.variant);
+        if (variant === "cancel") {
+            outro("Cancelled.");
+            return [];
+        }
+        results.push({ name: compName, version: "latest", variant });
+    }
+    return results;
+}
 export async function addCommand(names, opts, cwd = process.cwd()) {
     const config = readConfig(cwd);
-    for (const nameAtVersion of names) {
-        const [name, version = "latest"] = nameAtVersion.split("@");
+    const usedInteractive = names.length === 0;
+    let todo;
+    if (usedInteractive) {
+        const picked = await interactiveAddSelections(config, opts, cwd);
+        if (picked === null)
+            return;
+        if (picked.length === 0)
+            return;
+        todo = picked;
+    }
+    else {
+        todo = names.map((nameAtVersion) => {
+            const [name, version = "latest"] = nameAtVersion.split("@");
+            return { name, version, variant: opts.variant };
+        });
+    }
+    let anyOk = false;
+    for (const { name, version, variant } of todo) {
         if (isComponentInstalled(name, cwd)) {
             log.warn(`${name} is already installed. Run 'devkit update ${name}' to update.`);
             continue;
         }
         if (opts.dryRun) {
-            log.info(`[dry-run] Would install: ${chalk.cyan(name)}@${version} (${config.template})`);
+            log.info(`[dry-run] Would install: ${chalk.cyan(name)}@${version} (${config.template})` +
+                (variant ? chalk.dim(` variant=${variant}`) : ""));
+            anyOk = true;
             continue;
         }
         const spinner = ora({ text: `Installing ${chalk.cyan(name)}…`, color: "cyan" }).start();
         try {
-            await installComponent(name, config.template, version, opts.variant, cwd);
+            await installComponent(name, config.template, version, variant, cwd);
             spinner.succeed(chalk.green(`${name}@${version} installed`));
+            anyOk = true;
         }
         catch (e) {
             spinner.fail(chalk.red(`Failed to install ${name}: ${e.message}`));
         }
     }
+    if (usedInteractive) {
+        if (anyOk) {
+            outro(opts.dryRun ? chalk.dim("Dry run complete.") : chalk.green("Done."));
+        }
+        else if (!opts.dryRun) {
+            outro(chalk.yellow("Nothing was installed."));
+        }
+    }
 }

package/dist/commands/eject.d.ts

@@ -0,0 +1 @@
+export declare function ejectCommand(name: string | undefined, cwd?: string): Promise<void>;

package/dist/commands/eject.js

@@ -0,0 +1,60 @@
+import { intro, outro, multiselect, isCancel } from "@clack/prompts";
+import chalk from "chalk";
+import { unlinkSync, existsSync } from "fs";
+import { join } from "path";
+import { readLock, writeLock } from "../lib/config.js";
+import { log } from "../lib/logger.js";
+export async function ejectCommand(name, cwd = process.cwd()) {
+    const lock = readLock(cwd);
+    const installed = Object.keys(lock.components);
+    if (installed.length === 0) {
+        log.info("No installed components to eject.");
+        return;
+    }
+    let toEject;
+    if (name) {
+        if (!(name in lock.components)) {
+            log.warn(`'${name}' is not an installed DevKit component.`);
+            return;
+        }
+        toEject = [name];
+    }
+    else {
+        console.log();
+        intro(chalk.cyan("Eject components"));
+        const picked = await multiselect({
+            message: "Select components to eject (DevKit stops tracking them; files stay on disk — space to toggle, enter to confirm)",
+            options: installed.map((n) => ({
+                value: n,
+                label: n,
+                hint: `v${lock.components[n].version}`,
+            })),
+            required: false,
+        });
+        if (isCancel(picked)) {
+            outro("Cancelled.");
+            return;
+        }
+        const list = picked;
+        if (list.length === 0) {
+            outro("No components selected.");
+            return;
+        }
+        toEject = list;
+    }
+    for (const n of toEject) {
+        if (!(n in lock.components)) {
+            log.warn(`Skipping '${n}' — not in lock file.`);
+            continue;
+        }
+        const manifestPath = join(cwd, ".devkit", `${n}.manifest.json`);
+        if (existsSync(manifestPath))
+            unlinkSync(manifestPath);
+        delete lock.components[n];
+        log.success(`${n} ejected. Files are yours — DevKit will no longer manage them.`);
+    }
+    writeLock(lock, cwd);
+    if (!name) {
+        outro(chalk.green("Done."));
+    }
+}

package/dist/index.js

@@ -9,6 +9,7 @@ import { listCommand } from "./commands/list.js";
 import { infoCommand } from "./commands/info.js";
 import { updateCommand, upgradeAllCommand } from "./commands/update.js";
 import { doctorCommand } from "./commands/doctor.js";
+import { ejectCommand } from "./commands/eject.js";
 import { themeApplyCommand, themePreviewCommand, themePresetCommand, themeSetCommand, themeListCommand, themeAuditCommand, } from "./commands/theme.js";
 const program = new Command();
 program
@@ -36,11 +37,11 @@ program
     .action(() => initCommand());
 // ── devkit add ────────────────────────────────────────────────────────────────
 program
-    .command("add <components...>")
-    .description("Install one or more components (e.g. devkit add auth hero-section)")
-    .option("--variant <id>", "Variant to install for components that have variants")
+    .command("add [components...]")
+    .description("Install components — run with no args for an interactive picker")
+    .option("--variant <id>", "Variant for components with variants (non-interactive or as default when prompting)")
     .option("--dry-run", "Preview what would be installed without writing files")
-    .action((names, opts) => addCommand(names, opts));
+    .action((names, opts) => addCommand(names ?? [], opts));
 // ── devkit remove ─────────────────────────────────────────────────────────────
 program
     .command("remove <name>")
@@ -124,28 +125,18 @@ program
 });
 // ── devkit eject ──────────────────────────────────────────────────────────────
 program
-    .command("eject <name>")
-    .description("Stop DevKit from tracking a component (files are kept, no more updates via DevKit)")
-    .action(async (name) => {
-    const { readLock, writeLock } = await import("./lib/config.js");
-    const { unlinkSync, existsSync } = await import("fs");
-    const { join } = await import("path");
-    const { log } = await import("./lib/logger.js");
-    const manifestPath = join(process.cwd(), ".devkit", `${name}.manifest.json`);
-    if (existsSync(manifestPath))
-        unlinkSync(manifestPath);
-    const lock = readLock();
-    delete lock.components[name];
-    writeLock(lock);
-    log.success(`${name} ejected. Files are yours — DevKit will no longer manage them.`);
-});
+    .command("eject [name]")
+    .description("Stop DevKit from tracking component(s) — run with no args to pick interactively")
+    .action((name) => ejectCommand(name));
 // ── Help footer ───────────────────────────────────────────────────────────────
 program.addHelpText("after", `
 ${chalk.bold("Examples:")}
   ${chalk.cyan("devkit create my-app")}                       Interactive project creation
   ${chalk.cyan("devkit create my-app --template=nextjs-compact --yes")}   Non-interactive
+  ${chalk.cyan("devkit add")}                                 Interactive component picker
   ${chalk.cyan("devkit add auth")}                            Install auth component
   ${chalk.cyan("devkit add hero-section --variant=split-image")}
+  ${chalk.cyan("devkit eject")}                               Pick component(s) to eject
   ${chalk.cyan("devkit theme set colors.primary #e11d48")}   Change primary color
   ${chalk.cyan("devkit doctor")}                              Check configuration
   ${chalk.cyan("devkit list")}                                Browse all components

package/dist/lib/bundled-registry.d.ts

@@ -0,0 +1,18 @@
+import type { ComponentEntry } from "./component-entry.js";
+/** Directory containing `dist/` (the published CLI package root). */
+export declare function getCliPackageRoot(fromImportMetaUrl?: string): string;
+/**
+ * On-disk component payloads: either shipped inside the npm package (`cli/registry/components`)
+ * or the monorepo sibling (`DevKit/registry/components`).
+ */
+export declare function getBundledComponentsDir(fromImportMetaUrl?: string): string | null;
+export declare function listBundledComponents(template: string | undefined, fromImportMetaUrl?: string): ComponentEntry[] | null;
+export declare function getBundledComponentMeta(name: string, fromImportMetaUrl?: string): Record<string, unknown> | null;
+export declare function resolveBundledVersion(name: string, requested: string, fromImportMetaUrl?: string): string | null;
+export declare function getBundledManifest(name: string, template: string, version: string, variant: string | undefined, fromImportMetaUrl?: string): {
+    name: string;
+    template: string;
+    version: string;
+    variant: string | null;
+    manifest: Record<string, unknown>;
+} | null;

package/dist/lib/bundled-registry.js

@@ -0,0 +1,82 @@
+import { readFileSync, existsSync } from "fs";
+import { dirname, join } from "path";
+import { fileURLToPath } from "url";
+/** Directory containing `dist/` (the published CLI package root). */
+export function getCliPackageRoot(fromImportMetaUrl = import.meta.url) {
+    return join(dirname(fileURLToPath(fromImportMetaUrl)), "..", "..");
+}
+/**
+ * On-disk component payloads: either shipped inside the npm package (`cli/registry/components`)
+ * or the monorepo sibling (`DevKit/registry/components`).
+ */
+export function getBundledComponentsDir(fromImportMetaUrl = import.meta.url) {
+    const pkgRoot = getCliPackageRoot(fromImportMetaUrl);
+    const nested = join(pkgRoot, "registry", "components");
+    const sibling = join(pkgRoot, "..", "registry", "components");
+    if (existsSync(join(nested, "registry.json")))
+        return nested;
+    if (existsSync(join(sibling, "registry.json")))
+        return sibling;
+    return null;
+}
+export function listBundledComponents(template, fromImportMetaUrl = import.meta.url) {
+    const root = getBundledComponentsDir(fromImportMetaUrl);
+    if (!root)
+        return null;
+    const index = JSON.parse(readFileSync(join(root, "registry.json"), "utf-8"));
+    const out = [];
+    for (const c of index.components) {
+        if (template && !c.templates.includes(template))
+            continue;
+        const metaPath = join(root, c.name, "component.json");
+        if (!existsSync(metaPath))
+            continue;
+        const meta = JSON.parse(readFileSync(metaPath, "utf-8"));
+        out.push({
+            name: meta.name,
+            displayName: meta.displayName,
+            description: meta.description,
+            category: meta.category,
+            templates: meta.templates,
+            platforms: meta.platforms,
+            hasVariants: meta.hasVariants,
+            variants: meta.variants,
+            latestVersion: meta.versions.latest,
+            tags: meta.tags,
+        });
+    }
+    return out;
+}
+export function getBundledComponentMeta(name, fromImportMetaUrl = import.meta.url) {
+    const root = getBundledComponentsDir(fromImportMetaUrl);
+    if (!root)
+        return null;
+    const path = join(root, name, "component.json");
+    if (!existsSync(path))
+        return null;
+    return JSON.parse(readFileSync(path, "utf-8"));
+}
+export function resolveBundledVersion(name, requested, fromImportMetaUrl = import.meta.url) {
+    const meta = getBundledComponentMeta(name, fromImportMetaUrl);
+    if (!meta)
+        return null;
+    const versions = meta["versions"];
+    if (requested === "latest")
+        return versions.latest;
+    const found = versions.history.find((h) => h.version === requested);
+    return found ? found.version : null;
+}
+export function getBundledManifest(name, template, version, variant, fromImportMetaUrl = import.meta.url) {
+    const root = getBundledComponentsDir(fromImportMetaUrl);
+    if (!root)
+        return null;
+    const resolved = resolveBundledVersion(name, version, fromImportMetaUrl);
+    if (!resolved)
+        return null;
+    const base = join(root, name, template, `v${resolved.split(".")[0]}`);
+    const manifestPath = variant ? join(base, "variants", variant, "manifest.json") : join(base, "manifest.json");
+    if (!existsSync(manifestPath))
+        return null;
+    const manifest = JSON.parse(readFileSync(manifestPath, "utf-8"));
+    return { name, template, version: resolved, variant: variant ?? null, manifest };
+}

package/dist/lib/component-entry.d.ts

@@ -0,0 +1,16 @@
+export interface ComponentEntry {
+    name: string;
+    displayName: string;
+    description: string;
+    category: string;
+    templates: string[];
+    platforms: string[];
+    hasVariants: boolean;
+    variants?: {
+        id: string;
+        label: string;
+        description: string;
+    }[];
+    latestVersion: string;
+    tags: string[];
+}

package/dist/lib/component-entry.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/config.d.ts

@@ -41,6 +41,8 @@ export interface DevKitLock {
         installedAt: string;
     }>;
 }
+/** Stable URL for editors (works before/without the public registry host). */
+export declare const DEVKIT_CONFIG_SCHEMA_URL = "https://raw.githubusercontent.com/Roboticela/DevKit/main/cli/schemas/devkit-config.json";
 export declare function configExists(cwd?: string): boolean;
 export declare function readConfig(cwd?: string): DevKitConfig;
 export declare function writeConfig(config: DevKitConfig, cwd?: string): void;

package/dist/lib/config.js

@@ -2,6 +2,8 @@ import { readFileSync, writeFileSync, existsSync } from "fs";
 import { join } from "path";
 const CONFIG_FILE = "devkit.config.json";
 const LOCK_FILE = "devkit.lock.json";
+/** Stable URL for editors (works before/without the public registry host). */
+export const DEVKIT_CONFIG_SCHEMA_URL = "https://raw.githubusercontent.com/Roboticela/DevKit/main/cli/schemas/devkit-config.json";
 export function configExists(cwd = process.cwd()) {
     return existsSync(join(cwd, CONFIG_FILE));
 }
@@ -32,7 +34,7 @@ export function isComponentInstalled(name, cwd = process.cwd()) {
 }
 export function defaultConfig(template, siteName, siteUrl) {
     return {
-        $schema: "https://registry.devkit.roboticela.com/schemas/devkit-config.json",
+        $schema: DEVKIT_CONFIG_SCHEMA_URL,
         devkit: "1.0",
         template,
         site: { name: siteName, url: siteUrl },

package/dist/lib/installer.js

@@ -4,6 +4,7 @@ import { execSync } from "child_process";
 import { createHash } from "crypto";
 import { x as extractTar } from "tar";
 import { pipeline } from "stream/promises";
+import { getBundledComponentsDir } from "./bundled-registry.js";
 import { getManifest } from "./registry.js";
 import { readLock, writeLock } from "./config.js";
 import { log } from "./logger.js";
@@ -127,14 +128,15 @@ export function removeComponent(name, cwd = process.cwd()) {
 }
 async function downloadComponentFiles(name, template, version, variant, tmpDir) {
     mkdirSync(tmpDir, { recursive: true });
-    // For local development with the registry server, we serve files directly.
-    // In production this would stream a tarball. For now we copy from local registry.
-    const registryDir = join(dirname(new URL(import.meta.url).pathname), "../../../registry/components");
+    // Prefer on-disk payloads (bundled in the npm package or monorepo sibling) before HTTP tarball.
+    const registryDir = getBundledComponentsDir();
     const major = `v${version.split(".")[0]}`;
-    const compDir = variant
-        ? join(registryDir, name, template, major, "variants", variant)
-        : join(registryDir, name, template, major);
-    if (existsSync(compDir)) {
+    const compDir = registryDir
+        ? variant
+            ? join(registryDir, name, template, major, "variants", variant)
+            : join(registryDir, name, template, major)
+        : "";
+    if (compDir && existsSync(compDir)) {
         cpSync(compDir, tmpDir, { recursive: true });
     }
     else {

package/dist/lib/registry.d.ts

@@ -1,19 +1,5 @@
-export interface ComponentEntry {
-    name: string;
-    displayName: string;
-    description: string;
-    category: string;
-    templates: string[];
-    platforms: string[];
-    hasVariants: boolean;
-    variants?: {
-        id: string;
-        label: string;
-        description: string;
-    }[];
-    latestVersion: string;
-    tags: string[];
-}
+import type { ComponentEntry } from "./component-entry.js";
+export type { ComponentEntry };
 export declare function listComponents(template?: string): Promise<ComponentEntry[]>;
 export declare function getComponentInfo(name: string): Promise<Record<string, unknown>>;
 export declare function getManifest(name: string, template: string, version?: string, variant?: string): Promise<{

package/dist/lib/registry.js

@@ -1,3 +1,4 @@
+import { getBundledComponentMeta, getBundledManifest, listBundledComponents, } from "./bundled-registry.js";
 const REGISTRY_URL = process.env.DEVKIT_REGISTRY ?? "https://registry.devkit.roboticela.com";
 async function get(path) {
     const res = await fetch(`${REGISTRY_URL}${path}`);
@@ -6,14 +7,23 @@ async function get(path) {
     return res.json();
 }
 export async function listComponents(template) {
+    const local = listBundledComponents(template);
+    if (local)
+        return local;
     const qs = template ? `?template=${template}` : "";
     const data = await get(`/api/v1/components${qs}`);
     return data.components;
 }
 export async function getComponentInfo(name) {
+    const local = getBundledComponentMeta(name);
+    if (local)
+        return local;
     return get(`/api/v1/components/${name}`);
 }
 export async function getManifest(name, template, version = "latest", variant) {
+    const local = getBundledManifest(name, template, version, variant);
+    if (local)
+        return local;
     const qs = new URLSearchParams({ template, version });
     if (variant)
         qs.set("variant", variant);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@roboticela/devkit",
-  "version": "3.0.0",
+  "version": "4.1.0",
   "description": "Roboticela DevKit CLI — scaffold, extend, and theme full-stack projects with one command",
   "type": "module",
   "bin": {
@@ -53,6 +53,8 @@
   },
   "files": [
     "dist",
-    "README.md"
+    "README.md",
+    "registry",
+    "schemas"
   ]
 }

package/registry/components/auth/component.json

@@ -0,0 +1,29 @@
+{
+  "name": "auth",
+  "displayName": "Authentication",
+  "description": "Complete authentication system: email/password login, registration, email verification, forgot/reset password, and Google OAuth.",
+  "category": "authentication",
+  "icon": "lock",
+  "author": "Roboticela",
+  "license": "MIT",
+  "tags": ["auth", "login", "register", "oauth", "jwt", "email"],
+  "templates": ["nextjs-compact", "vite-express-tauri"],
+  "platforms": ["web", "desktop"],
+  "hasVariants": false,
+  "versions": {
+    "latest": "1.0.0",
+    "stable": "1.0.0",
+    "history": [
+      { "version": "1.0.0", "releaseDate": "2026-04-05", "breaking": false }
+    ]
+  },
+  "requiredConfig": ["site.name", "site.url"],
+  "optionalConfig": [
+    "auth.google.clientId",
+    "auth.google.clientSecret",
+    "auth.smtp.host",
+    "auth.smtp.port",
+    "auth.smtp.user",
+    "auth.smtp.password"
+  ]
+}