@salty-css/core 0.0.1-alpha.18 → 0.0.1-alpha.180

package/bin/main.js

@@ -0,0 +1,260 @@
+import { Command as ot } from "commander";
+import { existsSync as K } from "fs";
+import { mkdir as q, readFile as C, writeFile as w } from "fs/promises";
+import { join as i, relative as z, parse as rt, format as tt } from "path";
+import { render as ct } from "ejs";
+import { l as e, a as h, g as et } from "../index-9iO5zogY.js";
+import { p as lt } from "../pascal-case-BQpR5PdN.js";
+import { exec as dt } from "child_process";
+import ft from "ora";
+const st = (u) => new Promise((v, k) => {
+  dt(u, (F) => {
+    if (F) return k(F);
+    v();
+  });
+}), E = async (...u) => {
+  const v = u.map((J) => J.replace("-D", "").split("@").slice(0, -1).join("@").trim()).join(", "), k = ft(`Installing packages: ${v}`).start(), F = u.join(" ");
+  await st(`npm install ${F}`), k.succeed(`Installed packages: ${v}`);
+}, pt = () => K(i(process.cwd(), "node_modules", ".bin", "prettier"));
+async function j(u) {
+  try {
+    if (!pt()) return;
+    await st(`./node_modules/.bin/prettier --write "${u}"`), e.info(`Formatted ${u} with Prettier`);
+  } catch (v) {
+    e.error(`Error formatting ${u} with Prettier:`, v);
+  }
+}
+async function kt() {
+  const u = new ot();
+  u.name("salty-css").description("Salty-CSS CLI tool to help with annoying configuration tasks.");
+  const v = {
+    // Core files
+    "salty.config.ts": import("../salty.config-BhBY_oOk.js"),
+    "saltygen/index.css": import("../index-D_732b92.js"),
+    // React
+    "react/react-styled-file.ts": import("../react-styled-file-CGVf5n1B.js"),
+    "react/react-vanilla-file.ts": import("../react-vanilla-file-CCXbsjIb.js")
+  }, k = async (s, a) => {
+    const { default: c } = await v[s], g = ct(c, a);
+    return { fileName: s, content: g };
+  }, F = async () => {
+    const s = i(process.cwd(), ".saltyrc.json");
+    return await C(s, "utf-8").then(JSON.parse).catch(() => ({}));
+  }, J = i(process.cwd(), "package.json"), O = async (s = J) => {
+    const a = await C(s, "utf-8").then(JSON.parse).catch(() => {
+    });
+    if (!a) throw "Could not read package.json file!";
+    return a;
+  }, nt = async (s, a = J) => {
+    typeof s == "object" && (s = JSON.stringify(s, null, 2)), await w(a, s);
+  }, Q = async () => {
+    const s = new URL("../package.json", import.meta.url);
+    return O(s);
+  }, X = await (async () => (await F()).defaultProject)(), N = await Q(), A = {
+    core: `@salty-css/core@${N.version}`,
+    react: `@salty-css/react@${N.version}`,
+    eslintConfigCore: `@salty-css/eslint-config-core@${N.version}`,
+    vite: `@salty-css/vite@${N.version}`,
+    next: `@salty-css/next@${N.version}`
+  }, G = (s) => {
+    const a = s === "." ? "" : s, c = process.cwd();
+    return i(c, a);
+  };
+  u.command("init [directory]").description("Initialize a new Salty-CSS project.").option("-d, --dir <dir>", "Project directory to initialize the project in.").option("--css-file <css-file>", "Existing CSS file where to import the generated CSS. Path must be relative to the given project directory.").option("--skip-install", "Skip installing dependencies.").action(async function(s = ".") {
+    if (!await O().catch(() => {
+    })) return h("Salty CSS project must be initialized in a directory with a package.json file.");
+    e.info("Initializing a new Salty-CSS project!");
+    const { dir: c = s, cssFile: g, skipInstall: p } = this.opts();
+    if (!c) return h("Project directory must be provided. Add it as the first argument after init command or use the --dir option.");
+    p || await E(A.core, A.react);
+    const d = process.cwd(), o = G(c), H = await Promise.all([k("salty.config.ts"), k("saltygen/index.css")]);
+    await q(o, { recursive: !0 });
+    const y = H.map(async ({ fileName: t, content: f }) => {
+      const r = i(o, t);
+      if (await C(r, "utf-8").catch(() => {
+      }) !== void 0) {
+        e.debug("File already exists: " + r);
+        return;
+      }
+      const b = t.split("/").slice(0, -1).join("/");
+      b && await q(i(o, b), { recursive: !0 }), e.info("Creating file: " + r), await w(r, f), await j(r);
+    });
+    await Promise.all(y);
+    const S = z(d, o) || ".", m = i(d, ".saltyrc.json"), l = await C(m, "utf-8").catch(() => {
+    });
+    if (l === void 0) {
+      e.info("Creating file: " + m);
+      const f = JSON.stringify({
+        $schema: "./node_modules/@salty-css/core/.saltyrc.schema.json",
+        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.",
+        defaultProject: S,
+        projects: [
+          {
+            dir: S,
+            framework: "react"
+          }
+        ]
+      }, null, 2);
+      await w(m, f), await j(m);
+    } else {
+      const t = JSON.parse(l), f = (t == null ? void 0 : t.projects) || [];
+      if (f.findIndex((n) => n.dir === S) === -1) {
+        f.push({ dir: S, framework: "react" }), t.projects = [...f];
+        const n = JSON.stringify(t, null, 2);
+        n !== l && (e.info("Edit file: " + m), await w(m, n), await j(m));
+      }
+    }
+    const P = i(d, ".gitignore"), U = await C(P, "utf-8").catch(() => {
+    });
+    U !== void 0 && (U.includes("saltygen") || (e.info("Edit file: " + P), await w(P, U + `
+
+# Salty-CSS
+saltygen
+`)));
+    const $ = ["src", "public", "assets", "styles", "css", "app"], M = ["styles", "css", "app", "pages"], B = ["index", "styles", "main", "app", "global", "globals"], R = [".css", ".scss", ".sass"], D = await (async () => {
+      if (g) return g;
+      for (const t of $)
+        for (const f of B)
+          for (const r of R) {
+            const n = i(o, t, f + r);
+            if (await C(n, "utf-8").catch(() => {
+            }) !== void 0) return z(o, n);
+            for (const T of M) {
+              const L = i(o, t, T, f + r);
+              if (await C(L, "utf-8").catch(() => {
+              }) !== void 0) return z(o, L);
+            }
+          }
+    })();
+    if (D) {
+      const t = i(o, D), f = await C(t, "utf-8").catch(() => {
+      });
+      if (f !== void 0 && !f.includes("saltygen")) {
+        const n = i(t, ".."), T = `@import '${z(n, i(o, "saltygen/index.css"))}';`;
+        e.info("Adding global import statement to CSS file: " + t), await w(t, T + `
+` + f), await j(t);
+      }
+    } else
+      e.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");
+    const it = {
+      projectJs: i(o, "eslint.config.js"),
+      rootJs: i(d, "eslint.config.js"),
+      projectMjs: i(o, "eslint.config.mjs"),
+      rootMjs: i(d, "eslint.config.mjs"),
+      projectJson: i(o, ".eslintrc.json"),
+      rootJson: i(d, ".eslintrc.json")
+    }, x = Object.values(it).find((t) => K(t));
+    if (x) {
+      p || await E(A.eslintConfigCore);
+      const t = await C(x, "utf-8").catch(() => {
+      });
+      if (!t) return h("Could not read ESLint config file.");
+      if (!t.includes("salty-css"))
+        if (e.info("Edit file: " + x), x.endsWith("js")) {
+          let n = `import saltyCss from "@salty-css/eslint-config-core/flat";
+${t}`;
+          t.includes("typescript-eslint") ? n.includes(".config(") ? n = n.replace(".config(", ".config(saltyCss,") : e.warn("Could not find the correct place to add the Salty-CSS config for ESLint. Please add it manually.") : n.includes("export default [") ? n = n.replace("export default [", "export default [ saltyCss,") : n.includes("eslintConfig = [") ? n = n.replace("eslintConfig = [", "eslintConfig = [ saltyCss,") : e.warn("Could not find the correct place to add the Salty-CSS config for ESLint. Please add it manually."), await w(x, n), await j(x);
+        } else {
+          const r = JSON.parse(t);
+          r.extends || (r.extends = []), r.extends.push("@salty-css/core");
+          const n = JSON.stringify(r, null, 2);
+          await w(x, n), await j(x);
+        }
+    }
+    const _ = i(o, "vite.config.ts"), V = await C(_, "utf-8").catch(() => {
+    });
+    if (V !== void 0 && !V.includes("saltyPlugin")) {
+      e.info("Edit file: " + _);
+      const f = `import { saltyPlugin } from '@salty-css/vite';
+`, n = V.replace(/(plugins: \[)/, `$1
+  saltyPlugin(__dirname),`);
+      p || await E(`-D ${A.vite}`), e.info("Adding Salty-CSS plugin to Vite config..."), await w(_, f + n), await j(_);
+    }
+    const W = ["next.config.js", "next.config.cjs", "next.config.ts", "next.config.mjs"].map((t) => i(o, t)).find((t) => K(t));
+    if (W) {
+      let t = await C(W, "utf-8").catch(() => {
+      });
+      if (t !== void 0 && !t.includes("withSaltyCss")) {
+        let r = !1;
+        /\splugins([^=]*)=[^[]\[/.test(t) && !r && (t = t.replace(/\splugins([^=]*)=[^[]\[/, (L, I) => ` plugins${I}= [withSaltyCss,`), r = !0);
+        const b = t.includes("module.exports"), T = b ? `const { withSaltyCss } = require('@salty-css/next');
+` : `import { withSaltyCss } from '@salty-css/next';
+`;
+        b && !r ? (t = t.replace(/module.exports = ([^;]+)/, (L, I) => `module.exports = withSaltyCss(${I})`), r = !0) : r || (t = t.replace(/export default ([^;]+)/, (L, I) => `export default withSaltyCss(${I})`)), p || await E(`-D ${A.next}`), e.info("Adding Salty-CSS plugin to Next.js config..."), await w(W, T + t), await j(W);
+      }
+    }
+    const at = await O().catch(() => h("Could not read package.json file.")).then((t) => (t.scripts || (t.scripts = {}), t.scripts.prepare ? t.scripts.prepare.includes("salty-css") || (e.info("Edit file: " + J), t.scripts.prepare = t.scripts.prepare + " && npx salty-css build") : (e.info("Edit file: " + J), t.scripts.prepare = "npx salty-css build"), t));
+    await nt(at), e.info("Running the build to generate initial CSS..."), await et(o), e.info("🎉 Salty CSS project initialized successfully!"), e.info("Next steps:"), e.info("1. Configure variables and templates in `salty.config.ts`"), e.info("2. Create a new component with `npx salty-css generate [component-name]`"), e.info("3. Run `npx salty-css build` to generate the CSS"), e.info("4. Read about the features in the documentation: https://salty-css.dev"), e.info("5. Star the project on GitHub: https://github.com/margarita-form/salty-css ⭐");
+  }), u.command("build [directory]").alias("b").description("Build the Salty-CSS project.").option("-d, --dir <dir>", "Project directory to build the project in.").action(async function(s = X) {
+    e.info("Building the Salty-CSS project...");
+    const { dir: a = s } = this.opts();
+    if (!a) return h("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");
+    const c = G(a);
+    await et(c);
+  }), u.command("generate [file] [directory]").alias("g").description("Generate a new component file.").option("-f, --file <file>", "File to generate.").option("-d, --dir <dir>", "Project directory to generate the file in.").option("-t, --tag <tag>", "HTML tag of the component.", "div").option("-n, --name <name>", "Name of the component.").option("-c, --className <className>", "CSS class of the component.").option("-r, --reactComponent", "Generate a React component as well.").action(async function(s, a = X) {
+    const { file: c = s, dir: g = a, tag: p, name: d, className: o, reactComponent: H = !1 } = this.opts();
+    if (!c) return h("File to generate must be provided. Add it as the first argument after generate command or use the --file option.");
+    if (!g) return h("Project directory must be provided. Add it as the second argument after generate command or use the --dir option.");
+    const y = G(g), S = c.split("/").slice(0, -1).join("/");
+    S && await q(i(y, S), { recursive: !0 });
+    const m = i(y, c), l = rt(m);
+    l.ext || (l.ext = ".ts"), l.name.endsWith(".css") || (l.name = l.name + ".css"), l.base = l.name + l.ext;
+    const P = tt(l);
+    if (await C(P, "utf-8").catch(() => {
+    }) !== void 0) {
+      e.error("File already exists:", P);
+      return;
+    }
+    let $ = lt(d || l.base.replace(/\.css\.\w+$/, ""));
+    if (H) {
+      const B = $ + "Component";
+      $ = $ + "Wrapper";
+      const R = l.base.replace(/\.css\.\w+$/, ""), { content: Z } = await k("react/react-vanilla-file.ts", { tag: p, componentName: B, styledComponentName: $, className: o, fileName: R });
+      l.name = R.replace(/\.css$/, ""), l.ext = ".tsx", l.base = l.name + l.ext;
+      const D = tt(l);
+      e.info("Generating a new file: " + D), await w(D, Z), await j(D);
+    }
+    const { content: M } = await k("react/react-styled-file.ts", { tag: p, name: $, className: o });
+    e.info("Generating a new file: " + P), await w(P, M), await j(P);
+  });
+  const Y = async () => {
+    const s = i(process.cwd(), "package.json"), a = await O(s).catch((p) => h(p));
+    if (!a) return h("Could not read package.json file.");
+    const c = { ...a.dependencies, ...a.devDependencies }, g = Object.entries(c).filter(([p]) => p === "salty-css" || p.startsWith("@salty-css/"));
+    return g.length ? g : h(
+      "No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: " + s
+    );
+  };
+  u.command("update [version]").alias("up").description("Update Salty-CSS packages to the latest or specified version.").option("-v, --version <version>", "Version to update to.").option("--legacy-peer-deps <legacyPeerDeps>", "Use legacy peer dependencies (not recommended).", !1).action(async function(s = "latest") {
+    const { legacyPeerDeps: a, version: c = s } = this.opts(), g = await Y();
+    if (!g) return h("Could not update Salty-CSS packages as any were found in package.json.");
+    const p = g.map(([y]) => c === "@" ? `${y}@${N.version}` : `${y}@${c.replace(/^@/, "")}`);
+    a ? (e.warn("Using legacy peer dependencies to update packages."), await E(...p, "--legacy-peer-deps")) : await E(...p);
+    const d = await Y();
+    if (!d) return h("Something went wrong while reading the updated packages.");
+    const o = d.reduce((y, [S, m]) => (y[m] || (y[m] = []), y[m].push(S), y), {});
+    if (Object.keys(o).length === 1) {
+      const S = Object.keys(o)[0].replace(/^\^/, "");
+      e.info(`Updated to all Salty CSS packages successfully to ${S}`);
+    } else
+      for (const [y, S] of Object.entries(o)) {
+        const m = y.replace(/^\^/, "");
+        e.info(`Updated to ${m}: ${S.join(", ")}`);
+      }
+  }), u.option("-v, --version", "Show the current version of Salty-CSS.").action(async function() {
+    const s = await Q();
+    e.info("CLI is running: " + s.version);
+    const a = i(process.cwd(), "package.json"), c = await O(a).catch((d) => h(d));
+    if (!c) return;
+    const g = { ...c.dependencies, ...c.devDependencies }, p = Object.keys(g).filter((d) => d === "salty-css" || d.startsWith("@salty-css/"));
+    if (!p.length)
+      return h(
+        "No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: " + a
+      );
+    for (const d of p)
+      e.info(`${d}: ${g[d]}`);
+  }), u.parseAsync(process.argv);
+}
+export {
+  kt as main
+};

package/compiler/get-files.d.ts

@@ -0,0 +1,3 @@
+export declare const getSaltyRcPath: (dirname: string) => string;
+export declare const getPackageJsonPath: (dirname: string) => string;
+export declare const getPackageJson: (dirname: string) => Promise<any>;

package/compiler/index.cjs

@@ -1,11 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const z=require("esbuild"),B=require("child_process"),P=require("../dash-case-DKzpenwY.cjs"),o=require("path"),r=require("fs"),K=require("fs/promises"),V=require("../parse-templates-W0YfTmOT.cjs");function G(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,s.get?s:{enumerable:!0,get:()=>t[n]})}}return e.default=t,Object.freeze(e)}const R=G(z),N=t=>o.join(t,"./saltygen"),_=["salty","css","styles","styled"],q=(t=[])=>new RegExp(`\\.(${[..._,...t].join("|")})\\.`),O=(t,e=[])=>q(e).test(t),J=async t=>{const e=N(t),n=o.join(t,"salty.config.ts"),s=o.join(e,"salty.config.js");await R.build({entryPoints:[n],minify:!0,treeShaking:!0,bundle:!0,outfile:s,format:"esm",external:["react"]});const a=Date.now(),{config:w}=await import(`${s}?t=${a}`);return w},M=async t=>{const e=await J(t),n=new Set,s=(d,y=[])=>d?Object.entries(d).flatMap(([p,c])=>{if(!c)return;if(typeof c=="object")return s(c,[...y,p]);const C=[...y,p].join(".");n.add(`"${C}"`);const x=[...y.map(P.dashCase),P.dashCase(p)].join("-"),{result:D}=V.parseValueTokens(c);return`--${x}: ${D};`}):[],a=d=>d?Object.entries(d).flatMap(([y,p])=>{const c=s(p);return y==="base"?c.join(""):`${y} { ${c.join("")} }`}):[],w=d=>d?Object.entries(d).flatMap(([y,p])=>Object.entries(p).flatMap(([c,C])=>{const x=s(C,[y]),D=`.${y}-${c}, [data-${y}="${c}"]`,k=x.join("");return`${D} { ${k} }`})):[],j=s(e.variables),S=a(e.responsiveVariables),l=w(e.conditionalVariables),b=N(t),f=o.join(b,"css/variables.css"),i=`:root { ${j.join("")} ${S.join("")} } ${l.join("")}`;r.writeFileSync(f,i);const g=o.join(b,"types/css-tokens.d.ts"),m=`type VariableTokens = ${[...n].join("|")}; type PropertyValueToken = \`{\${VariableTokens}}\``;r.writeFileSync(g,m);const u=o.join(b,"css/global.css"),h=V.parseStyles(e.global,"");r.writeFileSync(u,h);const F=o.join(b,"css/templates.css"),v=V.parseTemplates(e.templates);r.writeFileSync(F,v)},T=async(t,e)=>{const n=P.toHash(t),s=o.join(e,"js",n+".js");await R.build({entryPoints:[t],minify:!0,treeShaking:!0,bundle:!0,outfile:s,format:"esm",target:["es2022"],keepNames:!0,external:["react"]});const a=Date.now();return await import(`${s}?t=${a}`)},E=async t=>{const e=N(t),n=o.join(e,"salty.config.js"),{config:s}=await import(n);return s},A=async t=>{try{const e=[],n=[],s=N(t),a=o.join(s,"index.css");(()=>{r.existsSync(s)&&B.execSync("rm -rf "+s),r.mkdirSync(s),r.mkdirSync(o.join(s,"css")),r.mkdirSync(o.join(s,"types"))})(),await M(t);const j=await E(t);async function S(i,g){const $=r.statSync(i);if($.isDirectory()){const m=r.readdirSync(i);await Promise.all(m.map(u=>S(o.join(i,u),o.join(g,u))))}else if($.isFile()&&O(i)){const u=await T(i,s),h=[];Object.entries(u).forEach(([y,p])=>{if(p.isKeyframes&&p.css){const k=`${p.animationName}.css`,H=`css/${k}`,I=o.join(s,H);e.push(k),r.writeFileSync(I,p.css);return}if(!p.generator)return;const c=p.generator._withBuildContext({name:y,config:j}),C=`${c.hash}-${c.priority}.css`;n[c.priority]||(n[c.priority]=[]),n[c.priority].push(C),h.push(C);const x=`css/${C}`,D=o.join(s,x);r.writeFileSync(D,c.css)});const F=h.map(y=>`@import url('./${y}');`).join(`
-`),v=P.toHash(i,6),d=o.join(s,`css/${v}.css`);r.writeFileSync(d,F)}}await S(t,s);const l=e.map(i=>`@import url('./css/${i}');`).join(`
-`);let f=`@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
-
-${["@import url('./css/variables.css');","@import url('./css/global.css');","@import url('./css/templates.css');"].join(`
-`)}
-${l}`;if(j.importStrategy!=="component"){const i=n.flat().map(g=>`@import url('./css/${g}');`).join(`
-`);f+=i}r.writeFileSync(a,f)}catch(e){console.error(e)}},L=async(t,e)=>{try{const n=[],s=o.join(t,"./saltygen"),a=o.join(s,"index.css");if(O(e)){const j=await E(t),S=await T(e,s);Object.entries(S).forEach(([g,$])=>{if(!$.generator)return;const m=$.generator._withBuildContext({name:g,config:j}),u=`${m.hash}-${m.priority}.css`,h=`css/${u}`,F=o.join(s,h);n.push(u),r.writeFileSync(F,m.css)});const l=r.readFileSync(a,"utf8").split(`
-`),b=n.map(g=>`@import url('../saltygen/css/${g}');`),i=[...new Set([...l,...b])].join(`
-`);r.writeFileSync(a,i)}}catch(n){console.error(n)}},U=async(t,e)=>{try{const n=o.join(t,"./saltygen");if(O(e)){const a=r.readFileSync(e,"utf8");a.replace(/^(?!export\s)const\s.*/gm,f=>`export ${f}`)!==a&&await K.writeFile(e,a);const j=await E(t),S=await T(e,n);let l=a;Object.entries(S).forEach(([f,i])=>{var F;if(i.isKeyframes){console.log("value",i);return}if(!i.generator)return;const g=i.generator._withBuildContext({name:f,config:j}),$=new RegExp(`${f}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(a);if(!$)return console.error("Could not find the original declaration");const m=(F=$.at(1))==null?void 0:F.trim(),u=`${f} = styled(${m}, "${g.classNames}", "${g._callerName}", ${JSON.stringify(g.props)});`,h=new RegExp(`${f}[=\\s]+[^()]+styled\\(([^,]+),[^;]+;`,"g");l=l.replace(h,u)});const b=P.toHash(e,6);return j.importStrategy==="component"&&(l=`import '../../saltygen/css/${b}.css';
-${l}`),l=l.replace("{ styled }","{ styledClient as styled }"),l=l.replace("@salty-css/react/styled","@salty-css/react/styled-client"),l}}catch(n){console.error(n)}};exports.compileSaltyFile=T;exports.generateConfigStyles=M;exports.generateCss=A;exports.generateFile=L;exports.isSaltyFile=O;exports.minimizeFile=U;exports.saltyFileExtensions=_;exports.saltyFileRegExp=q;
+"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-3zK35muR.cjs");require("../parse-templates-VIvmVb52.cjs");const e=require("../index-neHUpjdt.cjs");require("../merge-DxGoJDHv.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;

package/compiler/index.d.ts

@@ -1,16 +1,40 @@
 import { StyleComponentGenerator } from '../generator/style-generator';
+import { MediaQueryFactory } from '../css/media';
+import { GlobalStylesFactory, TemplatesFactory, VariablesFactory } from '../factories';
+interface GeneratorResult<V extends object> {
+    value: V;
+    src: string;
+    name: string;
+}
+interface GenerationResults {
+    components: GeneratorResult<StyleComponentGenerator>[];
+    keyframes: GeneratorResult<{
+        animationName: string;
+        css: string;
+    }>[];
+    mediaQueries: MediaQueryFactory[];
+    globalStyles: GlobalStylesFactory[];
+    variables: VariablesFactory[];
+    templates: TemplatesFactory[];
+}
 export declare const saltyFileExtensions: string[];
 export declare const saltyFileRegExp: (additional?: string[]) => RegExp;
 export declare const isSaltyFile: (file: string, additional?: string[]) => boolean;
-export declare const generateConfigStyles: (dirname: string) => Promise<void>;
-export declare const compileSaltyFile: (sourceFilePath: string, outputDirectory: string) => Promise<{
+export declare const generateConfigStyles: (dirname: string, generationResults: GenerationResults) => Promise<void>;
+export declare const compileSaltyFile: (dirname: string, sourceFilePath: string, outputDirectory: string) => Promise<{
     [key: string]: {
         generator: StyleComponentGenerator;
+        isMedia?: boolean;
+        isGlobalDefine?: boolean;
+        isDefineVariables?: boolean;
+        isDefineTemplates?: boolean;
         isKeyframes?: boolean;
         animationName?: string;
         css?: string;
+        styles?: any;
     };
 }>;
-export declare const generateCss: (dirname: string) => Promise<void>;
+export declare const generateCss: (dirname: string, prod?: boolean, clean?: boolean) => Promise<void>;
 export declare const generateFile: (dirname: string, file: string) => Promise<void>;
-export declare const minimizeFile: (dirname: string, file: string) => Promise<string | undefined>;
+export declare const minimizeFile: (dirname: string, file: string, prod?: boolean) => Promise<string | undefined>;
+export {};

package/compiler/index.js

@@ -1,174 +1,20 @@
-import * as I from "esbuild";
-import { execSync as H } from "child_process";
-import { t as T, d as R } from "../dash-case-DMQMcCO6.js";
-import { join as o } from "path";
-import { writeFileSync as $, existsSync as K, mkdirSync as V, statSync as z, readdirSync as G, readFileSync as M } from "fs";
-import { writeFile as J } from "fs/promises";
-import { p as q, a as A, b as L } from "../parse-templates-D4p3pgQR.js";
-const N = (s) => o(s, "./saltygen"), U = ["salty", "css", "styles", "styled"], W = (s = []) => new RegExp(`\\.(${[...U, ...s].join("|")})\\.`), v = (s, e = []) => W(e).test(s), X = async (s) => {
-  const e = N(s), n = o(s, "salty.config.ts"), t = o(e, "salty.config.js");
-  await I.build({
-    entryPoints: [n],
-    minify: !0,
-    treeShaking: !0,
-    bundle: !0,
-    outfile: t,
-    format: "esm",
-    external: ["react"]
-  });
-  const c = Date.now(), { config: S } = await import(`${t}?t=${c}`);
-  return S;
-}, Y = async (s) => {
-  const e = await X(s), n = /* @__PURE__ */ new Set(), t = (u, l = []) => u ? Object.entries(u).flatMap(([p, r]) => {
-    if (!r) return;
-    if (typeof r == "object") return t(r, [...l, p]);
-    const x = [...l, p].join(".");
-    n.add(`"${x}"`);
-    const C = [...l.map(R), R(p)].join("-"), { result: D } = L(r);
-    return `--${C}: ${D};`;
-  }) : [], c = (u) => u ? Object.entries(u).flatMap(([l, p]) => {
-    const r = t(p);
-    return l === "base" ? r.join("") : `${l} { ${r.join("")} }`;
-  }) : [], S = (u) => u ? Object.entries(u).flatMap(([l, p]) => Object.entries(p).flatMap(([r, x]) => {
-    const C = t(x, [l]), D = `.${l}-${r}, [data-${l}="${r}"]`, P = C.join("");
-    return `${D} { ${P} }`;
-  })) : [], d = t(e.variables), w = c(e.responsiveVariables), a = S(e.conditionalVariables), b = N(s), f = o(b, "css/variables.css"), i = `:root { ${d.join("")} ${w.join("")} } ${a.join("")}`;
-  $(f, i);
-  const y = o(b, "types/css-tokens.d.ts"), m = `type VariableTokens = ${[...n].join("|")}; type PropertyValueToken = \`{\${VariableTokens}}\``;
-  $(y, m);
-  const g = o(b, "css/global.css"), F = q(e.global, "");
-  $(g, F);
-  const j = o(b, "css/templates.css"), k = A(e.templates);
-  $(j, k);
-}, E = async (s, e) => {
-  const n = T(s), t = o(e, "js", n + ".js");
-  await I.build({
-    entryPoints: [s],
-    minify: !0,
-    treeShaking: !0,
-    bundle: !0,
-    outfile: t,
-    format: "esm",
-    target: ["es2022"],
-    keepNames: !0,
-    external: ["react"]
-  });
-  const c = Date.now();
-  return await import(`${t}?t=${c}`);
-}, O = async (s) => {
-  const e = N(s), n = o(e, "salty.config.js"), { config: t } = await import(n);
-  return t;
-}, ot = async (s) => {
-  try {
-    const e = [], n = [], t = N(s), c = o(t, "index.css");
-    (() => {
-      K(t) && H("rm -rf " + t), V(t), V(o(t, "css")), V(o(t, "types"));
-    })(), await Y(s);
-    const d = await O(s);
-    async function w(i, y) {
-      const h = z(i);
-      if (h.isDirectory()) {
-        const m = G(i);
-        await Promise.all(m.map((g) => w(o(i, g), o(y, g))));
-      } else if (h.isFile() && v(i)) {
-        const g = await E(i, t), F = [];
-        Object.entries(g).forEach(([l, p]) => {
-          if (p.isKeyframes && p.css) {
-            const P = `${p.animationName}.css`, _ = `css/${P}`, B = o(t, _);
-            e.push(P), $(B, p.css);
-            return;
-          }
-          if (!p.generator) return;
-          const r = p.generator._withBuildContext({
-            name: l,
-            config: d
-          }), x = `${r.hash}-${r.priority}.css`;
-          n[r.priority] || (n[r.priority] = []), n[r.priority].push(x), F.push(x);
-          const C = `css/${x}`, D = o(t, C);
-          $(D, r.css);
-        });
-        const j = F.map((l) => `@import url('./${l}');`).join(`
-`), k = T(i, 6), u = o(t, `css/${k}.css`);
-        $(u, j);
-      }
-    }
-    await w(s, t);
-    const a = e.map((i) => `@import url('./css/${i}');`).join(`
-`);
-    let f = `@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
-
-${["@import url('./css/variables.css');", "@import url('./css/global.css');", "@import url('./css/templates.css');"].join(`
-`)}
-${a}`;
-    if (d.importStrategy !== "component") {
-      const i = n.flat().map((y) => `@import url('./css/${y}');`).join(`
-`);
-      f += i;
-    }
-    $(c, f);
-  } catch (e) {
-    console.error(e);
-  }
-}, it = async (s, e) => {
-  try {
-    const n = [], t = o(s, "./saltygen"), c = o(t, "index.css");
-    if (v(e)) {
-      const d = await O(s), w = await E(e, t);
-      Object.entries(w).forEach(([y, h]) => {
-        if (!h.generator) return;
-        const m = h.generator._withBuildContext({
-          name: y,
-          config: d
-        }), g = `${m.hash}-${m.priority}.css`, F = `css/${g}`, j = o(t, F);
-        n.push(g), $(j, m.css);
-      });
-      const a = M(c, "utf8").split(`
-`), b = n.map((y) => `@import url('../saltygen/css/${y}');`), i = [.../* @__PURE__ */ new Set([...a, ...b])].join(`
-`);
-      $(c, i);
-    }
-  } catch (n) {
-    console.error(n);
-  }
-}, rt = async (s, e) => {
-  try {
-    const n = o(s, "./saltygen");
-    if (v(e)) {
-      const c = M(e, "utf8");
-      c.replace(/^(?!export\s)const\s.*/gm, (f) => `export ${f}`) !== c && await J(e, c);
-      const d = await O(s), w = await E(e, n);
-      let a = c;
-      Object.entries(w).forEach(([f, i]) => {
-        var j;
-        if (i.isKeyframes) {
-          console.log("value", i);
-          return;
-        }
-        if (!i.generator) return;
-        const y = i.generator._withBuildContext({
-          name: f,
-          config: d
-        }), h = new RegExp(`${f}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(c);
-        if (!h)
-          return console.error("Could not find the original declaration");
-        const m = (j = h.at(1)) == null ? void 0 : j.trim(), g = `${f} = styled(${m}, "${y.classNames}", "${y._callerName}", ${JSON.stringify(y.props)});`, F = new RegExp(`${f}[=\\s]+[^()]+styled\\(([^,]+),[^;]+;`, "g");
-        a = a.replace(F, g);
-      });
-      const b = T(e, 6);
-      return d.importStrategy === "component" && (a = `import '../../saltygen/css/${b}.css';
-${a}`), a = a.replace("{ styled }", "{ styledClient as styled }"), a = a.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), a;
-    }
-  } catch (n) {
-    console.error(n);
-  }
-};
+import "esbuild";
+import "child_process";
+import "../dash-case-DBThphLm.js";
+import "path";
+import "fs";
+import "fs/promises";
+import "../parse-styles-DrLhKtqW.js";
+import "../parse-templates-DRKlN-pP.js";
+import { d as g, c as F, g as y, e as x, i as S, m as c, s as f, b as C } from "../index-9iO5zogY.js";
+import "../merge-BVm9us1A.js";
 export {
-  E as compileSaltyFile,
-  Y as generateConfigStyles,
-  ot as generateCss,
-  it as generateFile,
-  v as isSaltyFile,
-  rt as minimizeFile,
-  U as saltyFileExtensions,
-  W as saltyFileRegExp
+  g as compileSaltyFile,
+  F as generateConfigStyles,
+  y as generateCss,
+  x as generateFile,
+  S as isSaltyFile,
+  c as minimizeFile,
+  f as saltyFileExtensions,
+  C as saltyFileRegExp
 };

package/config/define-config.d.ts

@@ -1,2 +1,2 @@
-import { SaltyConfig } from './config-types';
+import { SaltyConfig } from '../types/config-types';
 export declare const defineConfig: <T extends SaltyConfig>(config: T) => T;

package/config/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=e=>e;exports.defineConfig=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../factories/index.cjs"),i=a=>a;exports.GlobalStylesFactory=e.GlobalStylesFactory;exports.TemplatesFactory=e.TemplatesFactory;exports.VariablesFactory=e.VariablesFactory;exports.defineConditionalVariables=e.defineConditionalVariables;exports.defineGlobalStyles=e.defineGlobalStyles;exports.defineResponsiveVariables=e.defineResponsiveVariables;exports.defineStaticVariables=e.defineStaticVariables;exports.defineTemplates=e.defineTemplates;exports.defineVariables=e.defineVariables;exports.defineConfig=i;

package/config/index.d.ts

@@ -1,2 +1,3 @@
-export * from './config-types';
 export * from './define-config';
+export * from '../factories';
+export * from '../types/config-types';

package/config/index.js

@@ -1,4 +1,14 @@
-const n = (e) => e;
+import { GlobalStylesFactory as t, TemplatesFactory as n, VariablesFactory as o, defineConditionalVariables as r, defineGlobalStyles as s, defineResponsiveVariables as f, defineStaticVariables as d, defineTemplates as b, defineVariables as c } from "../factories/index.js";
+const a = (e) => e;
 export {
-  n as defineConfig
+  t as GlobalStylesFactory,
+  n as TemplatesFactory,
+  o as VariablesFactory,
+  r as defineConditionalVariables,
+  a as defineConfig,
+  s as defineGlobalStyles,
+  f as defineResponsiveVariables,
+  d as defineStaticVariables,
+  b as defineTemplates,
+  c as defineVariables
 };

package/css/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=e=>`{${e}}`;exports.token=t;
+"use strict";var v=Object.defineProperty;var C=(n,e,t)=>e in n?v(n,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):n[e]=t;var g=(n,e,t)=>C(n,typeof e!="symbol"?e+"":e,t);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../parse-styles-3zK35muR.cjs"),w=require("../dash-case-BJEkFEGQ.cjs"),j=require("../merge-DxGoJDHv.cjs"),k=({animationName:n,params:e,appendInitialStyles:t,...s})=>{const u=n||w.toHash(s),c=(o={})=>{const{duration:r="500ms",easing:a="ease-in-out",delay:h="0s",iterationCount:$="1",direction:x="normal",fillMode:f="forwards",playState:y="running"}={...e,...o},l=`${u} ${r} ${a} ${h} ${$} ${x} ${f} ${y}`;if(!t)return l;const m=s.from||s["0%"];if(!m)return l;const S=p.parseStyles(m,"");return`${l};${S}`},d=Object.entries(s).reduce((o,[r,a])=>{if(!a)return o;const h=p.parseStyles(a,""),$=typeof r=="number"?`${r}%`:r;return`${o}${$}{${h}}`},""),b=`@keyframes ${u} {${d}}`;return Object.assign(c,{toString:c,isKeyframes:!0,animationName:u,css:b,keyframes:s}),c};class i{constructor(e="@media"){g(this,"next",e=>{const t=new String(e);return Object.assign(t,{get isMedia(){return!0},get and(){return new i(`${e} and`)},get or(){return new i(`${e},`)}}),t});this.base=e}custom(e){return this.next(`${this.base} ${e}`)}minWidth(e){const t=typeof e=="number"?`${e}px`:e,s=`${this.base} (min-width: ${t})`;return this.next(s)}maxWidth(e){const t=typeof e=="number"?`${e}px`:e,s=`${this.base} (max-width: ${t})`;return this.next(s)}minHeight(e){const t=typeof e=="number"?`${e}px`:e,s=`${this.base} (min-height: ${t})`;return this.next(s)}maxHeight(e){const t=typeof e=="number"?`${e}px`:e,s=`${this.base} (max-height: ${t})`;return this.next(s)}get portrait(){const e=`${this.base} (orientation: portrait)`;return this.next(e)}get landscape(){const e=`${this.base} (orientation: landscape)`;return this.next(e)}prefersColorScheme(e){const t=`${this.base} (prefers-color-scheme: ${e})`;return this.next(t)}get dark(){return this.prefersColorScheme("dark")}get light(){return this.prefersColorScheme("light")}get print(){const e=`${this.base} print`;return this.next(e)}get screen(){const e=`${this.base} screen`;return this.next(e)}get speech(){const e=`${this.base} speech`;return this.next(e)}get all(){const e=`${this.base} all`;return this.next(e)}get not(){const e=`${this.base} not`;return this.next(e)}get reducedMotion(){const e=`${this.base} (prefers-reduced-motion: reduce)`;return this.next(e)}}const M=new i,O=n=>`{${n}}`;exports.mergeStyles=j.mergeStyles;exports.MediaQueryFactory=i;exports.keyframes=k;exports.media=M;exports.token=O;

package/css/index.d.ts

@@ -1 +1,4 @@
-export declare const token: <T extends VariableTokens>(token: T) => string;
+export * from './keyframes';
+export * from './media';
+export * from './token';
+export * from './merge';