@beaket/ui 1.5.1 → 1.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beaket/ui",
-  "version": "1.5.1",
+  "version": "1.7.0",
   "description": "CLI tool for adding Beaket UI components to your project",
   "type": "module",
   "bin": {

package/src/commands/add.ts

@@ -14,7 +14,7 @@ export async function add(componentName: string, options: AddOptions) {
   // Read config
   const config = await getConfig();
   if (!config) {
-    console.log(pc.red("Error:"), "beaket.json not found.");
+    console.log(pc.red("Error:"), "beaket.ui.json not found.");
     console.log("Run", pc.cyan("npx @beaket/ui init"), "first.");
     process.exit(1);
   }

package/src/commands/init.ts

@@ -4,28 +4,105 @@ import pc from "picocolors";
 import prompts from "prompts";
 import { writeConfig, type BeaketConfig } from "../utils/config.ts";
 
+interface TsConfig {
+  compilerOptions?: {
+    paths?: Record<string, string[]>;
+  };
+}
+
+async function detectAliasPath(): Promise<string> {
+  const cwd = process.cwd();
+
+  // Try to read tsconfig.json or tsconfig.app.json
+  for (const configFile of ["tsconfig.json", "tsconfig.app.json"]) {
+    const configPath = path.join(cwd, configFile);
+    if (await fs.pathExists(configPath)) {
+      try {
+        const content = await fs.readFile(configPath, "utf-8");
+        const tsconfig: TsConfig = JSON.parse(content);
+        const paths = tsconfig.compilerOptions?.paths;
+        if (paths?.["@/*"]) {
+          const aliasPath = paths["@/*"][0];
+          // "./src/*" -> "src", "./*" -> ""
+          const prefix = aliasPath.replace(/^\.\/|\/?\*$/g, "");
+          return prefix ? `${prefix}/components/ui` : "components/ui";
+        }
+      } catch {
+        // Ignore parse errors
+      }
+    }
+  }
+
+  // Fallback: detect from package.json
+  const pkgPath = path.join(cwd, "package.json");
+  if (await fs.pathExists(pkgPath)) {
+    try {
+      const content = await fs.readFile(pkgPath, "utf-8");
+      const pkg = JSON.parse(content);
+      const deps = { ...pkg.dependencies, ...pkg.devDependencies };
+      // Next.js uses root alias by default
+      if (deps.next) {
+        return "components/ui";
+      }
+    } catch {
+      // Ignore parse errors
+    }
+  }
+
+  // Default to src/components/ui (Vite style)
+  return "src/components/ui";
+}
+
+async function detectCssPath(): Promise<string> {
+  const cwd = process.cwd();
+  const pkgPath = path.join(cwd, "package.json");
+
+  if (await fs.pathExists(pkgPath)) {
+    try {
+      const content = await fs.readFile(pkgPath, "utf-8");
+      const pkg = JSON.parse(content);
+      const deps = { ...pkg.dependencies, ...pkg.devDependencies };
+      if (deps.next) {
+        return "app/globals.css";
+      }
+    } catch {
+      // Ignore parse errors
+    }
+  }
+
+  return "src/index.css";
+}
+
 const CSS_VARIABLES = `
 /* Beaket UI Design System */
+@theme {
+  --color-inverse: var(--paper);
+  --shadow-offset: 2px 2px 0px 0px var(--chrome);
+  --shadow-offset-dark: 2px 2px 0px 0px var(--aluminum);
+  --shadow-offset-hover: 3px 3px 0px 0px var(--chrome);
+  --shadow-offset-active: 1px 1px 0px 0px var(--chrome);
+}
+
 :root {
-  --branch: #1C1F24;
-  --ink: #0D0D0D;
-  --paper: #F8F8F8;
-  --steel: #6B6B6B;
-  --chrome: #C8C8C8;
-  --graphite: #1A1A1A;
-  --iron: #2D2D2D;
+  --graphite: #0d0d0d;
+  --ink: #1a1a1a;
+  --branch: #1c1f24;
+  --iron: #2d2d2d;
   --slate: #404040;
   --zinc: #525252;
-  --aluminum: #9E9E9E;
-  --silver: #DEDEDE;
-  --platinum: #F0F0F0;
-  --frost: #F5F5F5;
-  --signal-blue: #2B6CB0;
-  --signal-red: #D32F2F;
-  --signal-green: #137752;
-  --signal-amber: #A86800;
-  --signal-purple: #6F2DA8;
-  --signal-cyan: #1A6B7C;
+  --steel: #595959;
+  --aluminum: #9e9e9e;
+  --chrome: #d0d0d0;
+  --silver: #dedede;
+  --platinum: #e8e8e8;
+  --frost: #f5f5f5;
+  --paper: #fafafa;
+  --signal-blue: #00449e;
+  --signal-red: #c41e1e;
+  --signal-green: #00794c;
+  --signal-amber: #b8860b;
+  --signal-purple: #6f2da8;
+  --signal-cyan: #1a6b7c;
 }
 `;
 
@@ -34,18 +111,22 @@ export async function init() {
   console.log(pc.bold("Initializing Beaket UI..."));
   console.log();
 
+  // Auto-detect defaults based on project structure
+  const detectedComponentsPath = await detectAliasPath();
+  const detectedCssPath = await detectCssPath();
+
   const response = await prompts([
     {
       type: "text",
       name: "components",
       message: "Where should components be installed?",
-      initial: "src/components/ui",
+      initial: detectedComponentsPath,
     },
     {
       type: "text",
       name: "css",
       message: "Where is your Tailwind CSS file?",
-      initial: "src/index.css",
+      initial: detectedCssPath,
     },
   ]);
 
@@ -54,14 +135,14 @@ export async function init() {
     process.exit(1);
   }
 
-  // Write beaket.json (only components path)
+  // Write beaket.ui.json (only components path)
   const config: BeaketConfig = {
     $schema: "https://beaket.dev/schema.json",
     components: response.components,
   };
 
   await writeConfig(config);
-  console.log(pc.green("✔"), "Created beaket.json");
+  console.log(pc.green("✔"), "Created beaket.ui.json");
 
   // Inject CSS variables into Tailwind CSS file
   if (response.css) {

package/src/utils/config.ts

@@ -6,7 +6,7 @@ export interface BeaketConfig {
   components: string;
 }
 
-const CONFIG_FILE = "beaket.json";
+const CONFIG_FILE = "beaket.ui.json";
 
 export async function getConfig(): Promise<BeaketConfig | null> {
   const configPath = path.join(process.cwd(), CONFIG_FILE);