@pandacss/node 0.19.0 → 0.20.1

package/dist/index.mjs

@@ -4,17 +4,10 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
-  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
-}) : x)(function(x) {
-  if (typeof require !== "undefined")
-    return require.apply(this, arguments);
-  throw Error('Dynamic require of "' + x + '" is not supported');
-});
 var __esm = (fn, res) => function __init() {
   return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
 };
-var __commonJS = (cb, mod) => function __require2() {
+var __commonJS = (cb, mod) => function __require() {
   return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
 };
 var __copyProps = (to, from, except, desc) => {
@@ -696,7 +689,7 @@ function analyzeTokens(ctx, options = {}) {
   const chunkFiles = ctx.chunks.getFiles();
   ctx.config.optimize = true;
   ctx.config.minify = false;
-  const css = ctx.getCss({ files: chunkFiles });
+  const css2 = ctx.getCss({ files: chunkFiles });
   ctx.config.minify = true;
   const minifiedCss = ctx.getCss({ files: chunkFiles });
   ctx.config.minify = minify;
@@ -711,11 +704,11 @@ function analyzeTokens(ctx, options = {}) {
         classify: classifyMs
       },
       fileSizes: {
-        lineCount: css.split("\n").length,
-        normal: filesize(Buffer.byteLength(css, "utf-8")),
+        lineCount: css2.split("\n").length,
+        normal: filesize(Buffer.byteLength(css2, "utf-8")),
         minified: filesize(Buffer.byteLength(minifiedCss, "utf-8")),
         gzip: {
-          normal: filesize(gzipSizeSync(css)),
+          normal: filesize(gzipSizeSync(css2)),
           minified: filesize(gzipSizeSync(minifiedCss))
         }
       }
@@ -757,13 +750,11 @@ var writeAnalyzeJSON = (filePath, result, ctx) => {
 
 // src/builder.ts
 init_esm_shims();
-import { getConfigDependencies } from "@pandacss/config";
-import { optimizeCss as optimizeCss2, mergeCss as mergeCss2 } from "@pandacss/core";
+import { optimizeCss as optimizeCss2 } from "@pandacss/core";
 import { ConfigNotFoundError } from "@pandacss/error";
-import { logger as logger5 } from "@pandacss/logger";
+import { logger as logger6 } from "@pandacss/logger";
 import { existsSync } from "fs";
 import fsExtra2 from "fs-extra";
-import { resolve as resolve2 } from "path";
 
 // ../../node_modules/.pnpm/p-limit@4.0.0/node_modules/p-limit/index.js
 init_esm_shims();
@@ -872,17 +863,20 @@ function pLimit(concurrency) {
   return generator;
 }
 
+// src/builder.ts
+import { resolve as resolve2 } from "pathe";
+
 // src/config.ts
 init_esm_shims();
-import { convertTsPathsToRegexes, loadConfigFile } from "@pandacss/config";
+import { convertTsPathsToRegexes, loadConfigFile as loadConfigFile2 } from "@pandacss/config";
 import { createDebugger, createHooks } from "hookable";
 import { lookItUpSync } from "look-it-up";
 import { parse } from "tsconfck";
 
 // src/create-context.ts
 init_esm_shims();
-import { createGenerator } from "@pandacss/generator";
-import { logger as logger3 } from "@pandacss/logger";
+import { Generator as Generator2 } from "@pandacss/generator";
+import { logger as logger4 } from "@pandacss/logger";
 import { createProject } from "@pandacss/parser";
 
 // src/chunk-engine.ts
@@ -905,10 +899,11 @@ var getChunkEngine = ({
   format(file) {
     return path2.relative(config.cwd, file).replaceAll(path2.sep, "__").replace(path2.extname(file), ".css");
   },
-  getArtifact(file, css) {
+  getArtifact(file, css2) {
     const fileName = this.format(file);
-    const newCss = mergeCss(this.readFile(file), css);
+    const newCss = mergeCss(this.readFile(file), css2);
     return {
+      id: fileName,
       dir: paths.chunk,
       files: [{ file: fileName, code: newCss }]
     };
@@ -1000,58 +995,200 @@ process.on("uncaughtException", (reason) => {
 
 // src/output-engine.ts
 init_esm_shims();
-var getOutputEngine = ({
-  paths,
-  runtime: { path: path2, fs }
-}) => ({
+import { logger as logger3 } from "@pandacss/logger";
+var PandaOutputEngine = class {
+  paths;
+  fs;
+  path;
+  constructor({ paths, runtime: { path: path2, fs } }) {
+    this.paths = paths;
+    this.fs = fs;
+    this.path = path2;
+  }
   empty() {
-    fs.rmDirSync(path2.join(...paths.root));
-  },
+    this.fs.rmDirSync(this.path.join(...this.paths.root));
+  }
   async write(output) {
     if (!output)
       return;
-    const { dir = paths.root, files } = output;
-    fs.ensureDirSync(path2.join(...dir));
+    const { dir = this.paths.root, files } = output;
+    this.fs.ensureDirSync(this.path.join(...dir));
     return Promise.allSettled(
       files.map(async (artifact) => {
-        if (!artifact)
+        if (!artifact?.code)
           return;
         const { file, code } = artifact;
-        const absPath = path2.join(...dir, file);
-        if (!code)
-          return;
-        return fs.writeFile(absPath, code);
+        const absPath = this.path.join(...dir, file);
+        logger3.debug("write:file", dir.slice(-1).concat(file).join("/"));
+        return this.fs.writeFile(absPath, code);
       })
     );
   }
-});
+};
+
+// src/diff-engine.ts
+init_esm_shims();
+import { loadConfigFile } from "@pandacss/config";
+import "@pandacss/generator";
+import { dashCase } from "@pandacss/shared";
+import diff from "microdiff";
+
+// src/matcher.ts
+init_esm_shims();
+function createMatcher(id, patterns) {
+  if (!patterns?.length)
+    return () => void 0;
+  const includePatterns = [];
+  const excludePatterns = [];
+  const deduped = new Set(patterns);
+  deduped.forEach((pattern) => {
+    const regexString = pattern.replace(/\*/g, ".*");
+    if (pattern.startsWith("!")) {
+      excludePatterns.push(regexString.slice(1));
+    } else {
+      includePatterns.push(regexString);
+    }
+  });
+  const include = new RegExp(includePatterns.join("|"));
+  const exclude = new RegExp(excludePatterns.join("|"));
+  return (path2) => {
+    if (excludePatterns.length && exclude.test(path2))
+      return;
+    return include.test(path2) ? id : void 0;
+  };
+}
+
+// src/diff-engine.ts
+var all = ["outdir", "forceConsistentTypeExtension", "outExtension"];
+var format = ["syntax", "hash", "prefix", "separator"];
+var tokens = ["utilities", "conditions", "theme.tokens", "theme.semanticTokens", "theme.breakpoints"];
+var jsx = ["jsxFramework", "jsxFactory", "jsxStyleProps", "syntax"];
+var css = ["layers", "optimize", "minify"];
+var common = tokens.concat(jsx, format);
+var artifactConfigDeps = {
+  helpers: ["syntax", "jsxFramework"],
+  keyframes: ["theme.keyframes", "layers"],
+  "design-tokens": ["layers", "!utilities.*.className"].concat(tokens),
+  types: ["!utilities.*.className"].concat(common),
+  "css-fn": common,
+  cva: ["syntax"],
+  sva: ["syntax"],
+  cx: [],
+  "create-recipe": ["separator", "prefix", "hash"],
+  "recipes-index": ["theme.recipes", "theme.slotRecipes"],
+  recipes: ["theme.recipes", "theme.slotRecipes"],
+  "patterns-index": ["syntax", "patterns"],
+  patterns: ["syntax", "patterns"],
+  "jsx-is-valid-prop": common,
+  "jsx-factory": jsx,
+  "jsx-helpers": jsx,
+  "jsx-patterns": jsx.concat("patterns"),
+  "jsx-patterns-index": jsx.concat("patterns"),
+  "css-index": ["syntax"],
+  "reset.css": ["preflight", "layers"],
+  "global.css": ["globalCss"].concat(css),
+  "static.css": ["staticCss", "theme.breakpoints"].concat(css),
+  "styles.css": tokens.concat(format),
+  "package.json": ["emitPackage"]
+};
+var configDeps = {
+  artifacts: artifactConfigDeps
+};
+var matchers = {
+  artifacts: Object.keys(configDeps.artifacts).map((key) => {
+    const paths = configDeps.artifacts[key];
+    if (!paths.length)
+      return () => void 0;
+    return createMatcher(key, paths.concat(all));
+  })
+};
+var DiffEngine = class {
+  constructor(ctx) {
+    this.ctx = ctx;
+    this.previousConfig = ctx.conf.deserialize();
+  }
+  previousConfig;
+  /**
+   * Reload config from disk and refresh the context
+   */
+  async reloadConfigAndRefreshContext(fn) {
+    const conf = await loadConfigFile({ cwd: this.ctx.config.cwd, file: this.ctx.conf.path });
+    return this.refresh(conf, fn);
+  }
+  /**
+   * Update the context from the refreshed config
+   * then persist the changes on each affected engines
+   * Returns the list of affected artifacts/engines
+   */
+  refresh(conf, fn) {
+    const affected = {
+      artifacts: /* @__PURE__ */ new Set(),
+      hasConfigChanged: false,
+      diffs: []
+    };
+    if (!this.previousConfig) {
+      affected.hasConfigChanged = true;
+      return affected;
+    }
+    const newConfig = conf.deserialize();
+    const configDiff = diff(this.previousConfig, newConfig);
+    if (!configDiff.length) {
+      return affected;
+    }
+    affected.hasConfigChanged = true;
+    affected.diffs = configDiff;
+    this.previousConfig = newConfig;
+    fn?.(conf);
+    configDiff.forEach((change) => {
+      const changePath = change.path.join(".");
+      matchers.artifacts.forEach((matcher) => {
+        const id = matcher(changePath);
+        if (!id)
+          return;
+        if (id === "recipes") {
+          const name = dashCase(change.path.slice(1, 3).join("."));
+          affected.artifacts.add(name);
+        }
+        if (id === "patterns") {
+          const name = dashCase(change.path.slice(0, 2).join("."));
+          affected.artifacts.add(name);
+        }
+        affected.artifacts.add(id);
+      });
+    });
+    return affected;
+  }
+};
 
 // src/create-context.ts
-var createContext = (conf) => {
-  const generator = createGenerator(conf);
-  const config = conf.config;
-  const runtime = nodeRuntime;
-  config.cwd ||= runtime.cwd();
-  if (config.logLevel) {
-    logger3.level = config.logLevel;
-  }
-  const { include, exclude, cwd } = config;
-  const getFiles = () => runtime.fs.glob({ include, exclude, cwd });
-  const ctx = {
-    ...conf,
-    ...generator,
-    runtime: nodeRuntime,
-    hooks: conf.hooks,
-    getFiles,
-    project: createProject({
+var PandaContext = class extends Generator2 {
+  runtime;
+  project;
+  getFiles;
+  chunks;
+  output;
+  diff;
+  constructor(conf) {
+    super(conf);
+    const config = conf.config;
+    this.runtime = nodeRuntime;
+    config.cwd ||= this.runtime.cwd();
+    if (config.logLevel) {
+      logger4.level = config.logLevel;
+    }
+    const { include, exclude, cwd } = config;
+    this.getFiles = () => this.runtime.fs.glob({ include, exclude, cwd });
+    this.project = createProject({
       ...conf.tsconfig,
-      getFiles,
-      readFile: runtime.fs.readFileSync,
+      getFiles: this.getFiles.bind(this),
+      readFile: this.runtime.fs.readFileSync.bind(this),
       hooks: conf.hooks,
-      parserOptions: { join: runtime.path.join, ...generator.parserOptions }
-    })
-  };
-  return Object.assign(ctx, { chunks: getChunkEngine(ctx), output: getOutputEngine(ctx) });
+      parserOptions: { join: this.runtime.path.join, ...this.parserOptions }
+    });
+    this.chunks = getChunkEngine(this);
+    this.output = new PandaOutputEngine(this);
+    this.diff = new DiffEngine(this);
+  }
 };
 
 // src/config.ts
@@ -1065,27 +1202,33 @@ function findConfig() {
   }
 }
 async function loadConfigAndCreateContext(options = {}) {
-  const hooks = createHooks();
   const { config, configPath } = options;
   const cwd = options.cwd ?? options?.config?.cwd ?? process.cwd();
-  const conf = await loadConfigFile({ cwd, file: configPath });
+  const conf = await loadConfigFile2({ cwd, file: configPath });
   if (config) {
     Object.assign(conf.config, config);
   }
   if (options.cwd) {
     conf.config.cwd = options.cwd;
   }
-  const tsconfigResult = await parse(conf.path, { root: cwd, resolveWithEmptyIfConfigNotFound: true });
+  const tsconfigResult = await parse(conf.path, {
+    root: cwd,
+    resolveWithEmptyIfConfigNotFound: true
+  });
   if (tsconfigResult) {
     conf.tsconfig = tsconfigResult.tsconfig;
     conf.tsconfigFile = tsconfigResult.tsconfigFile;
     const options2 = tsconfigResult.tsconfig?.compilerOptions;
     if (options2?.paths) {
       const baseUrl = options2.baseUrl;
-      conf.tsOptions = { baseUrl, pathMappings: convertTsPathsToRegexes(options2.paths, baseUrl ?? cwd) };
+      conf.tsOptions = {
+        baseUrl,
+        pathMappings: convertTsPathsToRegexes(options2.paths, baseUrl ?? cwd)
+      };
     }
   }
   conf.config.outdir ??= "styled-system";
+  const hooks = createHooks();
   if (conf.config.hooks) {
     hooks.addHooks(conf.config.hooks);
   }
@@ -1093,13 +1236,13 @@ async function loadConfigAndCreateContext(options = {}) {
   if (conf.config.logLevel === "debug") {
     createDebugger(hooks, { tag: "panda" });
   }
-  return createContext({ ...conf, hooks });
+  return new PandaContext({ ...conf, hooks });
 }
 
 // src/extract.ts
 init_esm_shims();
 import { optimizeCss } from "@pandacss/core";
-import { logger as logger4 } from "@pandacss/logger";
+import { logger as logger5 } from "@pandacss/logger";
 import { createParserResult } from "@pandacss/parser";
 import { writeFile as writeFile2 } from "fs/promises";
 import { Obj, pipe, tap, tryCatch } from "lil-fp";
@@ -2421,6 +2564,7 @@ var createBox = (options) => boxen(options.content, {
 async function bundleStyleChunksWithImports(ctx) {
   const files = ctx.chunks.getFiles();
   await ctx.output.write({
+    id: "styles.css",
     dir: ctx.paths.root,
     files: [{ file: "styles.css", code: ctx.getCss({ files }) }]
   });
@@ -2428,11 +2572,11 @@ async function bundleStyleChunksWithImports(ctx) {
 }
 async function writeFileChunk(ctx, file) {
   const { path: path2 } = ctx.runtime;
-  logger4.debug("chunk:write", `File: ${path2.relative(ctx.config.cwd, file)}`);
-  const css = extractFile(ctx, file);
-  if (!css)
+  logger5.debug("chunk:write", `File: ${path2.relative(ctx.config.cwd, file)}`);
+  const css2 = extractFile(ctx, file);
+  if (!css2)
     return;
-  const artifact = ctx.chunks.getArtifact(file, css);
+  const artifact = ctx.chunks.getArtifact(file, css2);
   return ctx.output.write(artifact);
 }
 function extractFile(ctx, file) {
@@ -2442,16 +2586,16 @@ function extractFile(ctx, file) {
   } = ctx;
   return pipe(
     { file: path2.abs(cwd, file) },
-    tap(() => logger4.debug("file:extract", file)),
-    Obj.bind("measure", () => logger4.time.debug(`Extracted ${file}`)),
+    tap(() => logger5.debug("file:extract", file)),
+    Obj.bind("measure", () => logger5.time.debug(`Extracted ${file}`)),
     Obj.bind(
       "result",
       tryCatch(
         ({ file: file2 }) => ctx.project.parseSourceFile(file2),
-        (error) => logger4.error("file:parse", error)
+        (error) => logger5.error("file:parse", error)
       )
     ),
-    Obj.bind("measureCss", () => logger4.time.debug(`Parsed ${file}`)),
+    Obj.bind("measureCss", () => logger5.time.debug(`Parsed ${file}`)),
     Obj.bind("css", ({ result }) => result ? ctx.getParserCss(result) : void 0),
     tap(({ measure, measureCss }) => [measureCss(), measure()]),
     Obj.get("css")
@@ -2463,10 +2607,10 @@ function writeChunks(ctx) {
 var randomWords = ["Sweet", "Divine", "Pandalicious", "Super"];
 var pickRandom = (arr) => arr[Math.floor(Math.random() * arr.length)];
 var limit = pLimit(20);
-async function emitArtifacts(ctx) {
+async function emitArtifacts(ctx, ids) {
   if (ctx.config.clean)
     ctx.output.empty();
-  const promises = ctx.getArtifacts().map((artifact) => limit(() => ctx.output.write(artifact)));
+  const promises = ctx.getArtifacts(ids).map((artifact) => limit(() => ctx.output.write(artifact)));
   await Promise.allSettled(promises);
   void ctx.hooks.callHook("generator:done");
   return {
@@ -2477,13 +2621,6 @@ async function emitArtifacts(ctx) {
     msg: ctx.messages.artifactsGenerated()
   };
 }
-async function emitArtfifactsAndCssChunks(ctx) {
-  await emitArtifacts(ctx);
-  if (ctx.config.emitTokensOnly) {
-    return { files: [], msg: "Successfully rebuilt the css variables and js function to query your tokens \u2728" };
-  }
-  return writeAndBundleCssChunks(ctx);
-}
 async function writeAndBundleCssChunks(ctx) {
   await writeChunks(ctx);
   return bundleStyleChunksWithImports(ctx);
@@ -2500,7 +2637,7 @@ async function bundleMinimalFilesCss(ctx, outfile) {
   const filesWithCss = [];
   const collector = createParserResult();
   files.forEach((file) => {
-    const measure = logger4.time.debug(`Parsed ${file}`);
+    const measure = logger5.time.debug(`Parsed ${file}`);
     const result = ctx.project.parseSourceFile(file);
     measure();
     if (!result)
@@ -2508,24 +2645,24 @@ async function bundleMinimalFilesCss(ctx, outfile) {
     collector.merge(result);
     filesWithCss.push(file);
   });
-  const css = ctx.getParserCss(collector);
-  if (!css)
+  const css2 = ctx.getParserCss(collector);
+  if (!css2)
     return { files, msg: ctx.messages.buildComplete(files.length) };
   const minify = ctx.config.minify;
-  await writeFile2(outfile, optimizeCss(css, { minify }));
+  await writeFile2(outfile, optimizeCss(css2, { minify }));
   return { files, msg: ctx.messages.buildComplete(files.length) };
 }
 async function generateCssArtifactOfType(ctx, cssType, outfile) {
   let notFound = false;
-  const css = match(cssType).with("preflight", () => ctx.getResetCss(ctx)).with("tokens", () => ctx.getTokenCss(ctx)).with("static", () => ctx.getStaticCss(ctx)).with("global", () => ctx.getGlobalCss(ctx)).with("keyframes", () => ctx.getKeyframeCss(ctx)).otherwise(() => {
+  const css2 = match(cssType).with("preflight", () => ctx.getResetCss()).with("tokens", () => ctx.getTokenCss()).with("static", () => ctx.getStaticCss()).with("global", () => ctx.getGlobalCss()).with("keyframes", () => ctx.getKeyframeCss()).otherwise(() => {
     notFound = true;
   });
   if (notFound)
     return { msg: `No css artifact of type <${cssType}> was found` };
-  if (!css)
+  if (!css2)
     return { msg: `No css to generate for type <${cssType}>` };
   const minify = ctx.config.minify;
-  await writeFile2(outfile, optimizeCss(css, { minify }));
+  await writeFile2(outfile, optimizeCss(css2, { minify }));
   return { msg: `Successfully generated ${cssType} css artifact \u2728` };
 }
 
@@ -2574,8 +2711,8 @@ function parseDependency(fileOrGlob) {
 }
 
 // src/builder.ts
-var configCache = /* @__PURE__ */ new Map();
-var contentFilesCache = /* @__PURE__ */ new WeakMap();
+var fileCssMap = /* @__PURE__ */ new Map();
+var fileModifiedMap = /* @__PURE__ */ new Map();
 var limit2 = pLimit(20);
 var Builder = class {
   /**
@@ -2583,34 +2720,8 @@ var Builder = class {
    */
   context;
   hasEmitted = false;
-  configDependencies = /* @__PURE__ */ new Set();
-  writeFileCss = (file, css) => {
-    const oldCss = this.fileCssMap?.get(file) ?? "";
-    const newCss = mergeCss2(oldCss, css);
-    this.fileCssMap?.set(file, newCss);
-  };
-  checkConfigDeps = (configPath, deps) => {
-    let modified = false;
-    const newModified = /* @__PURE__ */ new Map();
-    const prevModified = configCache.get(configPath)?.depsModifiedMap;
-    for (const file of deps) {
-      const stats = fsExtra2.statSync(file, { throwIfNoEntry: false });
-      if (!stats)
-        continue;
-      const time = stats.mtimeMs;
-      newModified.set(file, time);
-      if (prevModified && (!prevModified.has(file) || time > prevModified.get(file))) {
-        modified = true;
-      }
-    }
-    if (!modified) {
-      return { isModified: false, modifiedMap: prevModified || /* @__PURE__ */ new Map() };
-    }
-    for (const file of deps) {
-      delete __require.cache[file];
-    }
-    return { isModified: true, modifiedMap: newModified };
-  };
+  hasConfigChanged = false;
+  affecteds;
   getConfigPath = () => {
     const configPath = findConfig();
     if (!configPath) {
@@ -2618,56 +2729,35 @@ var Builder = class {
     }
     return configPath;
   };
-  hasConfigChanged = false;
   setup = async (options = {}) => {
-    logger5.debug("builder", "\u{1F6A7} Setup");
+    logger6.debug("builder", "\u{1F6A7} Setup");
     const configPath = options.configPath ?? this.getConfigPath();
-    const tsOptions = this.context?.tsOptions ?? { baseUrl: void 0, pathMappings: [] };
-    const compilerOptions = this.context?.tsconfig?.compilerOptions ?? {};
-    const { deps: foundDeps } = getConfigDependencies(configPath, tsOptions, compilerOptions);
-    const cwd = options?.cwd ?? this.context?.config.cwd ?? process.cwd();
-    const configDeps = /* @__PURE__ */ new Set([...foundDeps, ...(this.context?.dependencies ?? []).map((file) => resolve2(cwd, file))]);
-    this.configDependencies = configDeps;
-    const deps = this.checkConfigDeps(configPath, configDeps);
-    this.hasConfigChanged = deps.isModified;
-    if (deps.isModified) {
-      await this.setupContext({
-        configPath,
-        depsModifiedMap: deps.modifiedMap
-      });
-      const ctx = this.getContextOrThrow();
-      logger5.debug("builder", "\u2699\uFE0F Config changed, reloading");
-      await ctx.hooks.callHook("config:change", ctx.config);
+    if (!this.context) {
+      return this.setupContext({ configPath });
     }
-    const cache = configCache.get(configPath);
-    if (cache) {
-      this.context = cache.context;
-      this.context.project.reloadSourceFiles();
-    } else {
-      await this.setupContext({
-        configPath,
-        depsModifiedMap: deps.modifiedMap
-      });
+    const ctx = this.getContextOrThrow();
+    this.affecteds = await ctx.diff.reloadConfigAndRefreshContext((conf) => {
+      this.context = new PandaContext({ ...conf, hooks: ctx.hooks });
+    });
+    this.hasConfigChanged = this.affecteds.hasConfigChanged;
+    if (this.affecteds.hasConfigChanged) {
+      logger6.debug("builder", "\u2699\uFE0F Config changed, reloading");
+      await ctx.hooks.callHook("config:change", ctx.config);
+      return;
     }
+    ctx.project.reloadSourceFiles();
   };
-  emit() {
-    if (this.hasEmitted && this.hasConfigChanged) {
-      emitArtifacts(this.getContextOrThrow());
+  async emit() {
+    if (this.hasEmitted && this.affecteds?.hasConfigChanged) {
+      await emitArtifacts(this.getContextOrThrow(), Array.from(this.affecteds.artifacts));
     }
     this.hasEmitted = true;
   }
   setupContext = async (options) => {
-    const { configPath, depsModifiedMap } = options;
-    this.context = await loadConfigAndCreateContext({ configPath });
-    configCache.set(configPath, {
-      context: this.context,
-      deps: new Set(this.context.dependencies ?? []),
-      depsModifiedMap
-    });
-    contentFilesCache.set(this.context, {
-      fileCssMap: /* @__PURE__ */ new Map(),
-      fileModifiedMap: /* @__PURE__ */ new Map()
-    });
+    const { configPath } = options;
+    const ctx = await loadConfigAndCreateContext({ configPath });
+    this.context = ctx;
+    return ctx;
   };
   getContextOrThrow = () => {
     if (!this.context) {
@@ -2675,29 +2765,23 @@ var Builder = class {
     }
     return this.context;
   };
-  get fileModifiedMap() {
-    const ctx = this.getContextOrThrow();
-    return contentFilesCache.get(ctx).fileModifiedMap;
-  }
-  get fileCssMap() {
-    const ctx = this.getContextOrThrow();
-    return contentFilesCache.get(ctx).fileCssMap;
-  }
   extractFile = async (ctx, file) => {
     const mtime = existsSync(file) ? fsExtra2.statSync(file).mtimeMs : -Infinity;
-    const isUnchanged = this.fileModifiedMap.has(file) && mtime === this.fileModifiedMap.get(file);
-    if (isUnchanged)
+    const isUnchanged = fileModifiedMap.has(file) && mtime === fileModifiedMap.get(file);
+    if (isUnchanged && !this.hasConfigChanged)
       return;
-    const css = extractFile(ctx, file);
-    if (!css)
+    const css2 = extractFile(ctx, file);
+    fileModifiedMap.set(file, mtime);
+    if (!css2) {
+      fileCssMap.delete(file);
       return;
-    this.fileModifiedMap.set(file, mtime);
-    this.writeFileCss(file, css);
-    return css;
+    }
+    fileCssMap.set(file, css2);
+    return css2;
   };
   extract = async () => {
     const ctx = this.getContextOrThrow();
-    const done = logger5.time.info("Extracted in");
+    const done = logger6.time.info("Extracted in");
     const promises = ctx.getFiles().map((file) => limit2(() => this.extractFile(ctx, file)));
     await Promise.allSettled(promises);
     done();
@@ -2705,7 +2789,7 @@ var Builder = class {
   toString = () => {
     const ctx = this.getContextOrThrow();
     return ctx.getCss({
-      files: Array.from(this.fileCssMap.values()),
+      files: Array.from(fileCssMap.values()),
       resolve: true
     });
   };
@@ -2737,10 +2821,7 @@ var Builder = class {
         fn(dependency);
       }
     }
-    for (const file of ctx.dependencies) {
-      fn({ type: "dependency", file: resolve2(file) });
-    }
-    for (const file of this.configDependencies) {
+    for (const file of ctx.conf.dependencies) {
       fn({ type: "dependency", file: resolve2(file) });
     }
   };
@@ -2748,18 +2829,18 @@ var Builder = class {
 
 // src/debug-files.ts
 init_esm_shims();
-import { colors, logger as logger6 } from "@pandacss/logger";
+import { colors, logger as logger7 } from "@pandacss/logger";
 import * as nodePath from "path";
 async function debugFiles(ctx, options) {
   const files = ctx.getFiles();
-  const measureTotal = logger6.time.debug(`Done parsing ${files.length} files`);
+  const measureTotal = logger7.time.debug(`Done parsing ${files.length} files`);
   ctx.config.minify = false;
   ctx.config.optimize = true;
   const { fs, path: path2 } = ctx.runtime;
   const outdir = options.outdir;
   if (!options.dry && outdir) {
     fs.ensureDirSync(outdir);
-    logger6.info("cli", `Writing ${colors.bold(`${outdir}/config.json`)}`);
+    logger7.info("cli", `Writing ${colors.bold(`${outdir}/config.json`)}`);
     await fs.writeFile(`${outdir}/config.json`, JSON.stringify(ctx.config, null, 2));
   }
   if (options.onlyConfig) {
@@ -2769,16 +2850,16 @@ async function debugFiles(ctx, options) {
   const filesWithCss = [];
   await Promise.allSettled(
     files.map(async (file) => {
-      const measure = logger6.time.debug(`Parsed ${file}`);
+      const measure = logger7.time.debug(`Parsed ${file}`);
       const result = ctx.project.parseSourceFile(file);
       measure();
       if (!result)
         return;
-      const css = ctx.getParserCss(result);
-      if (!css)
+      const css2 = ctx.getParserCss(result);
+      if (!css2)
         return;
       if (options.dry) {
-        console.log({ path: file, ast: result, code: css });
+        console.log({ path: file, ast: result, code: css2 });
         return Promise.resolve();
       }
       if (outdir) {
@@ -2787,22 +2868,22 @@ async function debugFiles(ctx, options) {
         const relative3 = path2.relative(ctx.config.cwd, parsedPath.dir);
         const astJsonPath = `${relative3}/${parsedPath.name}.ast.json`.replaceAll(path2.sep, "__");
         const cssPath = `${relative3}/${parsedPath.name}.css`.replaceAll(path2.sep, "__");
-        logger6.info("cli", `Writing ${colors.bold(`${outdir}/${astJsonPath}`)}`);
-        logger6.info("cli", `Writing ${colors.bold(`${outdir}/${cssPath}`)}`);
+        logger7.info("cli", `Writing ${colors.bold(`${outdir}/${astJsonPath}`)}`);
+        logger7.info("cli", `Writing ${colors.bold(`${outdir}/${cssPath}`)}`);
         return Promise.allSettled([
           fs.writeFile(`${outdir}/${astJsonPath}`, JSON.stringify(result.toJSON(), null, 2)),
-          fs.writeFile(`${outdir}/${cssPath}`, css)
+          fs.writeFile(`${outdir}/${cssPath}`, css2)
         ]);
       }
     })
   );
-  logger6.info("cli", `Found ${colors.bold(`${filesWithCss.length}/${files.length}`)} files using Panda`);
+  logger7.info("cli", `Found ${colors.bold(`${filesWithCss.length}/${files.length}`)} files using Panda`);
   measureTotal();
 }
 
 // src/exec-command.ts
 init_esm_shims();
-import { logger as logger7 } from "@pandacss/logger";
+import { logger as logger8 } from "@pandacss/logger";
 import { spawnSync } from "child_process";
 import getPackageManager from "preferred-pm";
 async function execCommand(cmd, cwd) {
@@ -2814,66 +2895,56 @@ async function execCommand(cmd, cwd) {
   }
   const check = spawnSync(pm, args, { cwd, stdio: "pipe" });
   if (check.status !== 0) {
-    logger7.error("exec", check.stderr.toString());
+    logger8.error("exec", check.stderr.toString());
   }
 }
 
 // src/generate.ts
 init_esm_shims();
-import { logger as logger8 } from "@pandacss/logger";
+import { logger as logger9 } from "@pandacss/logger";
 import { match as match2 } from "ts-pattern";
-
-// src/load-context.ts
-init_esm_shims();
-var loadContext = async (config, configPath) => {
-  const ctxRef = { current: void 0 };
-  const load = async () => {
-    const ctx = await loadConfigAndCreateContext({ config, configPath });
-    ctxRef.current = ctx;
-  };
-  await load();
-  return [ctxRef, load];
-};
-
-// src/generate.ts
-async function build(ctx) {
-  const { msg } = await emitArtfifactsAndCssChunks(ctx);
-  logger8.info("css:emit", msg);
+async function build(ctx, ids) {
+  await emitArtifacts(ctx, ids);
+  if (ctx.config.emitTokensOnly) {
+    return logger9.info("css:emit", "Successfully rebuilt the css variables and js function to query your tokens \u2728");
+  }
+  const { msg } = await writeAndBundleCssChunks(ctx);
+  logger9.info("css:emit", msg);
 }
 async function generate(config, configPath) {
-  const [ctxRef, loadCtx] = await loadContext(config, configPath);
-  const ctx = ctxRef.current;
+  const ctx = await loadConfigAndCreateContext({ config, configPath });
   await build(ctx);
   const {
     runtime: { fs, path: path2 },
-    dependencies,
     config: { cwd }
   } = ctx;
   if (ctx.config.watch) {
-    const configWatcher = fs.watch({ include: dependencies });
+    const configWatcher = fs.watch({ include: ctx.conf.dependencies });
     configWatcher.on("change", async () => {
-      logger8.info("config:change", "Config changed, restarting...");
-      await loadCtx();
-      await ctxRef.current.hooks.callHook("config:change", ctxRef.current.config);
-      return build(ctxRef.current);
+      const affecteds = await ctx.diff.reloadConfigAndRefreshContext();
+      if (!affecteds.artifacts.size)
+        return;
+      logger9.info("config:change", "Config changed, restarting...");
+      await ctx.hooks.callHook("config:change", ctx.config);
+      return build(ctx, Array.from(affecteds.artifacts));
     });
     const contentWatcher = fs.watch(ctx.config);
     contentWatcher.on("all", async (event, file) => {
-      logger8.info(`file:${event}`, file);
+      logger9.info(`file:${event}`, file);
       match2(event).with("unlink", () => {
         ctx.project.removeSourceFile(path2.abs(cwd, file));
         ctx.chunks.rm(file);
       }).with("change", async () => {
         ctx.project.reloadSourceFile(file);
-        await writeFileChunk(ctxRef.current, file);
-        return bundleStyleChunksWithImports(ctxRef.current);
+        await writeFileChunk(ctx, file);
+        return bundleStyleChunksWithImports(ctx);
       }).with("add", async () => {
         ctx.project.createSourceFile(file);
-        return bundleStyleChunksWithImports(ctxRef.current);
+        return bundleStyleChunksWithImports(ctx);
       }).otherwise(() => {
       });
     });
-    logger8.info("ctx:watch", ctx.messages.watch());
+    logger9.info("ctx:watch", ctx.messages.watch());
   }
 }
 
@@ -2905,7 +2976,7 @@ function setupGitIgnore(ctx) {
 // src/setup-config.ts
 init_esm_shims();
 import { messages } from "@pandacss/generator";
-import { logger as logger9, quote } from "@pandacss/logger";
+import { logger as logger10, quote } from "@pandacss/logger";
 import fsExtra3 from "fs-extra";
 import { lookItUpSync as lookItUpSync3 } from "look-it-up";
 import { outdent as outdent2 } from "outdent";
@@ -2920,9 +2991,9 @@ async function setupConfig(cwd, opts = {}) {
   const cmd = pm === "npm" ? "npm run" : pm;
   const isTs = lookItUpSync3("tsconfig.json", cwd);
   const file = isTs ? "panda.config.ts" : "panda.config.mjs";
-  logger9.info("init:config", `creating panda config file: ${quote(file)}`);
+  logger10.info("init:config", `creating panda config file: ${quote(file)}`);
   if (!force && configFile) {
-    logger9.warn("init:config", messages.configExists(cmd));
+    logger10.warn("init:config", messages.configExists(cmd));
   } else {
     const content = outdent2`
 import { defineConfig } from "@pandacss/dev"
@@ -2955,11 +3026,11 @@ syntax: '${syntax}'` : ""}
 })
     `;
     await fsExtra3.writeFile(join2(cwd, file), prettier.format(content));
-    logger9.log(messages.thankYou());
+    logger10.log(messages.thankYou());
   }
 }
 async function setupPostcss(cwd) {
-  logger9.info("init:postcss", `creating postcss config file: ${quote("postcss.config.cjs")}`);
+  logger10.info("init:postcss", `creating postcss config file: ${quote("postcss.config.cjs")}`);
   const content = outdent2`
 module.exports = {
   plugins: {
@@ -2972,7 +3043,7 @@ module.exports = {
 
 // src/ship-files.ts
 init_esm_shims();
-import { colors as colors2, logger as logger10 } from "@pandacss/logger";
+import { colors as colors2, logger as logger11 } from "@pandacss/logger";
 import { createParserResult as createParserResult2 } from "@pandacss/parser";
 import { writeFile as writeFile3 } from "fs/promises";
 import * as path from "path";
@@ -2984,29 +3055,28 @@ async function shipFiles(ctx, outfile) {
     const result = ctx.project.parseSourceFile(file);
     if (!result || result.isEmpty())
       return;
-    const css = ctx.getParserCss(result);
-    if (!css)
+    const css2 = ctx.getParserCss(result);
+    if (!css2)
       return;
     extractResult.merge(result);
     filesWithCss.push(path.relative(ctx.config.cwd, file));
   });
-  logger10.info("cli", `Found ${colors2.bold(`${filesWithCss.length}/${files.length}`)} files using Panda`);
+  logger11.info("cli", `Found ${colors2.bold(`${filesWithCss.length}/${files.length}`)} files using Panda`);
   const minify = ctx.config.minify;
-  logger10.info("cli", `Writing ${minify ? "[min] " : " "}${colors2.bold(outfile)}`);
+  logger11.info("cli", `Writing ${minify ? "[min] " : " "}${colors2.bold(outfile)}`);
   const output = JSON.stringify(extractResult.toJSON(), null, minify ? 0 : 2);
   const dirname2 = ctx.runtime.path.dirname(outfile);
   ctx.runtime.fs.ensureDirSync(dirname2);
   await writeFile3(outfile, output);
-  logger10.info("cli", "Done!");
+  logger11.info("cli", "Done!");
 }
 export {
   Builder,
+  PandaContext,
   analyzeTokens,
   bundleCss,
   bundleMinimalFilesCss,
-  createContext,
   debugFiles,
-  emitArtfifactsAndCssChunks,
   emitArtifacts,
   execCommand,
   extractFile,