@tokiui/cli 0.2.1 → 0.3.1

package/dist/index.js

@@ -189,20 +189,34 @@ var initCommand = new import_commander.Command("init").description("Initialize t
   spinner.start("Setting up global CSS");
   const globalsAbsPath = import_path2.default.join(cwd, answers.globalsPath);
   await import_fs_extra2.default.ensureDir(import_path2.default.dirname(globalsAbsPath));
-  let css = import_fs_extra2.default.existsSync(globalsAbsPath) ? await import_fs_extra2.default.readFile(globalsAbsPath, "utf-8") : "";
-  const prepend = [];
-  if (!css.includes('@import "tailwindcss"') && !css.includes("@import 'tailwindcss'")) {
-    prepend.push('@import "tailwindcss";');
-  }
-  if (!css.includes("@tokiui/ui/styles.css")) {
-    prepend.push('@import "@tokiui/ui/styles.css";');
-  }
-  if (prepend.length > 0) {
-    css = prepend.join("\n") + "\n\n" + css;
-    await import_fs_extra2.default.writeFile(globalsAbsPath, css);
-    spinner.succeed(`globals.css updated (${answers.globalsPath})`);
-  } else {
+  const TOKIUI_CSS = '@import "tailwindcss";\n@import "@tokiui/ui/styles.css";\n';
+  const existingCss = import_fs_extra2.default.existsSync(globalsAbsPath) ? await import_fs_extra2.default.readFile(globalsAbsPath, "utf-8") : "";
+  if (existingCss.includes("@tokiui/ui/styles.css")) {
     spinner.succeed("globals.css already configured");
+  } else if (!existingCss.trim()) {
+    await import_fs_extra2.default.writeFile(globalsAbsPath, TOKIUI_CSS);
+    spinner.succeed(`globals.css created (${answers.globalsPath})`);
+  } else {
+    const isStarterTheme = /@media\s*\(\s*prefers-color-scheme\s*:\s*dark\s*\)/.test(existingCss) || /@theme\s+inline/.test(existingCss);
+    if (isStarterTheme) {
+      await import_fs_extra2.default.writeFile(globalsAbsPath + ".bak", existingCss);
+      await import_fs_extra2.default.writeFile(globalsAbsPath, TOKIUI_CSS);
+      spinner.succeed("globals.css set up \u2014 tokiui now owns the theme");
+      console.log(
+        import_kleur.default.dim(`  Replaced the starter theme (saved a copy to ${import_path2.default.basename(globalsAbsPath)}.bak).`)
+      );
+    } else {
+      const lead = [];
+      if (!existingCss.includes('@import "tailwindcss"') && !existingCss.includes("@import 'tailwindcss'")) {
+        lead.push('@import "tailwindcss";');
+      }
+      lead.push('@import "@tokiui/ui/styles.css";');
+      await import_fs_extra2.default.writeFile(globalsAbsPath, lead.join("\n") + "\n\n" + existingCss);
+      spinner.succeed(`globals.css updated (${answers.globalsPath})`);
+      console.log(
+        import_kleur.default.dim("  Note: remove any :root / @theme / prefers-color-scheme rules that conflict with tokiui tokens.")
+      );
+    }
   }
   spinner.start("Checking TypeScript path aliases");
   const tsconfigPath = import_path2.default.join(cwd, "tsconfig.json");
@@ -266,11 +280,12 @@ function resolveRegistryRef() {
     }
     return envRef;
   }
-  return `cli-v${"0.2.1"}`;
+  return `cli-v${"0.3.1"}`;
 }
 var REGISTRY_REF = resolveRegistryRef();
 var REGISTRY_BASE = `${ALLOWED_FETCH_ORIGIN}${REGISTRY_REF}/packages/registry`;
 var SOURCE_BASE = `${ALLOWED_FETCH_ORIGIN}${REGISTRY_REF}/packages/ui/src`;
+var BLOCK_BASE = `${ALLOWED_FETCH_ORIGIN}${REGISTRY_REF}/apps/docs/src/registry/blocks`;
 async function safeFetch(url) {
   if (!url.startsWith(ALLOWED_FETCH_ORIGIN)) {
     throw new Error(
@@ -358,6 +373,31 @@ async function fetchComponentSource(name, file) {
   if (!res.ok) throw new Error(`Failed to fetch source for ${name}/${file}`);
   return res.text();
 }
+function assertRegistryBlock(data) {
+  const obj = data;
+  const valid = typeof data === "object" && data !== null && typeof obj.name === "string" && Array.isArray(obj.files) && Array.isArray(obj.dependencies) && Array.isArray(obj.registryDependencies) && obj.files.every((f) => typeof f === "string") && obj.dependencies.every((d) => typeof d === "string") && obj.registryDependencies.every((d) => typeof d === "string");
+  if (!valid) {
+    throw new Error(
+      `Received an invalid block definition for "${String(obj.name ?? "unknown")}" from the registry.`
+    );
+  }
+}
+async function fetchBlock(name) {
+  assertSafeComponentName(name);
+  const res = await safeFetch(`${BLOCK_BASE}/${name}/block.json`);
+  if (res.status === 404) return null;
+  if (!res.ok) throw new Error(`Failed to fetch block "${name}": ${res.statusText}`);
+  const data = await res.json();
+  assertRegistryBlock(data);
+  return data;
+}
+async function fetchBlockSource(name, file) {
+  assertSafeComponentName(name);
+  assertSafeFilePath(file);
+  const res = await safeFetch(`${BLOCK_BASE}/${name}/${file}`);
+  if (!res.ok) throw new Error(`Failed to fetch source for block ${name}/${file}`);
+  return res.text();
+}
 
 // src/utils/transforms.ts
 function transformImports(source, libDir) {
@@ -370,14 +410,14 @@ var addCommand = new import_commander2.Command("add").description("Add a compone
   const config = getConfig(cwd);
   if (!config) {
     console.log(
-      import_kleur2.default.red("No tokiui.json found. Run `npx tokiui init` first.")
+      import_kleur2.default.red("No tokiui.json found. Run `npx @tokiui/cli init` first.")
     );
     process.exit(1);
   }
   const libAlias = config.libAlias ?? `@/${config.libDir}`;
   let componentName = componentArg;
   if (!componentName) {
-    const spinner = (0, import_ora2.default)("Fetching component list...").start();
+    const spinner = (0, import_ora2.default)("Fetching registry...").start();
     const index = await fetchRegistryIndex().catch(() => {
       spinner.fail("Failed to fetch registry");
       process.exit(1);
@@ -386,8 +426,11 @@ var addCommand = new import_commander2.Command("add").description("Add a compone
     const answer = await (0, import_prompts2.default)({
       type: "multiselect",
       name: "components",
-      message: "Which components would you like to add?",
-      choices: index.components.map((c) => ({ title: c.label, value: c.name })),
+      message: "Which components or blocks would you like to add?",
+      choices: [
+        ...index.components.map((c) => ({ title: c.label, value: c.name })),
+        ...(index.blocks ?? []).map((b) => ({ title: `${b.label}  \xB7  block`, value: b.name }))
+      ],
       min: 1
     });
     if (!answer.components?.length) {
@@ -396,12 +439,20 @@ var addCommand = new import_commander2.Command("add").description("Add a compone
     }
     const visited = /* @__PURE__ */ new Set();
     for (const name of answer.components) {
-      await installComponent(name, cwd, config.componentsDir, libAlias, visited);
+      await install(name, cwd, config.componentsDir, libAlias, visited);
     }
     return;
   }
-  await installComponent(componentName, cwd, config.componentsDir, libAlias, /* @__PURE__ */ new Set());
+  await install(componentName, cwd, config.componentsDir, libAlias, /* @__PURE__ */ new Set());
 });
+async function install(name, cwd, componentsDir, libAlias, visited) {
+  const block = await fetchBlock(name).catch(() => null);
+  if (block) {
+    await installBlock(block, cwd, componentsDir, libAlias, visited);
+    return;
+  }
+  await installComponent(name, cwd, componentsDir, libAlias, visited);
+}
 async function installComponent(name, cwd, componentsDir, libAlias, visited) {
   if (visited.has(name)) return;
   visited.add(name);
@@ -457,6 +508,61 @@ async function installComponent(name, cwd, componentsDir, libAlias, visited) {
   }
   spinner.succeed(`Added ${import_kleur2.default.bold(name)}`);
 }
+async function installBlock(block, cwd, componentsDir, libAlias, visited) {
+  const spinner = (0, import_ora2.default)(`Adding block ${block.name}...`).start();
+  if (block.registryDependencies.length > 0) {
+    spinner.stop();
+    for (const dep of block.registryDependencies) {
+      await installComponent(dep, cwd, componentsDir, libAlias, visited);
+    }
+    spinner.start(`Adding block ${block.name}...`);
+  }
+  const blockDir = import_path3.default.join(import_path3.default.dirname(componentsDir), "blocks", block.name);
+  for (const file of block.files) {
+    try {
+      assertSafeFilePath(file);
+    } catch (err) {
+      spinner.fail(`Security: ${err instanceof Error ? err.message : String(err)}`);
+      process.exit(1);
+    }
+    const source = await fetchBlockSource(block.name, file);
+    const transformed = transformImports(source, libAlias);
+    const destPath = import_path3.default.join(cwd, blockDir, file);
+    if (import_fs_extra3.default.existsSync(destPath)) {
+      spinner.stop();
+      const { overwrite } = await (0, import_prompts2.default)({
+        type: "confirm",
+        name: "overwrite",
+        message: `${import_path3.default.join(blockDir, file)} already exists. Overwrite?`,
+        initial: false
+      });
+      if (!overwrite) {
+        console.log(import_kleur2.default.dim(`Skipped ${file}`));
+        spinner.start(`Adding block ${block.name}...`);
+        continue;
+      }
+      spinner.start(`Adding block ${block.name}...`);
+    }
+    await import_fs_extra3.default.ensureDir(import_path3.default.dirname(destPath));
+    await import_fs_extra3.default.writeFile(destPath, transformed);
+  }
+  if (block.dependencies.length > 0) {
+    for (const dep of block.dependencies) {
+      try {
+        assertSafeDependency(dep);
+      } catch (err) {
+        spinner.fail(`Security: ${err instanceof Error ? err.message : String(err)}`);
+        process.exit(1);
+      }
+    }
+    console.log(import_kleur2.default.dim(`  Installing: ${block.dependencies.join(", ")}`));
+    const pm = detectPackageManager(cwd);
+    const installCmd = pm === "npm" ? "install" : "add";
+    await (0, import_execa2.execa)(pm, [installCmd, ...block.dependencies], { cwd });
+  }
+  spinner.succeed(`Added block ${import_kleur2.default.bold(block.name)} \u2192 ${blockDir}/`);
+  console.log(import_kleur2.default.dim(`  Import ${import_path3.default.join(blockDir, "page.tsx")} into a route to use it.`));
+}
 
 // src/commands/theme.ts
 var import_commander3 = require("commander");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tokiui/cli",
-  "version": "0.2.1",
+  "version": "0.3.1",
   "description": "CLI for adding tokiui components to your project",
   "license": "MIT",
   "author": "Topher Gacad",