@salty-css/core 0.1.0-alpha.3 → 0.1.0-alpha.30

package/bin/package-json.d.ts

@@ -0,0 +1,21 @@
+import { PathLike } from 'fs';
+export declare const defaultPackageJsonPath: string;
+export interface PackageJson {
+    name?: string;
+    version?: string;
+    scripts?: Record<string, string>;
+    dependencies?: Record<string, string>;
+    devDependencies?: Record<string, string>;
+    [key: string]: unknown;
+}
+export declare const readPackageJson: (filePath?: PathLike) => Promise<PackageJson>;
+export declare const updatePackageJson: (content: string | object, filePath?: PathLike) => Promise<void>;
+export declare const readThisPackageJson: () => Promise<PackageJson>;
+export declare const corePackages: {
+    core: (version: string) => string;
+    eslintConfigCore: (version: string) => string;
+};
+export declare const addPrepareScript: (pkg: PackageJson) => {
+    changed: boolean;
+    pkg: PackageJson;
+};

package/bin/saltyrc.d.ts

@@ -0,0 +1,31 @@
+import { RCFile } from '../types/cli-types';
+import { FrameworkAdapter } from './frameworks';
+export declare const SALTYRC_FILENAME = ".saltyrc.json";
+export declare const SALTYRC_SCHEMA = "./node_modules/@salty-css/core/.saltyrc.schema.json";
+export declare const SALTYRC_INFO = "This file is used to define projects and their configurations for Salty CSS cli. Do not delete, modify or add this file to .gitignore.";
+export interface ProjectEntry {
+    dir: string;
+    framework: string;
+    [key: string]: unknown;
+}
+export declare const saltyrcPath: (rootDir?: string) => string;
+export declare const readRc: (rootDir?: string) => Promise<RCFile>;
+export declare const readRawRc: (rootDir?: string) => Promise<string | undefined>;
+export declare const getDefaultProject: (rootDir?: string) => Promise<string | undefined>;
+/**
+ * Pure transform: returns the new saltyrc content for an upsert. Does not touch the filesystem.
+ * - If `existingRaw` is undefined, returns a fresh file with the project as the only entry.
+ * - If the project entry already exists, returns the same content (no-op).
+ * - Otherwise appends the new entry and returns updated content.
+ */
+export declare const upsertProjectInRc: (existingRaw: string | undefined, relativeProjectPath: string, framework: FrameworkAdapter) => {
+    content: string;
+    changed: boolean;
+    created: boolean;
+};
+/**
+ * Writes the saltyrc file, creating or updating the project entry for the given dir.
+ * Returns true when a write occurred.
+ */
+export declare const writeProjectToRc: (cwd: string, relativeProjectPath: string, framework: FrameworkAdapter) => Promise<boolean>;
+export declare const getProjectFramework: (rc: RCFile, relativeProjectPath: string) => string | undefined;

package/bin/templates.d.ts

@@ -0,0 +1,14 @@
+declare const templateLoaders: {
+    readonly 'salty.config.ts': () => Promise<any>;
+    readonly 'saltygen/index.css': () => Promise<any>;
+    readonly 'react/styled-file.ts': () => Promise<any>;
+    readonly 'react/vanilla-file.ts': () => Promise<any>;
+    readonly 'astro/styled-file.ts': () => Promise<any>;
+    readonly 'astro/component.astro': () => Promise<any>;
+};
+export type TemplateKey = keyof typeof templateLoaders;
+export declare const readTemplate: <T extends object>(key: TemplateKey, options?: T) => Promise<{
+    fileName: "salty.config.ts" | "saltygen/index.css" | "react/styled-file.ts" | "react/vanilla-file.ts" | "astro/styled-file.ts" | "astro/component.astro";
+    content: string;
+}>;
+export {};

package/{class-name-generator-YeSQe_Ik.js → class-name-generator-B0WkxoIg.js}

@@ -1,7 +1,7 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { p as parseAndJoinStyles } from "./parse-styles-BTIoYnBr.js";
+import { p as parseAndJoinStyles, b as parseTemplateCallSite } from "./parse-styles-BBJ3PWyV.js";
 import { d as dashCase } from "./dash-case-DblXvymC.js";
 import { t as toHash } from "./to-hash-DAN2LcHK.js";
 class StylesGenerator {
@@ -50,7 +50,22 @@ class StylesGenerator {
     if (!(config == null ? void 0 : config.templates) || !this.params.base || this.priority > 0) return [];
     const templateKeys = Object.keys(config.templates);
     return Object.entries(this.params.base).reduce((acc, [key, value]) => {
-      if (templateKeys.includes(key)) acc.push("t_" + toHash(dashCase(`${key}-${value}`), 4));
+      if (!templateKeys.includes(key)) return acc;
+      const callSite = parseTemplateCallSite(value);
+      if (!callSite || callSite.path.length === 0) return acc;
+      const { path, variants } = callSite;
+      const cumulative = [];
+      for (const part of path) {
+        cumulative.push(part);
+        const baseClassName = dashCase(`${key}-${cumulative.join(".")}`);
+        acc.push("t_" + toHash(baseClassName, 4));
+        for (const [axis, axisValue] of Object.entries(variants)) {
+          if (axisValue === false || axisValue === void 0) continue;
+          const valueSuffix = axisValue === true ? "" : `-${dashCase(String(axisValue))}`;
+          const variantClassName = `${baseClassName}-${dashCase(axis)}${valueSuffix}`;
+          acc.push("tv_" + toHash(variantClassName, 4));
+        }
+      }
       return acc;
     }, []);
   }

package/{class-name-generator-B2Pb2obX.cjs → class-name-generator-BEOEMEKX.cjs}

@@ -2,7 +2,7 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-const parseStyles = require("./parse-styles-CA3TP5n1.cjs");
+const parseStyles = require("./parse-styles-lOMGe_c5.cjs");
 const dashCase = require("./dash-case-DIwKaYgE.cjs");
 const toHash = require("./to-hash-C05Y906F.cjs");
 class StylesGenerator {
@@ -51,7 +51,22 @@ class StylesGenerator {
     if (!(config == null ? void 0 : config.templates) || !this.params.base || this.priority > 0) return [];
     const templateKeys = Object.keys(config.templates);
     return Object.entries(this.params.base).reduce((acc, [key, value]) => {
-      if (templateKeys.includes(key)) acc.push("t_" + toHash.toHash(dashCase.dashCase(`${key}-${value}`), 4));
+      if (!templateKeys.includes(key)) return acc;
+      const callSite = parseStyles.parseTemplateCallSite(value);
+      if (!callSite || callSite.path.length === 0) return acc;
+      const { path, variants } = callSite;
+      const cumulative = [];
+      for (const part of path) {
+        cumulative.push(part);
+        const baseClassName = dashCase.dashCase(`${key}-${cumulative.join(".")}`);
+        acc.push("t_" + toHash.toHash(baseClassName, 4));
+        for (const [axis, axisValue] of Object.entries(variants)) {
+          if (axisValue === false || axisValue === void 0) continue;
+          const valueSuffix = axisValue === true ? "" : `-${dashCase.dashCase(String(axisValue))}`;
+          const variantClassName = `${baseClassName}-${dashCase.dashCase(axis)}${valueSuffix}`;
+          acc.push("tv_" + toHash.toHash(variantClassName, 4));
+        }
+      }
       return acc;
     }, []);
   }

package/compiler/resolve-import.d.ts

@@ -0,0 +1,17 @@
+import { ImportSpec } from '../factories/define-import';
+export interface ResolveImportOptions {
+    /**
+     * Override for node_modules resolution. Receives the bare specifier (with any leading `~` already
+     * stripped) and the source file path of the salty file that called `defineImport`. Must return the
+     * absolute filesystem path of the resolved CSS file. Defaults to `createRequire(sourceFile).resolve`.
+     */
+    resolveModule?: (specifier: string, sourceFile: string) => string;
+    /**
+     * Override for copying resolved node_modules CSS into `<destDir>/imports/`. Receives the absolute
+     * source and destination paths. Defaults to `copyFileSync`.
+     */
+    copyAsset?: (from: string, to: string) => void;
+}
+export declare const resolveImport: (spec: ImportSpec, sourceFile: string, destDir: string, options?: ResolveImportOptions) => {
+    rule: string;
+};

package/compiler/salty-compiler.cjs

@@ -10,15 +10,15 @@ const promises = require("fs/promises");
 const fs = require("fs");
 const child_process = require("child_process");
 const compiler_helpers = require("./helpers.cjs");
-const defineTemplates = require("../define-templates-Deq1aCbN.cjs");
 const dashCase = require("../dash-case-DIwKaYgE.cjs");
 const toHash = require("../to-hash-C05Y906F.cjs");
-const parseStyles = require("../parse-styles-CA3TP5n1.cjs");
+const defineTemplates = require("../define-templates-Deq1aCbN.cjs");
+const module$1 = require("module");
+const parseStyles = require("../parse-styles-lOMGe_c5.cjs");
 const css_merge = require("../css/merge.cjs");
-const compiler_getFiles = require("./get-files.cjs");
 const parsers_index = require("../parsers/index.cjs");
+const moduleType = require("../util/module-type");
 const console = require("console");
-var _documentCurrentScript = typeof document !== "undefined" ? document.currentScript : null;
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -44,19 +44,53 @@ const logger = winston.createLogger({
 const logError = (message) => {
   logger.error(message);
 };
-const readPackageJsonModule = async (dirname) => {
-  const packageJsonContent = await compiler_getFiles.getPackageJson(dirname);
-  if (!packageJsonContent) return void 0;
-  return packageJsonContent.type;
+const EXTERNAL_URL = /^(?:[a-z][a-z0-9+.-]*:)?\/\//i;
+const normaliseSpec = (spec) => {
+  if (typeof spec === "string") return { url: spec };
+  return spec;
+};
+const ensureRelativePrefix = (path2) => {
+  if (path2.startsWith(".") || path2.startsWith("/")) return path2;
+  return `./${path2}`;
+};
+const toPosix = (path2) => path2.split("\\").join("/");
+const defaultResolveModule = (specifier, sourceFile) => {
+  return module$1.createRequire(sourceFile).resolve(specifier);
+};
+const defaultCopyAsset = (from, to) => {
+  const dir = path.dirname(to);
+  if (!fs.existsSync(dir)) fs.mkdirSync(dir, { recursive: true });
+  fs.copyFileSync(from, to);
 };
-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/salty-compiler.cjs", document.baseURI).href).endsWith(".cjs")) cachedModuleType = "cjs";
-  return cachedModuleType || "esm";
+const buildRule = (url, { media, supports }) => {
+  let rule = `@import url('${url}')`;
+  if (supports) rule += ` supports(${supports})`;
+  if (media) rule += ` ${media}`;
+  return `${rule};`;
+};
+const resolveImport = (spec, sourceFile, destDir, options = {}) => {
+  const opts = normaliseSpec(spec);
+  const { url } = opts;
+  const resolveModule = options.resolveModule ?? defaultResolveModule;
+  const copyAsset = options.copyAsset ?? defaultCopyAsset;
+  if (EXTERNAL_URL.test(url)) {
+    return { rule: buildRule(url, opts) };
+  }
+  if (url.startsWith("/")) {
+    return { rule: buildRule(url, opts) };
+  }
+  if (url.startsWith("./") || url.startsWith("../")) {
+    const absolute2 = path.resolve(path.dirname(sourceFile), url);
+    const fromImportsFile = path.relative(path.join(destDir, "css"), absolute2);
+    return { rule: buildRule(ensureRelativePrefix(toPosix(fromImportsFile)), opts) };
+  }
+  const specifier = url.startsWith("~") ? url.slice(1) : url;
+  const absolute = resolveModule(specifier, sourceFile);
+  const hash = toHash.toHash(absolute, 6);
+  const fileName = `${hash}-${path.basename(absolute)}`;
+  const destPath = path.join(destDir, "imports", fileName);
+  copyAsset(absolute, destPath);
+  return { rule: buildRule(`../imports/${fileName}`, opts) };
 };
 function dotCase(str) {
   if (!str) return "";
@@ -111,7 +145,7 @@ const saltyReset = {
   }
 };
 class SaltyCompiler {
-  constructor(projectRootDir) {
+  constructor(projectRootDir, options = {}) {
     __publicField(this, "importFile", (path2) => {
       const now = Date.now();
       return import(
@@ -173,7 +207,7 @@ class SaltyCompiler {
       const destDir = await this.getDestDir();
       const coreConfigPath = path.join(this.projectRootDir, (rcProject == null ? void 0 : rcProject.configDir) || "", "salty.config.ts");
       const coreConfigDest = path.join(destDir, "salty.config.js");
-      const moduleType = await detectCurrentModuleType(this.projectRootDir);
+      const moduleType$1 = await moduleType.detectCurrentModuleType(this.projectRootDir);
       const externalModules = this.getExternalModules(coreConfigPath);
       await esbuild__namespace.build({
         entryPoints: [coreConfigPath],
@@ -181,7 +215,7 @@ class SaltyCompiler {
         treeShaking: true,
         bundle: true,
         outfile: coreConfigDest,
-        format: moduleType,
+        format: moduleType$1,
         external: externalModules
       });
       const { config } = await this.importFile(coreConfigDest);
@@ -233,6 +267,7 @@ ${currentFile}`;
           fs.mkdirSync(path.join(destDir, "types"));
           fs.mkdirSync(path.join(destDir, "js"));
           fs.mkdirSync(path.join(destDir, "cache"));
+          fs.mkdirSync(path.join(destDir, "imports"));
         };
         if (clean) clearDistDir();
         const files = /* @__PURE__ */ new Set();
@@ -348,7 +383,7 @@ ${currentFile}`;
           });
         }
         const otherGlobalCssFiles = globalCssFiles.map((file) => `@import url('./css/${file}');`).join("\n");
-        const globalCssFilenames = ["_variables.css", "_reset.css", "_global.css", "_templates.css"];
+        const globalCssFilenames = ["_imports.css", "_variables.css", "_reset.css", "_global.css", "_templates.css", "_fonts.css"];
         const importsWithData = globalCssFilenames.filter((file) => {
           try {
             const data = fs.readFileSync(path.join(destDir, "css", file), "utf8");
@@ -357,9 +392,12 @@ ${currentFile}`;
             return false;
           }
         });
-        const globalImports = importsWithData.map((file) => `@import url('./css/${file}');`);
+        const globalImports = importsWithData.map((file) => {
+          const layerSuffix = file === "_imports.css" ? " layer(imports)" : "";
+          return `@import url('./css/${file}')${layerSuffix};`;
+        });
         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;
+        let cssContent = `${generatorText}@layer imports, reset, global, templates, fonts, l0, l1, l2, l3, l4, l5, l6, l7, l8;
 
 ${globalImports.join(
           "\n"
@@ -405,7 +443,9 @@ ${css}
         mediaQueries: [],
         globalStyles: [],
         variables: [],
-        templates: []
+        templates: [],
+        imports: [],
+        fonts: []
       };
       await Promise.all(
         [...configFiles].map(async (src) => {
@@ -415,6 +455,8 @@ ${css}
             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}`));
+            else if (value.isDefineImport) generationResults.imports.push(value._setPath(src));
+            else if (value.isDefineFont) generationResults.fonts.push(value);
           });
         })
       );
@@ -511,23 +553,79 @@ ${css}
       const templates = css_merge.mergeObjects(config.templates, generationResults.templates);
       const templateStylesString = await parsers_index.parseTemplates(templates);
       const templateTokens = parsers_index.getTemplateTypes(templates);
+      const templateVariantMaps = parsers_index.getTemplateVariantMaps(templates);
       fs.writeFileSync(templateStylesPath, `@layer templates { ${templateStylesString} }`);
       configCacheContent.templates = templates;
+      const importsPath = path.join(destDir, "css/_imports.css");
+      const importRules = [];
+      for (const factory of generationResults.imports) {
+        const sourceFile = factory._path;
+        if (!sourceFile) continue;
+        for (const spec of factory._current) {
+          try {
+            const { rule } = resolveImport(spec, sourceFile, destDir);
+            importRules.push(rule);
+          } catch (e) {
+            const url = typeof spec === "string" ? spec : spec.url;
+            logger.error(`Failed to resolve defineImport(${JSON.stringify(url)}) from ${sourceFile}: ${e.message}`);
+          }
+        }
+      }
+      fs.writeFileSync(importsPath, importRules.join("\n"));
       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 fontsStylesPath = path.join(destDir, "css/_fonts.css");
+      if (generationResults.fonts.length === 0) {
+        fs.writeFileSync(fontsStylesPath, "");
+      } else {
+        const fontImports = [];
+        const fontBodies = [];
+        for (const font of generationResults.fonts) {
+          const { imports, body } = font._toCss();
+          fontImports.push(...imports);
+          fontBodies.push(body);
+        }
+        const importBlock = fontImports.length ? `${fontImports.join("\n")}
+
+` : "";
+        fs.writeFileSync(fontsStylesPath, `${importBlock}@layer fonts { ${fontBodies.join(" ")} }`);
+      }
       const tsTokensPath = path.join(destDir, "types/css-tokens.d.ts");
       const tsVariableTokens = [...variableTokens].join("|");
+      const pascal = (str) => str.split(/[.\-_]/).filter(Boolean).map((s) => s.charAt(0).toUpperCase() + s.slice(1)).join("");
+      const templateVariantMapEntries = Object.entries(templateVariantMaps);
+      const hasVariantMaps = templateVariantMapEntries.some(([, pathMap]) => Object.keys(pathMap).length > 0);
+      const tsTemplateVariantMap = hasVariantMaps ? `type TemplateVariantTokens = {
+        ${templateVariantMapEntries.filter(([, pathMap]) => Object.keys(pathMap).length > 0).map(([templateKey, pathMap]) => {
+        const pathEntries = Object.entries(pathMap).map(
+          ([dotPath, axes]) => `'${dotPath}': { ${Object.entries(axes).map(([axis, valueType]) => `${axis}?: ${valueType}`).join("; ")} }`
+        ).join(";\n          ");
+        return `${templateKey}: {
+          ${pathEntries}
+        }`;
+      }).join(";\n        ")}
+      }` : `type TemplateVariantTokens = Record<string, Record<string, Record<string, never>>>;`;
+      const tsTemplateVariantAliases = templateVariantMapEntries.flatMap(
+        ([templateKey, pathMap]) => Object.keys(pathMap).map((dotPath) => `type ${pascal(templateKey)}${pascal(dotPath)}Variants = TemplateVariantTokens['${templateKey}']['${dotPath}'];`)
+      ).join("\n      ");
       const tsTokensTypes = `
       // Variable types
-      type VariableTokens = ${tsVariableTokens || `''`}; 
+      type VariableTokens = ${tsVariableTokens || `''`};
       type PropertyValueToken = \`{\${VariableTokens}}\`;
-    
+
       // Template types
       type TemplateTokens = {
-        ${Object.entries(templateTokens).map(([key, value]) => `${key}?: ${value}`).join("\n")}
+        ${Object.entries(templateTokens).map(([key, value]) => {
+        if (!value || value === "any") return `${key}?: ${value || "any"}`;
+        return `${key}?: ${value} | \`\${${value}}@\${string}\``;
+      }).join("\n")}
       }
-    
+
+      // Template variant types (per docs/template-variants-spec.md §7)
+      ${tsTemplateVariantMap}
+      ${tsTemplateVariantAliases}
+
       // Media query types
       type MediaQueryKeys = ${mediaQueryKeys || `''`};
       `;
@@ -546,11 +644,12 @@ ${css}
       let currentFile = fs.readFileSync(sourceFilePath, "utf8");
       currentFile = this.replaceStyledTag(currentFile);
       currentFile = this.addConfigCache(currentFile);
-      const outputFilePath = path.join(outputDirectory, "js", hashedName + ".js");
+      const currentFileHash = toHash.toHash(currentFile);
+      const outputFilePath = path.join(outputDirectory, "js", `${hashedName}-${currentFileHash}.js`);
       const rcProject = await this.getRCProjectConfig(this.projectRootDir);
       const coreConfigPath = path.join(this.projectRootDir, (rcProject == null ? void 0 : rcProject.configDir) || "", "salty.config.ts");
       const externalModules = this.getExternalModules(coreConfigPath);
-      const moduleType = await detectCurrentModuleType(this.projectRootDir);
+      const moduleType$1 = await moduleType.detectCurrentModuleType(this.projectRootDir);
       await esbuild__namespace.build({
         stdin: {
           contents: currentFile,
@@ -562,7 +661,7 @@ ${css}
         treeShaking: true,
         bundle: true,
         outfile: outputFilePath,
-        format: moduleType,
+        format: moduleType$1,
         target: ["node20"],
         keepNames: true,
         external: externalModules,
@@ -690,11 +789,13 @@ ${newContent}
       });
     });
     this.projectRootDir = projectRootDir;
+    this.options = options;
     if (typeof process === "undefined") {
       throw new Error("SaltyServer can only be used in a Node.js environment.");
     }
   }
   get isProduction() {
+    if (this.options.mode) return this.options.mode === "production";
     try {
       return process.env["NODE_ENV"] !== "development";
     } catch {

package/compiler/salty-compiler.d.ts

@@ -1,9 +1,14 @@
 import { CachedConfig, SaltyConfig } from '../config';
+export type SaltyCompilerMode = 'production' | 'development';
+export interface SaltyCompilerOptions {
+    mode?: SaltyCompilerMode;
+}
 export declare class SaltyCompiler {
     projectRootDir: string;
+    private options;
     importFile: (path: string) => Promise<any>;
     private cache;
-    constructor(projectRootDir: string);
+    constructor(projectRootDir: string, options?: SaltyCompilerOptions);
     get isProduction(): boolean;
     /**
      * Locate and read the .saltyrc.json file starting from the current directory and moving up the directory tree.
@@ -39,6 +44,8 @@ export declare class SaltyCompiler {
                 isGlobalDefine?: boolean;
                 isDefineVariables?: boolean;
                 isDefineTemplates?: boolean;
+                isDefineImport?: boolean;
+                isDefineFont?: boolean;
                 isKeyframes?: boolean;
                 animationName?: string;
                 css?: Promise<string>;