@salty-css/core 0.0.1-alpha.300 → 0.0.1-alpha.301

package/compiler/index.cjs

@@ -1 +1,774 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("esbuild");require("child_process");require("../dash-case-BJEkFEGQ.cjs");require("path");require("fs");require("fs/promises");require("../parse-styles-B1E0JeC7.cjs");require("../parsers/index.cjs");const e=require("../index-ol1Q_xul.cjs");require("../css/merge.cjs");require("../define-templates-Cunsb_Tr.cjs");require("../helpers-CC5pFyba.cjs");exports.compileSaltyFile=e.compileSaltyFile;exports.generateConfigStyles=e.generateConfigStyles;exports.generateCss=e.generateCss;exports.generateFile=e.generateFile;exports.isSaltyFile=e.isSaltyFile;exports.minimizeFile=e.minimizeFile;exports.saltyFileExtensions=e.saltyFileExtensions;exports.saltyFileRegExp=e.saltyFileRegExp;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const esbuild = require("esbuild");
+const child_process = require("child_process");
+const vm = require("vm");
+const dashCase = require("../dash-case-Cz8wwE9a.cjs");
+const path = require("path");
+const fs = require("fs");
+const promises = require("fs/promises");
+const parseStyles = require("../parse-styles-D-p_guRO.cjs");
+const parsers_index = require("../parsers/index.cjs");
+const winston = require("winston");
+const css_merge = require("../css/merge.cjs");
+const defineTemplates = require("../define-templates-Deq1aCbN.cjs");
+const ts = require("typescript");
+const helpers = require("../helpers-wv74jTRI.cjs");
+var _documentCurrentScript = typeof document !== "undefined" ? document.currentScript : null;
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const esbuild__namespace = /* @__PURE__ */ _interopNamespaceDefault(esbuild);
+const getPackageJsonPath = (dirname) => {
+  if (!dirname || dirname === "/") throw new Error("Could not find package.json file");
+  const packageJsonPath = path.join(dirname, "package.json");
+  if (!fs.existsSync(packageJsonPath)) return getPackageJsonPath(path.join(dirname, ".."));
+  return packageJsonPath;
+};
+const getPackageJson = async (dirname) => {
+  const packageJsonPath = getPackageJsonPath(dirname);
+  const packageJsonContent = await promises.readFile(packageJsonPath, "utf-8").then(JSON.parse).catch(() => void 0);
+  return packageJsonContent;
+};
+const readPackageJsonModule = async (dirname) => {
+  const packageJsonContent = await getPackageJson(dirname);
+  if (!packageJsonContent) return void 0;
+  return packageJsonContent.type;
+};
+let cachedModuleType;
+const detectCurrentModuleType = async (dirname) => {
+  if (cachedModuleType) return cachedModuleType;
+  const packageJsonModule = await readPackageJsonModule(dirname);
+  if (packageJsonModule === "module") cachedModuleType = "esm";
+  else if (packageJsonModule === "commonjs") cachedModuleType = "cjs";
+  else if ((typeof document === "undefined" ? require("url").pathToFileURL(__filename).href : _documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === "SCRIPT" && _documentCurrentScript.src || new URL("compiler/index.cjs", document.baseURI).href).endsWith(".cjs")) cachedModuleType = "cjs";
+  return cachedModuleType || "esm";
+};
+const logger = winston.createLogger({
+  level: "debug",
+  format: winston.format.combine(winston.format.colorize(), winston.format.cli()),
+  transports: [new winston.transports.Console({})]
+});
+const logError = (message) => {
+  logger.error(message);
+};
+function dotCase(str) {
+  if (!str) return "";
+  if (typeof str !== "string") return dotCase(String(str));
+  return str.replace(/[^\d\w]/g, ".");
+}
+const saltyReset = {
+  /** Set box model to border-box */
+  "*, *::before, *::after": {
+    boxSizing: "border-box"
+  },
+  /** Remove default margin and padding */
+  "*": {
+    margin: 0
+  },
+  /** Remove adjust font properties */
+  html: {
+    lineHeight: 1.15,
+    textSizeAdjust: "100%",
+    WebkitFontSmoothing: "antialiased"
+  },
+  /** Make media elements responsive */
+  "img, picture, video, canvas, svg": {
+    display: "block",
+    maxWidth: "100%"
+  },
+  /** Avoid overflow of text */
+  "p, h1, h2, h3, h4, h5, h6": {
+    overflowWrap: "break-word"
+  },
+  /** Improve text wrapping */
+  p: {
+    textWrap: "pretty"
+  },
+  "h1, h2, h3, h4, h5, h6": {
+    textWrap: "balance"
+  },
+  /** Improve link color */
+  a: {
+    color: "currentColor"
+  },
+  /** Improve button line height */
+  button: {
+    lineHeight: "1em",
+    color: "currentColor"
+  },
+  /** Improve form elements */
+  "input, optgroup, select, textarea": {
+    fontFamily: "inherit",
+    fontSize: "100%",
+    lineHeight: "1.15em"
+  }
+};
+const getFunctionRange = (contents, name) => {
+  return new Promise((resolve, reject) => {
+    const timeout = setTimeout(() => {
+      reject(new Error("Timeout"));
+    }, 100);
+    const sourceFile = ts.createSourceFile("temp.ts", contents, ts.ScriptTarget.Latest, true);
+    function visit(node) {
+      if (ts.isVariableDeclaration(node) && node.name.getText() === name) {
+        const start = node.getStart();
+        const end = node.getEnd();
+        clearTimeout(timeout);
+        resolve([start, end]);
+      }
+      node.forEachChild(visit);
+    }
+    visit(sourceFile);
+  });
+};
+const cache = {
+  externalModules: [],
+  rcFile: void 0,
+  destDir: void 0
+};
+const getExternalModules = (coreConfigPath) => {
+  if (cache.externalModules.length > 0) return cache.externalModules;
+  const content = fs.readFileSync(coreConfigPath, "utf8");
+  const match = content.match(/externalModules:\s?\[(.*)\]/);
+  if (!match) return [];
+  const externalModules = match[1].split(",").map((d) => d.replace(/['"`]/g, "").trim());
+  cache.externalModules = externalModules;
+  return externalModules;
+};
+const getDestDir = async (dirname) => {
+  if (cache.destDir) return cache.destDir;
+  const projectConfig = await getRCProjectConfig(dirname);
+  const destDir = path.join(dirname, (projectConfig == null ? void 0 : projectConfig.saltygenDir) || "saltygen");
+  cache.destDir = destDir;
+  return destDir;
+};
+const saltyFileExtensions = ["salty", "css", "styles", "styled"];
+const saltyFileRegExp = (additional = []) => new RegExp(`\\.(${[...saltyFileExtensions, ...additional].join("|")})\\.`);
+const isSaltyFile = (file, additional = []) => saltyFileRegExp(additional).test(file);
+const readRCFile = async (currentDir) => {
+  if (cache.rcFile) return cache.rcFile;
+  if (currentDir === "/") throw new Error("Could not find .saltyrc.json file");
+  const rcPath = path.join(currentDir, ".saltyrc.json");
+  const rcContent = await promises.readFile(rcPath, "utf-8").then(JSON.parse).catch(() => void 0);
+  if (!rcContent) return readRCFile(path.join(currentDir, ".."));
+  cache.rcFile = rcContent;
+  return rcContent;
+};
+const getRCProjectConfig = async (dirname) => {
+  var _a, _b;
+  const rcFile = await readRCFile(dirname);
+  const projectConfig = (_a = rcFile.projects) == null ? void 0 : _a.find((project) => dirname.endsWith(project.dir || ""));
+  if (!projectConfig) return (_b = rcFile.projects) == null ? void 0 : _b.find((project) => project.dir === rcFile.defaultProject);
+  return projectConfig;
+};
+const generateConfig = async (dirname) => {
+  const rcProject = await getRCProjectConfig(dirname);
+  const destDir = await getDestDir(dirname);
+  const coreConfigPath = path.join(dirname, (rcProject == null ? void 0 : rcProject.configDir) || "", "salty.config.ts");
+  const coreConfigDest = path.join(destDir, "salty.config.js");
+  await detectCurrentModuleType(dirname);
+  const externalModules = getExternalModules(coreConfigPath);
+  await esbuild__namespace.build({
+    entryPoints: [coreConfigPath],
+    minify: true,
+    treeShaking: true,
+    bundle: true,
+    outfile: coreConfigDest,
+    format: "cjs",
+    external: externalModules
+  });
+  const raw = await promises.readFile(coreConfigDest, "utf8");
+  const scriptReal = new vm.Script(raw);
+  const context = { module: { exports: {} } };
+  scriptReal.runInNewContext(context);
+  const { config } = context.module.exports;
+  return {
+    config,
+    path: coreConfigDest
+  };
+};
+const generateConfigStyles = async (dirname, configFiles) => {
+  var _a, _b;
+  const destDir = await getDestDir(dirname);
+  const generationResults = {
+    mediaQueries: [],
+    globalStyles: [],
+    variables: [],
+    templates: []
+  };
+  await Promise.all(
+    [...configFiles].map(async (src) => {
+      const { contents, outputFilePath } = await compileSaltyFile(dirname, src, destDir);
+      Object.entries(contents).forEach(([name, value]) => {
+        if (value.isMedia) generationResults.mediaQueries.push([name, value]);
+        else if (value.isGlobalDefine) generationResults.globalStyles.push(value);
+        else if (value.isDefineVariables) generationResults.variables.push(value);
+        else if (value.isDefineTemplates) generationResults.templates.push(value._setPath(`${name};;${outputFilePath}`));
+      });
+    })
+  );
+  const { config, path: configPath } = await generateConfig(dirname);
+  const configCacheContent = { ...config };
+  const { mediaQueries } = generationResults;
+  configCacheContent.mediaQueries = Object.fromEntries(mediaQueries.map(([name, value]) => [`@${name}`, value]));
+  const mediaQueryKeys = mediaQueries.map(([name]) => `'@${name}'`).join(" | ");
+  const variableTokens = /* @__PURE__ */ new Set();
+  const parseVariables = async (obj, path2 = []) => {
+    if (!obj) return [];
+    const promises2 = Object.entries(obj).map(async ([key, value]) => {
+      const parseVariable = async (value2) => {
+        if (!value2) return void 0;
+        if (value2 instanceof Promise) return await parseVariable(await value2);
+        if (typeof value2 === "function") return await parseVariable(await value2());
+        if (typeof value2 === "object") return await parseVariables(value2, [...path2, key]);
+        const dottedKey = dotCase(key);
+        const dashedKey = dashCase.dashCase(key);
+        const tsName = [...path2, dottedKey].join(".");
+        variableTokens.add(`"${tsName}"`);
+        const cssName = [...path2.map(dashCase.dashCase), dashedKey].join("-");
+        const result = parseStyles.parseVariableTokens(value2);
+        if (!result) return `--${cssName}: ${value2};`;
+        return `--${cssName}: ${result.transformed};`;
+      };
+      return await parseVariable(value);
+    });
+    const results = await Promise.all(promises2);
+    return results.flat();
+  };
+  const parseResponsiveVariables = async (obj) => {
+    if (!obj) return [];
+    const promises2 = Object.entries(obj).map(async ([mediaQuery, values]) => {
+      const variables = await parseVariables(values);
+      if (mediaQuery === "base") return variables.join("");
+      if (configCacheContent.mediaQueries[mediaQuery]) {
+        const mediaQueryValue = configCacheContent.mediaQueries[mediaQuery];
+        return `${mediaQueryValue} { ${variables.join("")} }`;
+      }
+      return `${mediaQuery} { ${variables.join("")} }`;
+    });
+    const results = await Promise.all(promises2);
+    return results.flat();
+  };
+  const parseConditionalVariables = async (obj) => {
+    if (!obj) return [];
+    const promises2 = Object.entries(obj).map(async ([property, conditions]) => {
+      const promises22 = Object.entries(conditions).map(async ([condition, values]) => {
+        const variables = await parseVariables(values, [property]);
+        const conditionScope = `.${property}-${condition}, [data-${property}="${condition}"]`;
+        const combined = variables.join("");
+        return `${conditionScope} { ${combined} }`;
+      });
+      const result = await Promise.all(promises22);
+      return result.flat();
+    });
+    const results = await Promise.all(promises2);
+    return results.flat();
+  };
+  const getStaticVariables = (variables = {}) => {
+    return { ...variables, responsive: void 0, conditional: void 0 };
+  };
+  const getGeneratedVariables = (type) => {
+    return generationResults.variables.map((factory) => {
+      if (type === "static") return getStaticVariables(factory._current);
+      return factory._current[type];
+    });
+  };
+  const _staticVariables = css_merge.mergeObjects(getStaticVariables(config.variables), getGeneratedVariables("static"));
+  const staticVariables = await parseVariables(_staticVariables);
+  const _responsiveVariables = css_merge.mergeObjects((_a = config.variables) == null ? void 0 : _a.responsive, getGeneratedVariables("responsive"));
+  const responsiveVariables = await parseResponsiveVariables(_responsiveVariables);
+  const _conditionalVariables = css_merge.mergeObjects((_b = config.variables) == null ? void 0 : _b.conditional, getGeneratedVariables("conditional"));
+  const conditionalVariables = await parseConditionalVariables(_conditionalVariables);
+  const variablesPath = path.join(destDir, "css/_variables.css");
+  const variablesCss = `:root { ${staticVariables.join("")} ${responsiveVariables.join("")} } ${conditionalVariables.join("")}`;
+  fs.writeFileSync(variablesPath, variablesCss);
+  configCacheContent.staticVariables = _staticVariables;
+  const globalStylesPath = path.join(destDir, "css/_global.css");
+  const mergedGlobalStyles = css_merge.mergeObjects(config.global, generationResults.globalStyles);
+  const globalStylesString = await parseStyles.parseAndJoinStyles(mergedGlobalStyles, "");
+  fs.writeFileSync(globalStylesPath, `@layer global { ${globalStylesString} }`);
+  const resetStylesPath = path.join(destDir, "css/_reset.css");
+  const getResetStyles = () => {
+    if (config.reset === "none") return {};
+    if (typeof config.reset === "object") return config.reset;
+    return saltyReset;
+  };
+  const resetStyles = getResetStyles();
+  const resetStylesString = await parseStyles.parseAndJoinStyles(resetStyles, "");
+  fs.writeFileSync(resetStylesPath, `@layer reset { ${resetStylesString} }`);
+  const templateStylesPath = path.join(destDir, "css/_templates.css");
+  const templates = css_merge.mergeObjects(config.templates, generationResults.templates);
+  const templateStylesString = await parsers_index.parseTemplates(templates);
+  const templateTokens = parsers_index.getTemplateTypes(templates);
+  fs.writeFileSync(templateStylesPath, `@layer templates { ${templateStylesString} }`);
+  configCacheContent.templates = templates;
+  const configTemplateFactories = config.templates ? [defineTemplates.defineTemplates(config.templates)._setPath(`config;;${configPath}`)] : [];
+  const templateFactories = css_merge.mergeFactories(generationResults.templates, configTemplateFactories);
+  configCacheContent.templatePaths = Object.fromEntries(Object.entries(templateFactories).map(([key, faktory]) => [key, faktory._path]));
+  const tsTokensPath = path.join(destDir, "types/css-tokens.d.ts");
+  const tsVariableTokens = [...variableTokens].join("|");
+  const tsTokensTypes = `
+  // Variable types
+  type VariableTokens = ${tsVariableTokens || `''`}; 
+  type PropertyValueToken = \`{\${VariableTokens}}\`;
+
+  // Template types
+  type TemplateTokens = {
+    ${Object.entries(templateTokens).map(([key, value]) => `${key}?: ${value}`).join("\n")}
+  }
+
+  // Media query types
+  type MediaQueryKeys = ${mediaQueryKeys || `''`};
+  `;
+  fs.writeFileSync(tsTokensPath, tsTokensTypes);
+  const configCachePath = path.join(destDir, "cache/config-cache.json");
+  fs.writeFileSync(configCachePath, JSON.stringify(configCacheContent, null, 2));
+  const corePackageRoot = helpers.getCorePackageRoot();
+  const configCacheSecondaryPath = path.join(corePackageRoot, "cache/config-cache.json");
+  fs.writeFileSync(configCacheSecondaryPath, JSON.stringify(configCacheContent, null, 2));
+};
+const replaceStyledTag = (currentFile) => {
+  return currentFile.replace(/styled\(([^"'`{,]+),/g, (match, tag) => {
+    const isString = /^['"`]/.test(tag);
+    if (isString) return match;
+    const isImportedRegExp = new RegExp(`import[^;]*${tag}[,\\s{][^;]*from\\s?([^{};]+);`);
+    const isImported = isImportedRegExp.test(currentFile);
+    if (!isImported) return match;
+    const importResult = isImportedRegExp.exec(currentFile);
+    if (importResult) {
+      const importPath = importResult.at(1);
+      const isSaltyImport = saltyFileExtensions.some((ext) => importPath == null ? void 0 : importPath.includes(ext));
+      if (isSaltyImport) return match;
+    }
+    return "styled('div',";
+  });
+};
+const addConfigCache = (currentFile, dirname) => {
+  try {
+    const saltyCachedConfig = fs.readFileSync(path.join(dirname, "saltygen/cache/config-cache.json"), "utf8");
+    if (!saltyCachedConfig) return `globalThis.saltyConfig = {};
+
+${currentFile}`;
+    return `globalThis.saltyConfig = ${saltyCachedConfig};
+
+${currentFile}`;
+  } catch {
+    return currentFile;
+  }
+};
+const compileSaltyFile = async (dirname, sourceFilePath, outputDirectory) => {
+  const hashedName = dashCase.toHash(sourceFilePath);
+  const tempDir = path.join(outputDirectory, "./temp");
+  if (!fs.existsSync(tempDir)) fs.mkdirSync(tempDir);
+  const parsed = path.parse(sourceFilePath);
+  let currentFile = fs.readFileSync(sourceFilePath, "utf8");
+  currentFile = replaceStyledTag(currentFile);
+  currentFile = addConfigCache(currentFile, dirname);
+  const outputFilePath = path.join(outputDirectory, "js", hashedName + ".js");
+  const rcProject = await getRCProjectConfig(dirname);
+  const coreConfigPath = path.join(dirname, (rcProject == null ? void 0 : rcProject.configDir) || "", "salty.config.ts");
+  const externalModules = getExternalModules(coreConfigPath);
+  await detectCurrentModuleType(dirname);
+  await esbuild__namespace.build({
+    stdin: {
+      contents: currentFile,
+      sourcefile: parsed.base,
+      resolveDir: parsed.dir,
+      loader: "tsx"
+    },
+    minify: false,
+    treeShaking: true,
+    bundle: true,
+    outfile: outputFilePath,
+    format: "cjs",
+    target: ["node20"],
+    keepNames: true,
+    external: externalModules,
+    packages: "external",
+    plugins: [
+      {
+        name: "test",
+        setup: (build) => {
+          build.onLoad({ filter: /.*\.css|salty|styles|styled\.ts/ }, (args) => {
+            const original = fs.readFileSync(args.path, "utf8");
+            const modified = replaceStyledTag(original);
+            return { contents: modified, loader: "ts" };
+          });
+        }
+      }
+    ]
+  });
+  const context = { module: { exports: {} } };
+  const raw = await promises.readFile(outputFilePath, "utf8");
+  new vm.Script(raw).runInNewContext(context);
+  return {
+    contents: context.module.exports,
+    outputFilePath
+  };
+};
+const getConfigCache = async (dirname) => {
+  const destDir = await getDestDir(dirname);
+  const coreConfigDest = path.join(destDir, "cache/config-cache.json");
+  const contents = fs.readFileSync(coreConfigDest, "utf8");
+  if (!contents) throw new Error("Could not find config cache file");
+  return JSON.parse(contents);
+};
+const getConfig = async (dirname) => {
+  const cached = await getConfigCache(dirname);
+  const destDir = await getDestDir(dirname);
+  const coreConfigDest = path.join(destDir, "salty.config.js");
+  const context = { module: { exports: {} } };
+  const raw = await promises.readFile(coreConfigDest, "utf8");
+  new vm.Script(raw).runInNewContext(context);
+  const { config } = context.module.exports;
+  return css_merge.mergeObjects(config, cached);
+};
+const isProduction = () => {
+  try {
+    return process.env["NODE_ENV"] === "production";
+  } catch {
+    return false;
+  }
+};
+const generateCss = async (dirname, prod = isProduction(), clean = true) => {
+  try {
+    const start = Date.now();
+    if (prod) logger.info("Generating CSS in production mode! 🔥");
+    else logger.info("Generating CSS in development mode! 🚀");
+    const globalCssFiles = [];
+    const cssFiles = [];
+    const destDir = await getDestDir(dirname);
+    const cssFile = path.join(destDir, "index.css");
+    const clearDistDir = () => {
+      if (fs.existsSync(destDir)) child_process.execSync("rm -rf " + destDir);
+      fs.mkdirSync(destDir, { recursive: true });
+      fs.mkdirSync(path.join(destDir, "css"));
+      fs.mkdirSync(path.join(destDir, "types"));
+      fs.mkdirSync(path.join(destDir, "js"));
+      fs.mkdirSync(path.join(destDir, "cache"));
+    };
+    if (clean) clearDistDir();
+    const files = /* @__PURE__ */ new Set();
+    const configFiles = /* @__PURE__ */ new Set();
+    async function collectFiles(src) {
+      const foldersToSkip = ["node_modules", "saltygen"];
+      const stats = fs.statSync(src);
+      if (stats.isDirectory()) {
+        const files2 = fs.readdirSync(src);
+        const shouldSkip = foldersToSkip.some((folder) => src.includes(folder));
+        if (shouldSkip) return;
+        await Promise.all(files2.map((file) => collectFiles(path.join(src, file))));
+      } else if (stats.isFile()) {
+        const validFile = isSaltyFile(src);
+        if (validFile) {
+          files.add(src);
+          const contents = fs.readFileSync(src, "utf8");
+          const hasDefineFunction = /define[\w\d]+\(/.test(contents);
+          if (hasDefineFunction) configFiles.add(src);
+        }
+      }
+    }
+    await collectFiles(dirname);
+    await generateConfigStyles(dirname, configFiles);
+    const generationResults = {
+      keyframes: [],
+      components: [],
+      classNames: []
+    };
+    await Promise.all(
+      [...files].map(async (src) => {
+        const { contents } = await compileSaltyFile(dirname, src, destDir);
+        for (let [name, value] of Object.entries(contents)) {
+          const resolved = await helpers.resolveExportValue(value, 1);
+          if (resolved.isKeyframes) {
+            generationResults.keyframes.push({
+              value: resolved,
+              src,
+              name
+            });
+          } else if (resolved.isClassName) {
+            generationResults.classNames.push({
+              ...value,
+              src,
+              name
+            });
+          } else if (resolved.generator) {
+            generationResults.components.push({
+              ...value,
+              src,
+              name
+            });
+          }
+        }
+      })
+    );
+    const config = await getConfig(dirname);
+    for (const keyframes of generationResults.keyframes) {
+      const { value } = keyframes;
+      const fileName = `a_${value.animationName}.css`;
+      const filePath = `css/${fileName}`;
+      const cssPath = path.join(destDir, filePath);
+      globalCssFiles.push(fileName);
+      fs.writeFileSync(cssPath, value.css);
+    }
+    const localCssFiles = {};
+    for (const componentResult of generationResults.components) {
+      const { src, name } = componentResult;
+      if (!localCssFiles[src]) localCssFiles[src] = [];
+      const generator = componentResult.generator._withBuildContext({
+        callerName: name,
+        isProduction: prod,
+        config
+      });
+      if (!cssFiles[generator.priority]) cssFiles[generator.priority] = [];
+      const styles = await generator.css;
+      if (!styles) continue;
+      cssFiles[generator.priority].push(generator.cssFileName);
+      const filePath = `css/${generator.cssFileName}`;
+      const cssPath = path.join(destDir, filePath);
+      fs.writeFileSync(cssPath, styles);
+      if (config.importStrategy === "component") {
+        localCssFiles[src].push(generator.cssFileName);
+      }
+    }
+    for (const classNameResult of generationResults.classNames) {
+      const { src, name } = classNameResult;
+      if (!localCssFiles[src]) localCssFiles[src] = [];
+      const generator = classNameResult.generator._withBuildContext({
+        callerName: name,
+        isProduction: prod,
+        config
+      });
+      const styles = await generator.css;
+      if (!styles) continue;
+      if (!cssFiles[generator.priority]) cssFiles[generator.priority] = [];
+      cssFiles[generator.priority].push(generator.cssFileName);
+      const filePath = `css/${generator.cssFileName}`;
+      const cssPath = path.join(destDir, filePath);
+      fs.writeFileSync(cssPath, styles);
+      if (config.importStrategy === "component") {
+        localCssFiles[src].push(generator.cssFileName);
+      }
+    }
+    if (config.importStrategy === "component") {
+      Object.entries(localCssFiles).forEach(([src, localCssFile]) => {
+        const cssContent2 = localCssFile.map((file) => `@import url('./${file}');`).join("\n");
+        const hashName = dashCase.toHash(src, 6);
+        const parsedPath = path.parse(src);
+        const dasherized = dashCase.dashCase(parsedPath.name);
+        const cssFile2 = path.join(destDir, `css/f_${dasherized}-${hashName}.css`);
+        fs.writeFileSync(cssFile2, cssContent2 || `/* Empty file */`);
+      });
+    }
+    const otherGlobalCssFiles = globalCssFiles.map((file) => `@import url('./css/${file}');`).join("\n");
+    const globalCssFilenames = ["_variables.css", "_reset.css", "_global.css", "_templates.css"];
+    const importsWithData = globalCssFilenames.filter((file) => {
+      try {
+        const data = fs.readFileSync(path.join(destDir, "css", file), "utf8");
+        return data.length > 0;
+      } catch {
+        return false;
+      }
+    });
+    const globalImports = importsWithData.map((file) => `@import url('./css/${file}');`);
+    const generatorText = "/*!\n * Generated with Salty CSS (https://salty-css.dev)\n * Do not edit this file directly\n */\n";
+    let cssContent = `${generatorText}@layer reset, global, templates, l0, l1, l2, l3, l4, l5, l6, l7, l8;
+
+${globalImports.join(
+      "\n"
+    )}
+${otherGlobalCssFiles}`;
+    if (config.importStrategy !== "component") {
+      const mergedContent = cssFiles.reduce((acc, val, layer) => {
+        const layerContent = val.reduce((layerAcc, file) => {
+          var _a;
+          const filepath = path.join(destDir, "css", file);
+          const css = fs.readFileSync(filepath, "utf8");
+          const filepathHash = ((_a = /.*-([^-]+)-\d+.css/.exec(file)) == null ? void 0 : _a.at(1)) || dashCase.toHash(filepath, 6);
+          if (layerAcc.includes(filepathHash)) return layerAcc;
+          return `${layerAcc}
+/*start:${filepathHash}-${file}*/
+${css}
+/*end:${filepathHash}*/
+`;
+        }, "");
+        const layerFileName = `l_${layer}.css`;
+        const layerFilePath = path.join(destDir, "css", layerFileName);
+        const layerContentWithLayer = `@layer l${layer} { ${layerContent}
+ }`;
+        fs.writeFileSync(layerFilePath, layerContentWithLayer);
+        return `${acc}
+@import url('./css/${layerFileName}');`;
+      }, "");
+      cssContent += mergedContent;
+    }
+    fs.writeFileSync(cssFile, cssContent);
+    const end = Date.now();
+    const time = end - start;
+    const emoji = time < 200 ? "🔥" : time < 500 ? "🚀" : time < 1e3 ? "🎉" : time < 2e3 ? "🚗" : time < 5e3 ? "🤔" : "🥴";
+    logger.info(`Generated CSS in ${time}ms! ${emoji}`);
+  } catch (e) {
+    console.error(e);
+  }
+};
+const generateFile = async (dirname, file, prod = isProduction()) => {
+  try {
+    const destDir = await getDestDir(dirname);
+    const validFile = isSaltyFile(file);
+    if (validFile) {
+      const cssFiles = [];
+      const config = await getConfig(dirname);
+      const { contents } = await compileSaltyFile(dirname, file, destDir);
+      for (const [name, value] of Object.entries(contents)) {
+        const resolved = await helpers.resolveExportValue(value, 1);
+        if (resolved.isKeyframes && resolved.css) {
+          const fileName = `a_${resolved.animationName}.css`;
+          const filePath2 = `css/${fileName}`;
+          const cssPath2 = path.join(destDir, filePath2);
+          fs.writeFileSync(cssPath2, await resolved.css);
+          continue;
+        }
+        if (resolved.isClassName) {
+          const generator2 = resolved.generator._withBuildContext({
+            callerName: name,
+            isProduction: prod,
+            config
+          });
+          const styles2 = await generator2.css;
+          if (!styles2) continue;
+          if (!cssFiles[generator2.priority]) cssFiles[generator2.priority] = [];
+          cssFiles[generator2.priority].push(generator2.cssFileName);
+          const filePath2 = `css/${generator2.cssFileName}`;
+          const cssPath2 = path.join(destDir, filePath2);
+          fs.writeFileSync(cssPath2, styles2);
+          continue;
+        }
+        if (!resolved.generator) continue;
+        const generator = resolved.generator._withBuildContext({
+          callerName: name,
+          isProduction: prod,
+          config
+        });
+        const styles = await generator.css;
+        if (!styles) continue;
+        const filePath = `css/${generator.cssFileName}`;
+        const cssPath = path.join(destDir, filePath);
+        fs.writeFileSync(cssPath, styles);
+        if (!cssFiles[generator.priority]) cssFiles[generator.priority] = [];
+        cssFiles[generator.priority].push(generator.cssFileName);
+      }
+      if (config.importStrategy !== "component") {
+        cssFiles.forEach((val, layer) => {
+          const layerFileName = `l_${layer}.css`;
+          const layerFilePath = path.join(destDir, "css", layerFileName);
+          let currentLayerFileContent = fs.readFileSync(layerFilePath, "utf8");
+          val.forEach((file2) => {
+            var _a;
+            const filepath = path.join(destDir, "css", file2);
+            const filepathHash = ((_a = /.*-([^-]+)-\d+.css/.exec(file2)) == null ? void 0 : _a.at(1)) || dashCase.toHash(filepath, 6);
+            const found = currentLayerFileContent.includes(filepathHash);
+            if (!found) {
+              const css = fs.readFileSync(filepath, "utf8");
+              const newContent = `/*start:${filepathHash}-${file2}*/
+${css}
+/*end:${filepathHash}*/
+`;
+              currentLayerFileContent = `${currentLayerFileContent.replace(/\}$/, "")}
+${newContent}
+}`;
+            }
+          });
+          fs.writeFileSync(layerFilePath, currentLayerFileContent);
+        });
+      } else {
+        const cssContent = cssFiles.flat().map((file2) => `@import url('./${file2}');`).join("\n");
+        const hashName = dashCase.toHash(file, 6);
+        const parsedPath = path.parse(file);
+        const dasherized = dashCase.dashCase(parsedPath.name);
+        const cssFile = path.join(destDir, `css/f_${dasherized}-${hashName}.css`);
+        fs.writeFileSync(cssFile, cssContent || `/* Empty file */`);
+      }
+    }
+  } catch (e) {
+    console.error(e);
+  }
+};
+const minimizeFile = async (dirname, file, prod = isProduction()) => {
+  var _a, _b;
+  try {
+    const destDir = await getDestDir(dirname);
+    const validFile = isSaltyFile(file);
+    if (validFile) {
+      const original = fs.readFileSync(file, "utf8");
+      const config = await getConfig(dirname);
+      const { contents } = await compileSaltyFile(dirname, file, destDir);
+      let current = original;
+      for (const [name, value] of Object.entries(contents)) {
+        const resolved = await helpers.resolveExportValue(value, 1);
+        if (resolved.isKeyframes) continue;
+        if (!resolved.generator) continue;
+        const generator = resolved.generator._withBuildContext({
+          callerName: name,
+          isProduction: prod,
+          config
+        });
+        const [start, end] = await getFunctionRange(current, name);
+        const range = current.slice(start, end);
+        if (resolved.isClassName) {
+          const copy = current;
+          const clientVersion = ` ${name} = className("${generator.classNames}")`;
+          current = current.replace(range, clientVersion);
+          if (copy === current) console.error("Minimize file failed to change content", { name });
+        }
+        if (range.includes("styled")) {
+          const tagName = (_b = (_a = /styled\(([^,]+),/.exec(range)) == null ? void 0 : _a.at(1)) == null ? void 0 : _b.trim();
+          const copy = current;
+          const clientVersion = ` ${name} = styled(${tagName}, "${generator.classNames}", ${JSON.stringify(generator.clientProps)})`;
+          current = current.replace(range, clientVersion);
+          if (copy === current) console.error("Minimize file failed to change content", { name, tagName });
+        }
+      }
+      if (config.importStrategy === "component") {
+        const fileHash = dashCase.toHash(file, 6);
+        const parsed = path.parse(file);
+        const dasherized = dashCase.dashCase(parsed.name);
+        const cssFileName = `f_${dasherized}-${fileHash}.css`;
+        current = `import '../../saltygen/css/${cssFileName}';
+${current}`;
+      }
+      current = current.replace(`@salty-css/react/class-name`, `@salty-css/react/class-name-client`);
+      current = current.replace(`{ styled }`, `{ styledClient as styled }`);
+      current = current.replace(`@salty-css/react/styled`, `@salty-css/react/styled-client`);
+      return current;
+    }
+  } catch (e) {
+    console.error("Error in minimizeFile:", e);
+  }
+  return void 0;
+};
+exports.compileSaltyFile = compileSaltyFile;
+exports.generateConfigStyles = generateConfigStyles;
+exports.generateCss = generateCss;
+exports.generateFile = generateFile;
+exports.getConfig = getConfig;
+exports.getDestDir = getDestDir;
+exports.isSaltyFile = isSaltyFile;
+exports.logError = logError;
+exports.logger = logger;
+exports.minimizeFile = minimizeFile;
+exports.saltyFileExtensions = saltyFileExtensions;
+exports.saltyFileRegExp = saltyFileRegExp;