@dreamy-ui/cli 2.0.1 → 2.0.3

package/dist/index.js

@@ -19554,9 +19554,7 @@ async function writeRecipesIndexFile(recipesDir, jsx, debug4) {
           exportName: recipeExport
         });
       } else {
-        debug4(
-          `No recipe export found for ${expectedExportName} in ${file}`
-        );
+        debug4(`No recipe export found for ${expectedExportName} in ${file}`);
       }
     } catch (error) {
       debug4(`Failed to read recipe file ${file}:`, error);
@@ -19607,9 +19605,7 @@ async function writePatternsIndexFile(patternsDir, jsx, debug4) {
           exportName: patternExport
         });
       } else {
-        debug4(
-          `No pattern export found for ${expectedExportName} in ${file}`
-        );
+        debug4(`No pattern export found for ${expectedExportName} in ${file}`);
       }
     } catch (error) {
       debug4(`Failed to read pattern file ${file}:`, error);
@@ -19630,6 +19626,46 @@ export const patterns = {
   const indexPath = join$1(patternsDir, indexFilename);
   await writeFile(indexPath, indexContent, "utf-8");
 }
+function toPascalCase(str) {
+  return str.split(/[-_]/).map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join("");
+}
+async function writeComponentsIndexFile(componentsDir, jsx, debug4) {
+  let componentFiles = [];
+  try {
+    const allFiles = await readdir(componentsDir);
+    componentFiles = allFiles.filter((file) => {
+      if (file === "index.ts" || file === "index.tsx" || file === "index.js" || file === "index.jsx") {
+        return false;
+      }
+      return jsx && (file.endsWith(".jsx") || file.endsWith(".js")) || !jsx && (file.endsWith(".tsx") || file.endsWith(".ts"));
+    });
+  } catch (error) {
+    return;
+  }
+  if (componentFiles.length === 0) return;
+  const exports$1 = [];
+  for (const file of componentFiles) {
+    try {
+      const filePath = join$1(componentsDir, file);
+      const fileContent = await readFile$1(filePath, "utf-8");
+      const fileName = file.replace(/\.(tsx|ts|jsx|js)$/, "");
+      const componentName = toPascalCase(fileName);
+      const hasRootExport = fileContent.match(/export\s+const\s+Root\s*/) !== null;
+      if (hasRootExport) {
+        exports$1.push(`export * as ${componentName} from "./${fileName}";`);
+      } else {
+        exports$1.push(`export * from "./${fileName}";`);
+      }
+    } catch (error) {
+      debug4(`Failed to read component file ${file}:`, error);
+    }
+  }
+  if (exports$1.length === 0) return;
+  const indexContent = exports$1.join("\n") + "\n";
+  const indexFilename = jsx ? "index.js" : "index.ts";
+  const indexPath = join$1(componentsDir, indexFilename);
+  await writeFile(indexPath, indexContent, "utf-8");
+}
 var execAsync = promisify(exec);
 var commandMap = {
   npm: {
@@ -19701,14 +19737,7 @@ function getFramework(files, cwd) {
 }
 function getComponentsDir(scope, cwd) {
   const basePath = join$2("components", "ui");
-  if (scope.framework === "remix" || scope.framework === "react-router") {
-    return join$2("app", basePath);
-  }
-  if (scope.framework === "next") {
-    const isSrcDir = existsSync(join$2(cwd, "src"));
-    return join$2(isSrcDir ? "src" : "", basePath);
-  }
-  return join$2("src", basePath);
+  return basePath;
 }
 async function getProjectContext(opts) {
   const { cwd = process.cwd(), tsx } = opts;
@@ -19721,7 +19750,7 @@ async function getProjectContext(opts) {
   if (files.length > 0) {
     scope.framework = getFramework(files, cwd);
     if (scope.framework) {
-      scope.componentsDir = getComponentsDir(scope, cwd);
+      scope.componentsDir = getComponentsDir();
     }
   }
   return {
@@ -19738,7 +19767,7 @@ var compositionFileSchema = z.object({
     content: z.string()
   }),
   component: z.string(),
-  // npmDependencies: z.array(z.string()),
+  npmDependencies: z.array(z.string()),
   fileDependencies: z.array(z.string()),
   hasRecipe: z.boolean(),
   hasPattern: z.boolean(),
@@ -19751,7 +19780,7 @@ var compositionIndexSchema = z.array(
     id: z.string(),
     file: z.string(),
     component: z.string(),
-    // npmDependencies: z.array(z.string()),
+    npmDependencies: z.array(z.string()),
     fileDependencies: z.array(z.string()),
     hasRecipe: z.boolean(),
     hasPattern: z.boolean(),
@@ -19783,6 +19812,8 @@ var processEnvSchema = z.object({
 var addCommandFlagsSchema = z.object({
   force: z.boolean().optional(),
   dryRun: z.boolean().optional(),
+  skipInstall: z.boolean().optional(),
+  skipCodegen: z.boolean().optional(),
   outdir: z.string().optional(),
   all: z.boolean().optional(),
   tsx: z.boolean().optional()
@@ -19883,7 +19914,9 @@ var findCompositionById = (compositions, id) => {
     return normalizedCompId === normalizedId;
   });
   if (found) {
-    debug(`Found composition: "${found.id}" with ${found.fileDependencies.length} dependencies`);
+    debug(
+      `Found composition: "${found.id}" with ${found.fileDependencies.length} dependencies`
+    );
   } else {
     debug(`No composition found for: "${id}" (normalized: "${normalizedId}")`);
     debug(`Available composition IDs: ${compositions.map((c2) => c2.id).join(", ")}`);
@@ -19908,6 +19941,7 @@ var getFileDependencies = (compositions, id) => {
     debug(`  Adding initial dependency: "${dep}" -> "${normalized}"`);
     fileDependencies.add(normalized);
   });
+  const npmDependencies = new Set(composition.npmDependencies || []);
   const collect = (depId, depth = 0) => {
     const indent3 = "  ".repeat(depth + 1);
     debug(`${indent3}Collecting dependencies for: "${depId}"`);
@@ -19916,6 +19950,11 @@ var getFileDependencies = (compositions, id) => {
       debug(`${indent3}\u274C Could not find composition for: "${depId}"`);
       return;
     }
+    if (comp.npmDependencies) {
+      comp.npmDependencies.forEach((dep) => {
+        npmDependencies.add(dep);
+      });
+    }
     comp.fileDependencies.forEach((dep) => {
       const normalizedDep = normalizePath(dep);
       if (fileDependencies.has(normalizedDep)) {
@@ -19929,12 +19968,16 @@ var getFileDependencies = (compositions, id) => {
   };
   collect(id);
   const result = Array.from(fileDependencies);
+  const npmResult = Array.from(npmDependencies);
   debug(`
 === Total file dependencies collected: ${result.length} ===`);
   debug(result);
+  debug(`
+=== Total npm dependencies collected: ${npmResult.length} ===`);
+  debug(npmResult);
   return {
-    fileDependencies: result
-    // npmDependencies: Array.from(npmDependencies)
+    fileDependencies: result,
+    npmDependencies: npmResult
   };
 };
 function ensureDir(dirPath) {
@@ -19963,9 +20006,9 @@ async function tasks(tasks2) {
 
 // src/commands/add.ts
 var debug2 = createDebug("dreamy-ui:add");
-var AddCommand = new Command("add").description("Add components to your project").argument("[components...]", "components to add").option("-d, --dry-run", "Dry run").option("--outdir <dir>", "Output directory to write the components").option("--all", "Add all components").option("-f, --force", "Overwrite existing files").option("--tsx", "Convert to TSX").action(async (selectedComponents, flags) => {
+var AddCommand = new Command("add").description("Add components to your project").argument("[components...]", "components to add").option("-d, --dry-run", "Dry run").option("--skip-install", "Skip dependency installation").option("--skip-codegen", "Skip running panda codegen").option("--outdir <dir>", "Output directory to write the components").option("--all", "Add all components").option("-f, --force", "Overwrite existing files").option("--tsx", "Convert to TSX").action(async (selectedComponents, flags) => {
   const parsedFlags = addCommandFlagsSchema.parse(flags);
-  const { dryRun, force, all, tsx } = parsedFlags;
+  const { dryRun, force, all, tsx, skipInstall, skipCodegen } = parsedFlags;
   const ctx = await getProjectContext({
     cwd: parsedFlags.outdir || process.cwd(),
     tsx
@@ -20028,8 +20071,12 @@ var AddCommand = new Command("add").description("Add components to your project"
         return;
       }
       debug2(`Found dependencies for ${id}:`, result.fileDependencies);
-      const key2 = JSON.stringify(result);
-      allDeps.set(key2, result);
+      const depData = {
+        fileDependencies: result.fileDependencies,
+        npmDependencies: result.npmDependencies || []
+      };
+      const key2 = JSON.stringify(depData);
+      allDeps.set(key2, depData);
       result.fileDependencies.forEach((fileDep) => {
         const depId = fileDep.replace(/\.(tsx|ts|jsx|js)$/, "");
         debug2(`Recursively processing: ${depId} (from ${fileDep})`);
@@ -20042,7 +20089,9 @@ var AddCommand = new Command("add").description("Add components to your project"
   }
   const deps = getAllDependenciesRecursive(components);
   const fileDependencies = uniq(deps.flatMap((dep) => dep.fileDependencies));
+  const npmDependencies = uniq(deps.flatMap((dep) => dep.npmDependencies));
   debug2("fileDependencies", fileDependencies);
+  debug2("npmDependencies", npmDependencies);
   const dependencyComponentIds = fileDependencies.map(
     (dep) => dep.replace(/\.(tsx|ts|jsx|js)$/, "")
   );
@@ -20051,6 +20100,7 @@ var AddCommand = new Command("add").description("Add components to your project"
   const skippedFiles = [];
   const skippedRecipes = [];
   const skippedPatterns = [];
+  const writtenComponentFiles = [];
   const componentRecipes = await Promise.all(
     allComponentIds.map(async (id) => {
       const recipes = await getRecipeForComponent(id);
@@ -20066,11 +20116,11 @@ var AddCommand = new Command("add").description("Add components to your project"
   );
   const validPatterns = componentPatterns.filter(Boolean);
   await tasks([
-    // {
-    //     title: "Installing required dependencies...",
-    //     enabled: !!npmDependencies.length && !dryRun,
-    //     task: () => installCommand([...npmDependencies, "--silent"], outdir)
-    // },
+    {
+      title: "Installing required dependencies...",
+      enabled: !!npmDependencies.length && !dryRun && !skipInstall,
+      task: () => installCommand([...npmDependencies, "--silent"], outdir)
+    },
     {
       title: "Writing file dependencies",
       enabled: !!fileDependencies.length && !dryRun,
@@ -20092,6 +20142,7 @@ var AddCommand = new Command("add").description("Add components to your project"
               item.file.content.replace("compositions/ui", "."),
               "utf-8"
             );
+            writtenComponentFiles.push(item.file.name);
           })
         );
         return "File dependencies written";
@@ -20207,6 +20258,7 @@ var AddCommand = new Command("add").description("Add components to your project"
                   item.file.content.replace("compositions/ui", "."),
                   "utf-8"
                 );
+                writtenComponentFiles.push(item.file.name);
               }
             } catch (error) {
               if (error instanceof Error) {
@@ -20220,8 +20272,16 @@ var AddCommand = new Command("add").description("Add components to your project"
       }
     },
     {
-      title: "Running panda codegen",
+      title: "Generating components index file",
       enabled: !dryRun,
+      task: async () => {
+        await writeComponentsIndexFile(outdir, jsx, debug2);
+        return "Components index file generated";
+      }
+    },
+    {
+      title: "Running panda codegen",
+      enabled: !dryRun && !skipCodegen,
       task: async () => {
         await pandaCodegenCommand(process.cwd());
         return "panda codegen finished";
@@ -20596,7 +20656,7 @@ async function detectFramework(cwd) {
       type: "react-router",
       cssPath: "app/app.css",
       cssImportPath: "app/root.tsx",
-      providerPath: "app/components/dreamy-provider.tsx",
+      providerPath: "components/dreamy-provider.tsx",
       includePattern: "./app/**/*.{js,jsx,ts,tsx}"
     };
   }
@@ -20606,7 +20666,7 @@ async function detectFramework(cwd) {
       type: "nextjs",
       cssPath: hasSrcDir ? "src/app/globals.css" : "app/globals.css",
       cssImportPath: hasSrcDir ? "src/app/layout.tsx" : "app/layout.tsx",
-      providerPath: hasSrcDir ? "src/components/dreamy-provider.tsx" : "components/dreamy-provider.tsx",
+      providerPath: "components/dreamy-provider.tsx",
       includePattern: hasSrcDir ? "./src/**/*.{js,jsx,ts,tsx}" : "./app/**/*.{js,jsx,ts,tsx}"
     };
   }
@@ -20616,7 +20676,7 @@ async function detectFramework(cwd) {
       type: "vite",
       cssPath: hasSrcDir ? "src/index.css" : "src/index.css",
       cssImportPath: hasSrcDir ? "src/main.tsx" : "src/main.tsx",
-      providerPath: hasSrcDir ? "src/components/dreamy-provider.tsx" : "src/components/dreamy-provider.tsx",
+      providerPath: "components/dreamy-provider.tsx",
       includePattern: "./src/**/*.{js,jsx,ts,tsx}"
     };
   }
@@ -20667,7 +20727,7 @@ async function createPandaConfig(cwd, framework, isTypeScript) {
         return false;
       }
     }
-    const componentsImportPath = framework.type === "react-router" ? "./app/components" : framework.type === "nextjs" && existsSync(join$2(cwd, "src")) ? "./src/components" : framework.type === "nextjs" ? "./components" : "./src/components";
+    const componentsImportPath = "./components";
     const configContent = isTypeScript ? `import createDreamyPreset, { dreamyPlugin } from "@dreamy-ui/panda-preset";
 import { defineConfig } from "@pandacss/dev";
 import { patterns } from "${componentsImportPath}/patterns";
@@ -20675,7 +20735,6 @@ import { recipes } from "${componentsImportPath}/recipes";
 
 export default defineConfig({
     preflight: true,
-    watch: true,
     jsxFramework: "react",
     jsxStyleProps: "all",
     outExtension: "js",
@@ -20705,7 +20764,6 @@ import { recipes } from "${componentsImportPath}/recipes";
 
 export default defineConfig({
     preflight: true,
-    watch: true,
     jsxFramework: "react",
     jsxStyleProps: "all",
     outExtension: "js",
@@ -20798,7 +20856,8 @@ async function updateViteConfig(cwd, framework) {
     }
     const viteConfigPath = join$2(cwd, viteConfigFiles[0]);
     let content = readFileSync(viteConfigPath, "utf-8");
-    if (content.includes("@pandacss/dev/postcss") && content.includes("css:")) {
+    const hasPandaPlugin = /plugins:\s*\[[^\]]*pandacss[^\]]*\]/.test(content) || /plugins:\s*\[[^\]]*@pandacss\/dev\/postcss[^\]]*\]/.test(content);
+    if (hasPandaPlugin) {
       p4.log.info("\u2298 Vite config already configured for Panda CSS");
       return true;
     }
@@ -20827,10 +20886,62 @@ async function updateViteConfig(cwd, framework) {
         content = 'import pandacss from "@pandacss/dev/postcss";\n' + content;
       }
     }
-    if (!content.includes("css:")) {
-      const defineConfigMatch = content.match(/defineConfig\s*\(\s*\{/);
-      if (defineConfigMatch) {
-        const insertPosition = content.indexOf(defineConfigMatch[0]) + defineConfigMatch[0].length;
+    const hasCssProperty = /css\s*:\s*\{/.test(content);
+    if (hasCssProperty) {
+      const postcssIndex = content.search(/postcss\s*:\s*\{/);
+      const hasPostcssPlugins = postcssIndex !== -1 && content.slice(postcssIndex).search(/plugins\s*:\s*\[/) !== -1;
+      if (hasPostcssPlugins) {
+        const pluginsArrayMatch = content.match(/plugins\s*:\s*\[([^\]]*)\]/);
+        if (pluginsArrayMatch) {
+          const pluginsContent = pluginsArrayMatch[1];
+          if (!pluginsContent.includes("pandacss")) {
+            const arrayStart = content.indexOf(pluginsArrayMatch[0]);
+            const pluginsStart = arrayStart + content.slice(arrayStart).indexOf("[") + 1;
+            const insertPosition = pluginsStart + pluginsContent.trim().length;
+            const separator = pluginsContent.trim() ? ", " : "";
+            content = content.slice(0, insertPosition) + separator + "pandacss" + content.slice(insertPosition);
+          }
+        } else {
+          const postcssMatch = content.match(/postcss\s*:\s*\{/);
+          if (postcssMatch) {
+            const postcssStart = content.indexOf(postcssMatch[0]);
+            const postcssBraceStart = postcssStart + postcssMatch[0].length - 1;
+            const afterBrace = content.slice(postcssBraceStart + 1);
+            const nextBrace = afterBrace.indexOf("}");
+            const postcssContent = afterBrace.slice(0, nextBrace);
+            const needsComma = postcssContent.trim().length > 0 && !postcssContent.trim().endsWith(",");
+            const insertPosition = postcssBraceStart + 1;
+            const pluginsConfig = `${needsComma ? ", " : ""}plugins: [pandacss]`;
+            content = content.slice(0, insertPosition) + pluginsConfig + content.slice(insertPosition);
+          }
+        }
+      } else {
+        const cssMatch = content.match(/css\s*:\s*\{/);
+        if (cssMatch) {
+          const cssStart = content.indexOf(cssMatch[0]);
+          const cssBraceStart = cssStart + cssMatch[0].length - 1;
+          const afterBrace = content.slice(cssBraceStart + 1);
+          let braceCount = 1;
+          let nextBracePos = -1;
+          for (let i = 0; i < afterBrace.length; i++) {
+            if (afterBrace[i] === "{") braceCount++;
+            if (afterBrace[i] === "}") braceCount--;
+            if (braceCount === 0) {
+              nextBracePos = i;
+              break;
+            }
+          }
+          const cssContent = nextBracePos > 0 ? afterBrace.slice(0, nextBracePos) : "";
+          const needsComma = cssContent.trim().length > 0 && !cssContent.trim().endsWith(",");
+          const insertPosition = cssBraceStart + 1;
+          const postcssConfig = `${needsComma ? ", " : ""}postcss: { plugins: [pandacss] }`;
+          content = content.slice(0, insertPosition) + postcssConfig + content.slice(insertPosition);
+        }
+      }
+    } else {
+      const defineConfigObjectMatch = content.match(/defineConfig\s*\(\s*\{/);
+      if (defineConfigObjectMatch) {
+        const insertPosition = content.indexOf(defineConfigObjectMatch[0]) + defineConfigObjectMatch[0].length;
         const cssConfig = `
     css: {
         postcss: {
@@ -20838,6 +20949,67 @@ async function updateViteConfig(cwd, framework) {
         }
     },`;
         content = content.slice(0, insertPosition) + cssConfig + content.slice(insertPosition);
+      } else {
+        const defineConfigCallbackMatch = content.match(
+          /defineConfig\s*\(\s*(?:async\s+)?(?:\([^)]*\)|[a-zA-Z_$][a-zA-Z0-9_$]*)\s*=>\s*(\{|\()/
+        );
+        if (defineConfigCallbackMatch) {
+          const callbackStart = content.indexOf(defineConfigCallbackMatch[0]);
+          const arrowIndex = content.indexOf("=>", callbackStart);
+          const isImplicitReturn = defineConfigCallbackMatch[1] === "(";
+          if (isImplicitReturn) {
+            const matchEnd = callbackStart + defineConfigCallbackMatch[0].length;
+            const braceInParen = content.indexOf("{", matchEnd);
+            if (braceInParen !== -1) {
+              const insertPosition = braceInParen + 1;
+              const cssConfig = `
+        css: {
+            postcss: {
+                plugins: [pandacss]
+            }
+        },`;
+              content = content.slice(0, insertPosition) + cssConfig + content.slice(insertPosition);
+            } else {
+              p4.log.warn("\u26A0 Could not find config object in implicit return");
+              return false;
+            }
+          } else {
+            const callbackBodyStart = arrowIndex + 2;
+            const firstBrace = content.indexOf("{", callbackBodyStart);
+            if (firstBrace === -1) {
+              p4.log.warn("\u26A0 Could not find callback body");
+              return false;
+            }
+            const callbackBody = content.slice(firstBrace);
+            const returnMatch = callbackBody.match(/return\s*\{/);
+            if (returnMatch) {
+              const returnStart = firstBrace + callbackBody.indexOf(returnMatch[0]);
+              const insertPosition = returnStart + returnMatch[0].length;
+              const cssConfig = `
+        css: {
+            postcss: {
+                plugins: [pandacss]
+            }
+        },`;
+              content = content.slice(0, insertPosition) + cssConfig + content.slice(insertPosition);
+            } else {
+              const insertPosition = firstBrace + 1;
+              const cssConfig = `
+        css: {
+            postcss: {
+                plugins: [pandacss]
+            }
+        },`;
+              content = content.slice(0, insertPosition) + cssConfig + content.slice(insertPosition);
+            }
+          }
+        } else {
+          p4.log.warn("\u26A0 Could not detect defineConfig pattern in vite.config");
+          p4.log.info(
+            '\u{1F4A1} Manually add Panda CSS PostCSS plugin to your vite.config:\n   import pandacss from "@pandacss/dev/postcss";\n   css: { postcss: { plugins: [pandacss] } }'
+          );
+          return false;
+        }
       }
     }
     await writeFile(viteConfigPath, content, "utf-8");
@@ -21147,16 +21319,60 @@ async function updateTsConfig(cwd, framework) {
       tsconfig.include.push("styled-system/**/*");
       needsUpdate = true;
     }
-    const componentsPath = framework.type === "react-router" ? "./app/components/ui/*" : framework.type === "nextjs" && existsSync(join$2(cwd, "src")) ? "./src/components/ui/*" : framework.type === "nextjs" ? "./components/ui/*" : "./src/components/ui/*";
+    const componentsPath = "./components/ui/*";
     if (!tsconfig.compilerOptions) {
       tsconfig.compilerOptions = {};
     }
     if (!tsconfig.compilerOptions.paths) {
       tsconfig.compilerOptions.paths = {};
     }
-    if (!tsconfig.compilerOptions.paths["@/ui/*"]) {
-      tsconfig.compilerOptions.paths["@/ui/*"] = [componentsPath];
-      needsUpdate = true;
+    const existingPaths = tsconfig.compilerOptions.paths;
+    const hasUiPath = "@/ui/*" in existingPaths;
+    if (!hasUiPath) {
+      const shouldAddUiPath = await p4.confirm({
+        message: "Add @/ui/* path alias to tsconfig.json?",
+        initialValue: true
+      });
+      if (p4.isCancel(shouldAddUiPath) || !shouldAddUiPath) {
+        p4.log.warn("\u2298 Skipped @/ui/* path alias");
+        p4.log.info(
+          '\u{1F4A1} Manually add "@/ui/*": ["./components/ui/*"] to the "paths" object in tsconfig.json compilerOptions'
+        );
+      } else {
+        const pathsWithoutUi = Object.keys(existingPaths).reduce(
+          (acc, key2) => {
+            if (key2 !== "@/ui/*") {
+              acc[key2] = existingPaths[key2];
+            }
+            return acc;
+          },
+          {}
+        );
+        tsconfig.compilerOptions.paths = {
+          "@/ui/*": [componentsPath],
+          ...pathsWithoutUi
+        };
+        needsUpdate = true;
+      }
+    } else {
+      const firstKey = Object.keys(existingPaths)[0];
+      const needsReorder = firstKey !== "@/ui/*";
+      if (needsReorder) {
+        const pathsWithoutUi = Object.keys(existingPaths).reduce(
+          (acc, key2) => {
+            if (key2 !== "@/ui/*") {
+              acc[key2] = existingPaths[key2];
+            }
+            return acc;
+          },
+          {}
+        );
+        tsconfig.compilerOptions.paths = {
+          "@/ui/*": existingPaths["@/ui/*"],
+          ...pathsWithoutUi
+        };
+        needsUpdate = true;
+      }
     }
     if (framework.type === "nextjs" && !tsconfig.compilerOptions.paths["styled-system/*"]) {
       tsconfig.compilerOptions.paths["styled-system/*"] = ["./styled-system/*"];
@@ -21181,6 +21397,54 @@ async function updateTsConfig(cwd, framework) {
     return false;
   }
 }
+async function updatePackageJson(cwd) {
+  try {
+    const packageJsonPath = join$2(cwd, "package.json");
+    if (!existsSync(packageJsonPath)) {
+      p4.log.warn("\u26A0 Could not find package.json to add prepare script");
+      p4.log.info(
+        '\u{1F4A1} Manually add this script to your package.json:\n   "prepare": "panda codegen"'
+      );
+      return false;
+    }
+    const content = readFileSync(packageJsonPath, "utf-8");
+    const packageJson = JSON.parse(content);
+    if (packageJson.scripts?.prepare) {
+      if (packageJson.scripts.prepare.includes("panda codegen")) {
+        p4.log.info("\u2298 prepare script already configured with panda codegen");
+        return true;
+      }
+      const shouldUpdate = await p4.confirm({
+        message: "prepare script exists but doesn't include 'panda codegen'. Update it?",
+        initialValue: true
+      });
+      if (p4.isCancel(shouldUpdate) || !shouldUpdate) {
+        p4.log.warn("\u2298 Skipped package.json prepare script update");
+        p4.log.info(
+          "\u{1F4A1} Manually add 'panda codegen' to your prepare script in package.json"
+        );
+        return false;
+      }
+      packageJson.scripts.prepare = `${packageJson.scripts.prepare} && panda codegen`;
+    } else {
+      if (!packageJson.scripts) {
+        packageJson.scripts = {};
+      }
+      packageJson.scripts.prepare = "panda codegen";
+    }
+    await writeFile(packageJsonPath, JSON.stringify(packageJson, null, 2) + "\n", "utf-8");
+    p4.log.success("\u2713 Added prepare script to package.json");
+    return true;
+  } catch (error) {
+    p4.log.error(
+      `\u2717 Failed to update package.json: ${error instanceof Error ? error.message : String(error)}`
+    );
+    p4.log.warn(
+      '\u{1F4A1} Manually add this script to your package.json:\n   "prepare": "panda codegen"'
+    );
+    return false;
+  }
+}
 async function runPandaCodegen(cwd) {
   const s = p4.spinner();
   try {
@@ -21229,7 +21493,7 @@ function printNextSteps(framework) {
     p4.log.info(
       `1. Update your app/root.tsx to use DreamyProvider:
 
-   import { DreamyProvider, getColorModeHTMLProps, getSSRColorMode } from "./${framework.providerPath.replace("app/", "")}";
+   import { DreamyProvider, getColorModeHTMLProps, getSSRColorMode } from "../${framework.providerPath.replace("app/", "")}";
    import type { Route } from "./+types/root";
    import { useRouteLoaderData } from "react-router";
 
@@ -21261,7 +21525,7 @@ function printNextSteps(framework) {
     p4.log.info(
       `1. Update your app/layout.tsx to use DreamyProvider:
 
-   import { DreamyProvider } from "@/ui/${framework.providerPath.replace(/^(src\/)?/, "")}";
+   import { DreamyProvider } from "../${framework.providerPath.replace(/^(src\/)?/, "")}";
    import { getSSRColorMode, getColorModeHTMLProps } from "@dreamy-ui/react/rsc";
    import { cookies } from "next/headers";
 
@@ -21286,7 +21550,7 @@ function printNextSteps(framework) {
     p4.log.info(
       `1. Update your src/main.tsx or src/App.tsx to use DreamyProvider:
 
-   import { DreamyProvider } from "./${framework.providerPath.replace("src/", "")}";
+   import { DreamyProvider } from "../${framework.providerPath.replace("src/", "")}";
 
    function App() {
        return (
@@ -21326,6 +21590,7 @@ var InitCommand = new Command("init").description("Initialize Dreamy UI in your
     p4.log.info("\u2298 Skipped dependency installation");
   }
   await createPandaConfig(cwd, framework, isTypeScript);
+  await updatePackageJson(cwd);
   await setupPostCSS(cwd, framework);
   await updateViteConfig(cwd, framework);
   if (framework.type === "react-router") {
@@ -21373,7 +21638,7 @@ var ListCommand = new Command("list").description("List all available components
 process.setMaxListeners(Number.POSITIVE_INFINITY);
 async function run() {
   p4.intro("Dreamy UI CLI \u{1F4AB}");
-  const packageJson = await import('./package-ER5PXQNF.js');
+  const packageJson = await import('./package-QAS4MTCY.js');
   const program = new Command().name("dreamy-ui").description("The official CLI for Dreamy UI projects").version(packageJson.version);
   program.addCommand(InitCommand);
   program.addCommand(AddCommand);

package/dist/package-5IJ5ICCX.js

@@ -0,0 +1,94 @@
+import { createRequire } from 'module';
+import './chunk-XML6CAC2.js';
+
+createRequire(import.meta.url);
+
+// package.json
+var name = "@dreamy-ui/cli";
+var version = "2.0.1";
+var description = "CLI for Dreamy UI";
+var author = "imexoodeex";
+var license = "MIT";
+var type = "module";
+var sideEffects = false;
+var main = "dist/index.js";
+var module$1 = "dist/index.js";
+var types = "dist/index.d.ts";
+var files = [
+  "dist",
+  "bin"
+];
+var bin = {
+  dreamy: "./bin/index.js"
+};
+var exports$1 = {
+  ".": {
+    source: "./src/index.ts",
+    import: {
+      types: "./dist/index.d.ts",
+      default: "./dist/index.js"
+    }
+  },
+  "./package.json": "./package.json"
+};
+var scripts = {
+  dev: "tsup --watch",
+  start: "bun run ./src/index.ts",
+  lint: "biome lint ./src",
+  build: "tsup",
+  "build:dev": "tsup",
+  "build:production": "tsup"
+};
+var dependencies = {
+  "@clack/prompts": "^0.11.0",
+  "@effect/platform": "0.69.28",
+  "@visulima/boxen": "^1.0.30",
+  "cli-table": "^0.3.11",
+  commander: "^13.1.0",
+  debug: "^4.4.0",
+  "fs-extra": "11.2.0",
+  globby: "14.0.2",
+  "https-proxy-agent": "^7.0.6",
+  "look-it-up": "^2.1.0",
+  "node-fetch": "^3.3.2",
+  "package-manager-detector": "^1.2.0",
+  picocolors: "^1.1.1",
+  "pkg-dir": "8.0.0",
+  sucrase: "^3.35.0",
+  yargs: "17.7.2",
+  zod: "^3.23.8"
+};
+var devDependencies = {
+  "@types/cli-table": "^0.3.4",
+  "@types/debug": "^4.1.12",
+  "@types/fs-extra": "11.0.4",
+  "@types/node": "22.10.1",
+  "@types/yargs": "17.0.33",
+  dotenv: "^17.2.3",
+  tsup: "^8.4.0",
+  typescript: "5.7.2"
+};
+var peerDependencies = {
+  typescript: "^5.0.0"
+};
+var package_default = {
+  name,
+  version,
+  description,
+  author,
+  license,
+  type,
+  sideEffects,
+  main,
+  module: module$1,
+  types,
+  files,
+  bin,
+  exports: exports$1,
+  scripts,
+  dependencies,
+  devDependencies,
+  peerDependencies
+};
+
+export { author, bin, package_default as default, dependencies, description, devDependencies, exports$1 as exports, files, license, main, module$1 as module, name, peerDependencies, scripts, sideEffects, type, types, version };

package/dist/package-QAS4MTCY.js

@@ -0,0 +1,94 @@
+import { createRequire } from 'module';
+import './chunk-XML6CAC2.js';
+
+createRequire(import.meta.url);
+
+// package.json
+var name = "@dreamy-ui/cli";
+var version = "2.0.2";
+var description = "CLI for Dreamy UI";
+var author = "imexoodeex";
+var license = "MIT";
+var type = "module";
+var sideEffects = false;
+var main = "dist/index.js";
+var module$1 = "dist/index.js";
+var types = "dist/index.d.ts";
+var files = [
+  "dist",
+  "bin"
+];
+var bin = {
+  dreamy: "./bin/index.js"
+};
+var exports$1 = {
+  ".": {
+    source: "./src/index.ts",
+    import: {
+      types: "./dist/index.d.ts",
+      default: "./dist/index.js"
+    }
+  },
+  "./package.json": "./package.json"
+};
+var scripts = {
+  dev: "tsup --watch",
+  start: "bun run ./src/index.ts",
+  lint: "biome lint ./src",
+  build: "tsup",
+  "build:dev": "tsup",
+  "build:production": "tsup"
+};
+var dependencies = {
+  "@clack/prompts": "^0.11.0",
+  "@effect/platform": "0.69.28",
+  "@visulima/boxen": "^1.0.30",
+  "cli-table": "^0.3.11",
+  commander: "^13.1.0",
+  debug: "^4.4.0",
+  "fs-extra": "11.2.0",
+  globby: "14.0.2",
+  "https-proxy-agent": "^7.0.6",
+  "look-it-up": "^2.1.0",
+  "node-fetch": "^3.3.2",
+  "package-manager-detector": "^1.2.0",
+  picocolors: "^1.1.1",
+  "pkg-dir": "8.0.0",
+  sucrase: "^3.35.0",
+  yargs: "17.7.2",
+  zod: "^3.23.8"
+};
+var devDependencies = {
+  "@types/cli-table": "^0.3.4",
+  "@types/debug": "^4.1.12",
+  "@types/fs-extra": "11.0.4",
+  "@types/node": "22.10.1",
+  "@types/yargs": "17.0.33",
+  dotenv: "^17.2.3",
+  tsup: "^8.4.0",
+  typescript: "5.7.2"
+};
+var peerDependencies = {
+  typescript: "^5.0.0"
+};
+var package_default = {
+  name,
+  version,
+  description,
+  author,
+  license,
+  type,
+  sideEffects,
+  main,
+  module: module$1,
+  types,
+  files,
+  bin,
+  exports: exports$1,
+  scripts,
+  dependencies,
+  devDependencies,
+  peerDependencies
+};
+
+export { author, bin, package_default as default, dependencies, description, devDependencies, exports$1 as exports, files, license, main, module$1 as module, name, peerDependencies, scripts, sideEffects, type, types, version };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dreamy-ui/cli",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "description": "CLI for Dreamy UI",
   "author": "imexoodeex",
   "license": "MIT",