@salty-css/core 0.0.1-alpha.84 → 0.0.1-alpha.86

package/bin/main.cjs

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const se=require("commander"),H=require("fs"),s=require("fs/promises"),n=require("path"),ae=require("ejs"),oe=require("../compiler/index.cjs"),re=require("../pascal-case-iWoaJWwT.cjs"),L=require("winston"),ce=require("child_process"),le=require("ora");var B=typeof document<"u"?document.currentScript:null;const t=L.createLogger({level:"debug",format:L.format.combine(L.format.colorize(),L.format.cli()),transports:[new L.transports.Console({})]}),h=p=>{t.error(p)},ee=p=>new Promise((w,j)=>{ce.exec(p,F=>{if(F)return j(F);w()})}),D=async(...p)=>{const w=p.map(k=>k.replace("-D","").split("@").slice(0,-1).join("@").trim()).join(", "),j=le(`Installing packages: ${w}`).start(),F=p.join(" ");await ee(`npm install ${F}`),j.succeed(`Installed packages: ${w}`)},de=()=>H.existsSync(n.join(process.cwd(),"node_modules",".bin","prettier"));async function x(p){try{if(!de())return;await ee(`./node_modules/.bin/prettier --write "${p}"`),t.info(`Formatted ${p} with Prettier`)}catch(w){t.error(`Error formatting ${p} with Prettier:`,w)}}async function pe(){const p=new se.Command;p.name("salty-css").description("Salty-CSS CLI tool to help with annoying configuration tasks.");const w={"salty.config.ts":Promise.resolve().then(()=>require("../salty.config-Dk6ZcCxI.cjs")),"saltygen/index.css":Promise.resolve().then(()=>require("../index-84Wroia-.cjs")),"react/react-styled-file.ts":Promise.resolve().then(()=>require("../react-styled-file-Dkubsz-U.cjs")),"react/react-vanilla-file.ts":Promise.resolve().then(()=>require("../react-vanilla-file-CG_WJLam.cjs"))},j=async(i,o)=>{const{default:c}=await w[i],u=ae.render(c,o);return{fileName:i,content:u}},F=async()=>{const i=n.join(process.cwd(),".saltyrc");return await s.readFile(i,"utf-8").then(JSON.parse).catch(()=>({}))},k=n.join(process.cwd(),"package.json"),I=async(i=k)=>{const o=await s.readFile(i,"utf-8").then(JSON.parse).catch(()=>{});if(!o)throw"Could not read package.json file!";return o},te=async(i,o=k)=>{typeof i=="object"&&(i=JSON.stringify(i,null,2)),await s.writeFile(o,i)},V=async()=>{const i=new URL("../package.json",typeof document>"u"?require("url").pathToFileURL(__filename).href:B&&B.tagName.toUpperCase()==="SCRIPT"&&B.src||new URL("bin/main.cjs",document.baseURI).href);return I(i)},K=await(async()=>(await F()).defaultProject)(),b=await V(),q={core:`@salty-css/core@${b.version}`,react:`@salty-css/react@${b.version}`,eslintConfigCore:`@salty-css/eslint-config-core@${b.version}`,vite:`@salty-css/vite@${b.version}`,next:`@salty-css/next@${b.version}`},z=i=>{const o=i==="."?"":i,c=process.cwd();return n.join(c,o)};p.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(i="."){if(!await I().catch(()=>{}))return h("Salty CSS project must be initialized in a directory with a package.json file.");t.info("Initializing a new Salty-CSS project!");const{dir:c=i,cssFile:u,skipInstall:g}=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.");g||await D(q.core,q.react);const f=process.cwd(),l=z(c),$=await Promise.all([j("salty.config.ts"),j("saltygen/index.css")]);await s.mkdir(l,{recursive:!0});const m=$.map(async({fileName:e,content:a})=>{const d=n.join(l,e);if(await s.readFile(d,"utf-8").catch(()=>{})!==void 0){t.debug("File already exists: "+d);return}const C=e.split("/").slice(0,-1).join("/");C&&await s.mkdir(n.join(l,C),{recursive:!0}),t.info("Creating file: "+d),await s.writeFile(d,a),await x(d)});await Promise.all(m);const J=n.relative(f,l)||".",v=n.join(f,".saltyrc"),r=await s.readFile(v,"utf-8").catch(()=>{});if(r===void 0){t.info("Creating file: "+v);const a=JSON.stringify({defaultProject:J,projects:[J]},null,2);await s.writeFile(v,a)}else{t.info("Edit file: "+v);const e=JSON.parse(r),a=new Set((e==null?void 0:e.projects)||[]);a.add(J),e.projects=[...a];const d=JSON.stringify(e,null,2);await s.writeFile(v,d)}const S=n.join(f,".gitignore"),T=await s.readFile(S,"utf-8").catch(()=>{});T!==void 0&&(T.includes("saltygen")||(t.info("Edit file: "+S),await s.writeFile(S,T+`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ne=require("commander"),L=require("fs"),s=require("fs/promises"),n=require("path"),ie=require("ejs"),t=require("../index-BKoD9apd.cjs"),se=require("../pascal-case-iWoaJWwT.cjs"),oe=require("child_process"),ae=require("ora");var W=typeof document<"u"?document.currentScript:null;const Y=g=>new Promise((h,C)=>{oe.exec(g,x=>{if(x)return C(x);h()})}),N=async(...g)=>{const h=g.map(F=>F.replace("-D","").split("@").slice(0,-1).join("@").trim()).join(", "),C=ae(`Installing packages: ${h}`).start(),x=g.join(" ");await Y(`npm install ${x}`),C.succeed(`Installed packages: ${h}`)},re=()=>L.existsSync(n.join(process.cwd(),"node_modules",".bin","prettier"));async function P(g){try{if(!re())return;await Y(`./node_modules/.bin/prettier --write "${g}"`),t.logger.info(`Formatted ${g} with Prettier`)}catch(h){t.logger.error(`Error formatting ${g} with Prettier:`,h)}}async function ce(){const g=new ne.Command;g.name("salty-css").description("Salty-CSS CLI tool to help with annoying configuration tasks.");const h={"salty.config.ts":Promise.resolve().then(()=>require("../salty.config-Dk6ZcCxI.cjs")),"saltygen/index.css":Promise.resolve().then(()=>require("../index-84Wroia-.cjs")),"react/react-styled-file.ts":Promise.resolve().then(()=>require("../react-styled-file-Dkubsz-U.cjs")),"react/react-vanilla-file.ts":Promise.resolve().then(()=>require("../react-vanilla-file-CG_WJLam.cjs"))},C=async(i,a)=>{const{default:c}=await h[i],f=ie.render(c,a);return{fileName:i,content:f}},x=async()=>{const i=n.join(process.cwd(),".saltyrc");return await s.readFile(i,"utf-8").then(JSON.parse).catch(()=>({}))},F=n.join(process.cwd(),"package.json"),D=async(i=F)=>{const a=await s.readFile(i,"utf-8").then(JSON.parse).catch(()=>{});if(!a)throw"Could not read package.json file!";return a},Z=async(i,a=F)=>{typeof i=="object"&&(i=JSON.stringify(i,null,2)),await s.writeFile(a,i)},M=async()=>{const i=new URL("../package.json",typeof document>"u"?require("url").pathToFileURL(__filename).href:W&&W.tagName.toUpperCase()==="SCRIPT"&&W.src||new URL("bin/main.cjs",document.baseURI).href);return D(i)},B=await(async()=>(await x()).defaultProject)(),k=await M(),I={core:`@salty-css/core@${k.version}`,react:`@salty-css/react@${k.version}`,eslintConfigCore:`@salty-css/eslint-config-core@${k.version}`,vite:`@salty-css/vite@${k.version}`,next:`@salty-css/next@${k.version}`},R=i=>{const a=i==="."?"":i,c=process.cwd();return n.join(c,a)};g.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(i="."){if(!await D().catch(()=>{}))return t.logError("Salty CSS project must be initialized in a directory with a package.json file.");t.logger.info("Initializing a new Salty-CSS project!");const{dir:c=i,cssFile:f,skipInstall:u}=this.opts();if(!c)return t.logError("Project directory must be provided. Add it as the first argument after init command or use the --dir option.");u||await N(I.core,I.react);const p=process.cwd(),l=R(c),b=await Promise.all([C("salty.config.ts"),C("saltygen/index.css")]);await s.mkdir(l,{recursive:!0});const m=b.map(async({fileName:e,content:o})=>{const d=n.join(l,e);if(await s.readFile(d,"utf-8").catch(()=>{})!==void 0){t.logger.debug("File already exists: "+d);return}const S=e.split("/").slice(0,-1).join("/");S&&await s.mkdir(n.join(l,S),{recursive:!0}),t.logger.info("Creating file: "+d),await s.writeFile(d,o),await P(d)});await Promise.all(m);const E=n.relative(p,l)||".",j=n.join(p,".saltyrc"),r=await s.readFile(j,"utf-8").catch(()=>{});if(r===void 0){t.logger.info("Creating file: "+j);const o=JSON.stringify({defaultProject:E,projects:[E]},null,2);await s.writeFile(j,o)}else{t.logger.info("Edit file: "+j);const e=JSON.parse(r),o=new Set((e==null?void 0:e.projects)||[]);o.add(E),e.projects=[...o];const d=JSON.stringify(e,null,2);await s.writeFile(j,d)}const w=n.join(p,".gitignore"),A=await s.readFile(w,"utf-8").catch(()=>{});A!==void 0&&(A.includes("saltygen")||(t.logger.info("Edit file: "+w),await s.writeFile(w,A+`
 
 # Salty-CSS
 saltygen
-`)));const P=["src","public","assets","styles","css","app"],G=["styles","css","app","pages"],W=["index","styles","main","global","globals"],U=[".css",".scss",".sass"],N=await(async()=>{if(u)return u;for(const e of P)for(const a of W)for(const d of U){const y=n.join(l,e,a+d);if(await s.readFile(y,"utf-8").catch(()=>{})!==void 0)return n.relative(l,y);for(const O of G){const A=n.join(l,e,O,a+d);if(await s.readFile(A,"utf-8").catch(()=>{})!==void 0)return n.relative(l,A)}}})();if(N){const e=n.join(l,N),a=await s.readFile(e,"utf-8").catch(()=>{});if(a!==void 0&&!a.includes("saltygen")){const y=n.join(e,".."),O=`@import '${n.relative(y,n.join(l,"saltygen/index.css"))}';`;t.info("Adding global import statement to CSS file: "+e),await s.writeFile(e,O+`
-`+a),await x(e)}}else t.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");const X=n.join(f,".eslintrc.json"),ne=H.existsSync(X),Y=n.join(l,".eslintrc.json"),Z=H.existsSync(Y);if(ne||Z){g||await D(q.eslintConfigCore);const e=Z?Y:X,a=await s.readFile(e,"utf-8").catch(()=>{});if(!a)return h("Could not read ESLint config file.");if(!a.includes("salty-css")){const y=JSON.parse(a);t.info("Edit file: "+e),y.extends||(y.extends=[]),y.extends.push("@salty-css/core");const C=JSON.stringify(y,null,2);await s.writeFile(e,C),await x(e)}}const _=n.join(l,"vite.config.ts"),M=await s.readFile(_,"utf-8").catch(()=>{});if(M!==void 0&&!M.includes("saltyPlugin")){t.info("Edit file: "+_);const a=`import { saltyPlugin } from '@salty-css/vite';
-`,y=M.replace(/(plugins: \[)/,`$1
-  saltyPlugin(__dirname),`);g||await D(`-D ${q.vite}`),t.info("Adding Salty-CSS plugin to Vite config..."),await s.writeFile(_,a+y),await x(_)}const R=["next.config.js","next.config.cjs","next.config.ts","next.config.mjs"].map(e=>n.join(l,e)).find(e=>H.existsSync(e));if(R){let e=await s.readFile(R,"utf-8").catch(()=>{});if(e!==void 0&&!e.includes("withSaltyCss")){let d=!1;/\splugins([^=]*)=[^[]\[/.test(e)&&!d&&(e=e.replace(/\splugins([^=]*)=[^[]\[/,(A,E)=>` plugins${E}= [withSaltyCss,`),d=!0);const C=e.includes("module.exports"),O=C?`const { withSaltyCss } = require('@salty-css/next');
+`)));const v=["src","public","assets","styles","css","app"],H=["styles","css","app","pages"],z=["index","styles","main","global","globals"],T=[".css",".scss",".sass"],$=await(async()=>{if(f)return f;for(const e of v)for(const o of z)for(const d of T){const y=n.join(l,e,o+d);if(await s.readFile(y,"utf-8").catch(()=>{})!==void 0)return n.relative(l,y);for(const q of H){const O=n.join(l,e,q,o+d);if(await s.readFile(O,"utf-8").catch(()=>{})!==void 0)return n.relative(l,O)}}})();if($){const e=n.join(l,$),o=await s.readFile(e,"utf-8").catch(()=>{});if(o!==void 0&&!o.includes("saltygen")){const y=n.join(e,".."),q=`@import '${n.relative(y,n.join(l,"saltygen/index.css"))}';`;t.logger.info("Adding global import statement to CSS file: "+e),await s.writeFile(e,q+`
+`+o),await P(e)}}else t.logger.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");const K=n.join(p,".eslintrc.json"),ee=L.existsSync(K),Q=n.join(l,".eslintrc.json"),X=L.existsSync(Q);if(ee||X){u||await N(I.eslintConfigCore);const e=X?Q:K,o=await s.readFile(e,"utf-8").catch(()=>{});if(!o)return t.logError("Could not read ESLint config file.");if(!o.includes("salty-css")){const y=JSON.parse(o);t.logger.info("Edit file: "+e),y.extends||(y.extends=[]),y.extends.push("@salty-css/core");const S=JSON.stringify(y,null,2);await s.writeFile(e,S),await P(e)}}const U=n.join(l,"vite.config.ts"),G=await s.readFile(U,"utf-8").catch(()=>{});if(G!==void 0&&!G.includes("saltyPlugin")){t.logger.info("Edit file: "+U);const o=`import { saltyPlugin } from '@salty-css/vite';
+`,y=G.replace(/(plugins: \[)/,`$1
+  saltyPlugin(__dirname),`);u||await N(`-D ${I.vite}`),t.logger.info("Adding Salty-CSS plugin to Vite config..."),await s.writeFile(U,o+y),await P(U)}const _=["next.config.js","next.config.cjs","next.config.ts","next.config.mjs"].map(e=>n.join(l,e)).find(e=>L.existsSync(e));if(_){let e=await s.readFile(_,"utf-8").catch(()=>{});if(e!==void 0&&!e.includes("withSaltyCss")){let d=!1;/\splugins([^=]*)=[^[]\[/.test(e)&&!d&&(e=e.replace(/\splugins([^=]*)=[^[]\[/,(O,J)=>` plugins${J}= [withSaltyCss,`),d=!0);const S=e.includes("module.exports"),q=S?`const { withSaltyCss } = require('@salty-css/next');
 `:`import { withSaltyCss } from '@salty-css/next';
-`;C&&!d?(e=e.replace(/module.exports = ([^;]+)/,(A,E)=>`module.exports = withSaltyCss(${E})`),d=!0):d||(e=e.replace(/export default ([^;]+)/,(A,E)=>`export default withSaltyCss(${E})`)),g||await D(`-D ${q.next}`),t.info("Adding Salty-CSS plugin to Next.js config..."),await s.writeFile(R,O+e),await x(R)}}const ie=await I().catch(()=>h("Could not read package.json file.")).then(e=>(e.scripts||(e.scripts={}),e.scripts.prepare?e.scripts.prepare.includes("salty-css")||(t.info("Edit file: "+k),e.scripts.prepare=e.scripts.prepare+" && npx salty-css build"):(t.info("Edit file: "+k),e.scripts.prepare="npx salty-css build"),e));await te(ie),t.info("🎉 Salty CSS project initialized successfully!"),t.info("Next steps:"),t.info("1. Configure variables and templates in `salty.config.ts`"),t.info("2. Create a new component with `npx salty-css generate [component-name]`"),t.info("3. Run `npx salty-css build` to generate the CSS"),t.info("4. Read about the features in the documentation: https://salty-css.dev"),t.info("5. Star the project on GitHub: https://github.com/margarita-form/salty-css ⭐")}),p.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(i=K){t.info("Building the Salty-CSS project...");const{dir:o=i}=this.opts();if(!o)return h("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");const c=z(o);await oe.generateCss(c)}),p.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("-rc, --reactComponent <rc>","Generate a React component as well.").action(async function(i,o=K){const{file:c=i,dir:u=o,tag:g,name:f,className:l,reactComponent:$=!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(!u)return h("Project directory must be provided. Add it as the second argument after generate command or use the --dir option.");const m=z(u),J=c.split("/").slice(0,-1).join("/");J&&await s.mkdir(n.join(m,J),{recursive:!0});const v=n.join(m,c),r=n.parse(v);r.ext||(r.ext=".ts"),r.name.endsWith(".css")||(r.name=r.name+".css"),r.base=r.name+r.ext;const S=n.format(r);if(await s.readFile(S,"utf-8").catch(()=>{})!==void 0){t.error("File already exists:",S);return}let P=re.pascalCase(f||r.base.replace(/\.css\.\w+$/,""));if($){const W=P+"Component";P=P+"Wrapper";const U=r.base.replace(/\.css\.\w+$/,""),{content:Q}=await j("react/react-vanilla-file.ts",{tag:g,componentName:W,styledComponentName:P,className:l,fileName:U});r.name=U.replace(/\.css$/,""),r.ext=".tsx",r.base=r.name+r.ext;const N=n.format(r);t.info("Generating a new file: "+N),await s.writeFile(N,Q),await x(N)}const{content:G}=await j("react/react-styled-file.ts",{tag:g,name:P,className:l});t.info("Generating a new file: "+S),await s.writeFile(S,G),await x(S)}),p.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(i="latest"){const{legacyPeerDeps:o,version:c=i}=this.opts(),u=n.join(process.cwd(),"package.json"),g=await I(u).catch(m=>h(m));if(!g)return;const f={...g.dependencies,...g.devDependencies},l=Object.keys(f).filter(m=>m==="salty-css"||m.startsWith("@salty-css/"));if(!l.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: "+u);const $=l.map(m=>c==="@"?`${m}@${b.version}`:`${m}@${c.replace(/^@/,"")}`);o?(t.warn("Using legacy peer dependencies to update packages."),await D(...$,"--legacy-peer-deps")):await D(...$),t.info("Salty-CSS packages updated successfully!")}),p.option("-v, --version","Show the current version of Salty-CSS.").action(async function(){const i=await V();t.info("CLI is running: "+i.version);const o=n.join(process.cwd(),"package.json"),c=await I(o).catch(f=>h(f));if(!c)return;const u={...c.dependencies,...c.devDependencies},g=Object.keys(u).filter(f=>f==="salty-css"||f.startsWith("@salty-css/"));if(!g.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: "+o);for(const f of g)t.info(`${f}: ${u[f]}`)}),p.parseAsync(process.argv)}exports.main=pe;
+`;S&&!d?(e=e.replace(/module.exports = ([^;]+)/,(O,J)=>`module.exports = withSaltyCss(${J})`),d=!0):d||(e=e.replace(/export default ([^;]+)/,(O,J)=>`export default withSaltyCss(${J})`)),u||await N(`-D ${I.next}`),t.logger.info("Adding Salty-CSS plugin to Next.js config..."),await s.writeFile(_,q+e),await P(_)}}const te=await D().catch(()=>t.logError("Could not read package.json file.")).then(e=>(e.scripts||(e.scripts={}),e.scripts.prepare?e.scripts.prepare.includes("salty-css")||(t.logger.info("Edit file: "+F),e.scripts.prepare=e.scripts.prepare+" && npx salty-css build"):(t.logger.info("Edit file: "+F),e.scripts.prepare="npx salty-css build"),e));await Z(te),t.logger.info("🎉 Salty CSS project initialized successfully!"),t.logger.info("Next steps:"),t.logger.info("1. Configure variables and templates in `salty.config.ts`"),t.logger.info("2. Create a new component with `npx salty-css generate [component-name]`"),t.logger.info("3. Run `npx salty-css build` to generate the CSS"),t.logger.info("4. Read about the features in the documentation: https://salty-css.dev"),t.logger.info("5. Star the project on GitHub: https://github.com/margarita-form/salty-css ⭐")}),g.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(i=B){t.logger.info("Building the Salty-CSS project...");const{dir:a=i}=this.opts();if(!a)return t.logError("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");const c=R(a);await t.generateCss(c)}),g.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("-rc, --reactComponent <rc>","Generate a React component as well.").action(async function(i,a=B){const{file:c=i,dir:f=a,tag:u,name:p,className:l,reactComponent:b=!1}=this.opts();if(!c)return t.logError("File to generate must be provided. Add it as the first argument after generate command or use the --file option.");if(!f)return t.logError("Project directory must be provided. Add it as the second argument after generate command or use the --dir option.");const m=R(f),E=c.split("/").slice(0,-1).join("/");E&&await s.mkdir(n.join(m,E),{recursive:!0});const j=n.join(m,c),r=n.parse(j);r.ext||(r.ext=".ts"),r.name.endsWith(".css")||(r.name=r.name+".css"),r.base=r.name+r.ext;const w=n.format(r);if(await s.readFile(w,"utf-8").catch(()=>{})!==void 0){t.logger.error("File already exists:",w);return}let v=se.pascalCase(p||r.base.replace(/\.css\.\w+$/,""));if(b){const z=v+"Component";v=v+"Wrapper";const T=r.base.replace(/\.css\.\w+$/,""),{content:V}=await C("react/react-vanilla-file.ts",{tag:u,componentName:z,styledComponentName:v,className:l,fileName:T});r.name=T.replace(/\.css$/,""),r.ext=".tsx",r.base=r.name+r.ext;const $=n.format(r);t.logger.info("Generating a new file: "+$),await s.writeFile($,V),await P($)}const{content:H}=await C("react/react-styled-file.ts",{tag:u,name:v,className:l});t.logger.info("Generating a new file: "+w),await s.writeFile(w,H),await P(w)}),g.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(i="latest"){const{legacyPeerDeps:a,version:c=i}=this.opts(),f=n.join(process.cwd(),"package.json"),u=await D(f).catch(m=>t.logError(m));if(!u)return;const p={...u.dependencies,...u.devDependencies},l=Object.keys(p).filter(m=>m==="salty-css"||m.startsWith("@salty-css/"));if(!l.length)return t.logError("No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: "+f);const b=l.map(m=>c==="@"?`${m}@${k.version}`:`${m}@${c.replace(/^@/,"")}`);a?(t.logger.warn("Using legacy peer dependencies to update packages."),await N(...b,"--legacy-peer-deps")):await N(...b),t.logger.info("Salty-CSS packages updated successfully!")}),g.option("-v, --version","Show the current version of Salty-CSS.").action(async function(){const i=await M();t.logger.info("CLI is running: "+i.version);const a=n.join(process.cwd(),"package.json"),c=await D(a).catch(p=>t.logError(p));if(!c)return;const f={...c.dependencies,...c.devDependencies},u=Object.keys(f).filter(p=>p==="salty-css"||p.startsWith("@salty-css/"));if(!u.length)return t.logError("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 p of u)t.logger.info(`${p}: ${f[p]}`)}),g.parseAsync(process.argv)}exports.main=ce;

package/bin/main.js

@@ -1,38 +1,31 @@
-import { Command as rt } from "commander";
+import { Command as ot } from "commander";
 import { existsSync as G } from "fs";
-import { mkdir as V, readFile as y, writeFile as h } from "fs/promises";
-import { join as a, relative as z, parse as ct, format as nt } from "path";
-import { render as lt } from "ejs";
-import { generateCss as dt } from "../compiler/index.js";
-import { p as pt } from "../pascal-case-BQpR5PdN.js";
-import { createLogger as ft, format as K, transports as gt } from "winston";
-import { exec as ut } from "child_process";
-import mt from "ora";
-const e = ft({
-  level: "debug",
-  format: K.combine(K.colorize(), K.cli()),
-  transports: [new gt.Console({})]
-}), w = (d) => {
-  e.error(d);
-}, st = (d) => new Promise((C, P) => {
-  ut(d, (b) => {
-    if (b) return P(b);
+import { mkdir as V, readFile as m, writeFile as h } from "fs/promises";
+import { join as a, relative as z, parse as rt, format as et } from "path";
+import { render as ct } from "ejs";
+import { l as e, a as w, g as lt } from "../index-BGaLvshf.js";
+import { p as dt } from "../pascal-case-BQpR5PdN.js";
+import { exec as pt } from "child_process";
+import ft from "ora";
+const nt = (d) => new Promise((C, P) => {
+  pt(d, (F) => {
+    if (F) return P(F);
     C();
   });
 }), I = async (...d) => {
-  const C = d.map((F) => F.replace("-D", "").split("@").slice(0, -1).join("@").trim()).join(", "), P = mt(`Installing packages: ${C}`).start(), b = d.join(" ");
-  await st(`npm install ${b}`), P.succeed(`Installed packages: ${C}`);
-}, yt = () => G(a(process.cwd(), "node_modules", ".bin", "prettier"));
+  const C = d.map((b) => b.replace("-D", "").split("@").slice(0, -1).join("@").trim()).join(", "), P = ft(`Installing packages: ${C}`).start(), F = d.join(" ");
+  await nt(`npm install ${F}`), P.succeed(`Installed packages: ${C}`);
+}, gt = () => G(a(process.cwd(), "node_modules", ".bin", "prettier"));
 async function k(d) {
   try {
-    if (!yt()) return;
-    await st(`./node_modules/.bin/prettier --write "${d}"`), e.info(`Formatted ${d} with Prettier`);
+    if (!gt()) return;
+    await nt(`./node_modules/.bin/prettier --write "${d}"`), e.info(`Formatted ${d} with Prettier`);
   } catch (C) {
     e.error(`Error formatting ${d} with Prettier:`, C);
   }
 }
-async function Jt() {
-  const d = new rt();
+async function kt() {
+  const d = new ot();
   d.name("salty-css").description("Salty-CSS CLI tool to help with annoying configuration tasks.");
   const C = {
     // Core files
@@ -42,22 +35,22 @@ async function Jt() {
     "react/react-styled-file.ts": import("../react-styled-file-CGVf5n1B.js"),
     "react/react-vanilla-file.ts": import("../react-vanilla-file-CCXbsjIb.js")
   }, P = async (n, i) => {
-    const { default: r } = await C[n], f = lt(r, i);
+    const { default: r } = await C[n], f = ct(r, i);
     return { fileName: n, content: f };
-  }, b = async () => {
+  }, F = async () => {
     const n = a(process.cwd(), ".saltyrc");
-    return await y(n, "utf-8").then(JSON.parse).catch(() => ({}));
-  }, F = a(process.cwd(), "package.json"), A = async (n = F) => {
-    const i = await y(n, "utf-8").then(JSON.parse).catch(() => {
+    return await m(n, "utf-8").then(JSON.parse).catch(() => ({}));
+  }, b = a(process.cwd(), "package.json"), A = async (n = b) => {
+    const i = await m(n, "utf-8").then(JSON.parse).catch(() => {
     });
     if (!i) throw "Could not read package.json file!";
     return i;
-  }, at = async (n, i = F) => {
+  }, st = async (n, i = b) => {
     typeof n == "object" && (n = JSON.stringify(n, null, 2)), await h(i, n);
-  }, Q = async () => {
+  }, K = async () => {
     const n = new URL("../package.json", import.meta.url);
     return A(n);
-  }, X = await (async () => (await b()).defaultProject)(), $ = await Q(), O = {
+  }, Q = await (async () => (await F()).defaultProject)(), $ = await K(), O = {
     core: `@salty-css/core@${$.version}`,
     react: `@salty-css/react@${$.version}`,
     eslintConfigCore: `@salty-css/eslint-config-core@${$.version}`,
@@ -76,9 +69,9 @@ async function Jt() {
     g || await I(O.core, O.react);
     const p = process.cwd(), c = W(r), J = await Promise.all([P("salty.config.ts"), P("saltygen/index.css")]);
     await V(c, { recursive: !0 });
-    const m = J.map(async ({ fileName: t, content: s }) => {
+    const y = J.map(async ({ fileName: t, content: s }) => {
       const l = a(c, t);
-      if (await y(l, "utf-8").catch(() => {
+      if (await m(l, "utf-8").catch(() => {
       }) !== void 0) {
         e.debug("File already exists: " + l);
         return;
@@ -86,8 +79,8 @@ async function Jt() {
       const v = t.split("/").slice(0, -1).join("/");
       v && await V(a(c, v), { recursive: !0 }), e.info("Creating file: " + l), await h(l, s), await k(l);
     });
-    await Promise.all(m);
-    const N = z(p, c) || ".", j = a(p, ".saltyrc"), o = await y(j, "utf-8").catch(() => {
+    await Promise.all(y);
+    const N = z(p, c) || ".", j = a(p, ".saltyrc"), o = await m(j, "utf-8").catch(() => {
     });
     if (o === void 0) {
       e.info("Creating file: " + j);
@@ -103,7 +96,7 @@ async function Jt() {
       const l = JSON.stringify(t, null, 2);
       await h(j, l);
     }
-    const S = a(p, ".gitignore"), T = await y(S, "utf-8").catch(() => {
+    const S = a(p, ".gitignore"), T = await m(S, "utf-8").catch(() => {
     });
     T !== void 0 && (T.includes("saltygen") || (e.info("Edit file: " + S), await h(S, T + `
 
@@ -116,17 +109,17 @@ saltygen
         for (const s of q)
           for (const l of U) {
             const u = a(c, t, s + l);
-            if (await y(u, "utf-8").catch(() => {
+            if (await m(u, "utf-8").catch(() => {
             }) !== void 0) return z(c, u);
             for (const H of M) {
               const L = a(c, t, H, s + l);
-              if (await y(L, "utf-8").catch(() => {
+              if (await m(L, "utf-8").catch(() => {
               }) !== void 0) return z(c, L);
             }
           }
     })();
     if (E) {
-      const t = a(c, E), s = await y(t, "utf-8").catch(() => {
+      const t = a(c, E), s = await m(t, "utf-8").catch(() => {
       });
       if (s !== void 0 && !s.includes("saltygen")) {
         const u = a(t, ".."), H = `@import '${z(u, a(c, "saltygen/index.css"))}';`;
@@ -135,10 +128,10 @@ saltygen
       }
     } else
       e.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");
-    const Z = a(p, ".eslintrc.json"), it = G(Z), tt = a(c, ".eslintrc.json"), et = G(tt);
-    if (it || et) {
+    const Y = a(p, ".eslintrc.json"), at = G(Y), Z = a(c, ".eslintrc.json"), tt = G(Z);
+    if (at || tt) {
       g || await I(O.eslintConfigCore);
-      const t = et ? tt : Z, s = await y(t, "utf-8").catch(() => {
+      const t = tt ? Z : Y, s = await m(t, "utf-8").catch(() => {
       });
       if (!s) return w("Could not read ESLint config file.");
       if (!s.includes("salty-css")) {
@@ -148,7 +141,7 @@ saltygen
         await h(t, v), await k(t);
       }
     }
-    const R = a(c, "vite.config.ts"), B = await y(R, "utf-8").catch(() => {
+    const R = a(c, "vite.config.ts"), B = await m(R, "utf-8").catch(() => {
     });
     if (B !== void 0 && !B.includes("saltyPlugin")) {
       e.info("Edit file: " + R);
@@ -159,7 +152,7 @@ saltygen
     }
     const _ = ["next.config.js", "next.config.cjs", "next.config.ts", "next.config.mjs"].map((t) => a(c, t)).find((t) => G(t));
     if (_) {
-      let t = await y(_, "utf-8").catch(() => {
+      let t = await m(_, "utf-8").catch(() => {
       });
       if (t !== void 0 && !t.includes("withSaltyCss")) {
         let l = !1;
@@ -170,51 +163,51 @@ saltygen
         v && !l ? (t = t.replace(/module.exports = ([^;]+)/, (L, D) => `module.exports = withSaltyCss(${D})`), l = !0) : l || (t = t.replace(/export default ([^;]+)/, (L, D) => `export default withSaltyCss(${D})`)), g || await I(`-D ${O.next}`), e.info("Adding Salty-CSS plugin to Next.js config..."), await h(_, H + t), await k(_);
       }
     }
-    const ot = await A().catch(() => w("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: " + F), t.scripts.prepare = t.scripts.prepare + " && npx salty-css build") : (e.info("Edit file: " + F), t.scripts.prepare = "npx salty-css build"), t));
-    await at(ot), 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 ⭐");
-  }), d.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(n = X) {
+    const it = await A().catch(() => w("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: " + b), t.scripts.prepare = t.scripts.prepare + " && npx salty-css build") : (e.info("Edit file: " + b), t.scripts.prepare = "npx salty-css build"), t));
+    await st(it), 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 ⭐");
+  }), d.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(n = Q) {
     e.info("Building the Salty-CSS project...");
     const { dir: i = n } = this.opts();
     if (!i) return w("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");
     const r = W(i);
-    await dt(r);
-  }), d.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("-rc, --reactComponent <rc>", "Generate a React component as well.").action(async function(n, i = X) {
+    await lt(r);
+  }), d.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("-rc, --reactComponent <rc>", "Generate a React component as well.").action(async function(n, i = Q) {
     const { file: r = n, dir: f = i, tag: g, name: p, className: c, reactComponent: J = !1 } = this.opts();
     if (!r) return w("File to generate must be provided. Add it as the first argument after generate command or use the --file option.");
     if (!f) return w("Project directory must be provided. Add it as the second argument after generate command or use the --dir option.");
-    const m = W(f), N = r.split("/").slice(0, -1).join("/");
-    N && await V(a(m, N), { recursive: !0 });
-    const j = a(m, r), o = ct(j);
+    const y = W(f), N = r.split("/").slice(0, -1).join("/");
+    N && await V(a(y, N), { recursive: !0 });
+    const j = a(y, r), o = rt(j);
     o.ext || (o.ext = ".ts"), o.name.endsWith(".css") || (o.name = o.name + ".css"), o.base = o.name + o.ext;
-    const S = nt(o);
-    if (await y(S, "utf-8").catch(() => {
+    const S = et(o);
+    if (await m(S, "utf-8").catch(() => {
     }) !== void 0) {
       e.error("File already exists:", S);
       return;
     }
-    let x = pt(p || o.base.replace(/\.css\.\w+$/, ""));
+    let x = dt(p || o.base.replace(/\.css\.\w+$/, ""));
     if (J) {
       const q = x + "Component";
       x = x + "Wrapper";
-      const U = o.base.replace(/\.css\.\w+$/, ""), { content: Y } = await P("react/react-vanilla-file.ts", { tag: g, componentName: q, styledComponentName: x, className: c, fileName: U });
+      const U = o.base.replace(/\.css\.\w+$/, ""), { content: X } = await P("react/react-vanilla-file.ts", { tag: g, componentName: q, styledComponentName: x, className: c, fileName: U });
       o.name = U.replace(/\.css$/, ""), o.ext = ".tsx", o.base = o.name + o.ext;
-      const E = nt(o);
-      e.info("Generating a new file: " + E), await h(E, Y), await k(E);
+      const E = et(o);
+      e.info("Generating a new file: " + E), await h(E, X), await k(E);
     }
     const { content: M } = await P("react/react-styled-file.ts", { tag: g, name: x, className: c });
     e.info("Generating a new file: " + S), await h(S, M), await k(S);
   }), d.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(n = "latest") {
-    const { legacyPeerDeps: i, version: r = n } = this.opts(), f = a(process.cwd(), "package.json"), g = await A(f).catch((m) => w(m));
+    const { legacyPeerDeps: i, version: r = n } = this.opts(), f = a(process.cwd(), "package.json"), g = await A(f).catch((y) => w(y));
     if (!g) return;
-    const p = { ...g.dependencies, ...g.devDependencies }, c = Object.keys(p).filter((m) => m === "salty-css" || m.startsWith("@salty-css/"));
+    const p = { ...g.dependencies, ...g.devDependencies }, c = Object.keys(p).filter((y) => y === "salty-css" || y.startsWith("@salty-css/"));
     if (!c.length)
       return w(
         "No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: " + f
       );
-    const J = c.map((m) => r === "@" ? `${m}@${$.version}` : `${m}@${r.replace(/^@/, "")}`);
+    const J = c.map((y) => r === "@" ? `${y}@${$.version}` : `${y}@${r.replace(/^@/, "")}`);
     i ? (e.warn("Using legacy peer dependencies to update packages."), await I(...J, "--legacy-peer-deps")) : await I(...J), e.info("Salty-CSS packages updated successfully!");
   }), d.option("-v, --version", "Show the current version of Salty-CSS.").action(async function() {
-    const n = await Q();
+    const n = await K();
     e.info("CLI is running: " + n.version);
     const i = a(process.cwd(), "package.json"), r = await A(i).catch((p) => w(p));
     if (!r) return;
@@ -228,5 +221,5 @@ saltygen
   }), d.parseAsync(process.argv);
 }
 export {
-  Jt as main
+  kt as main
 };

package/compiler/index.cjs

@@ -1,11 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Y=require("esbuild"),Z=require("child_process"),N=require("../dash-case-DKzpenwY.cjs"),o=require("path"),a=require("fs"),I=require("fs/promises"),R=require("../parse-templates-DVK3iZIl.cjs");var V=typeof document<"u"?document.currentScript:null;function Q(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 z=Q(Y),B=t=>{if(!t||t==="/")throw new Error("Could not find package.json file");const e=o.join(t,"package.json");return a.existsSync(e)?e:B(o.join(t,".."))},tt=async t=>{const e=B(t);return await I.readFile(e,"utf-8").then(JSON.parse).catch(()=>{})},et=async t=>{const e=await tt(t);if(e)return e.type};let D;const H=async t=>{if(D)return D;const e=await et(t);return e==="module"?D="esm":(e==="commonjs"||(typeof document>"u"?require("url").pathToFileURL(__filename).href:V&&V.tagName.toUpperCase()==="SCRIPT"&&V.src||new URL("compiler/index.cjs",document.baseURI).href).endsWith(".cjs"))&&(D="cjs"),D||"esm"},_={externalModules:[]},U=t=>{if(_.externalModules.length>0)return _.externalModules;const e=o.join(t,"salty.config.ts"),s=a.readFileSync(e,"utf8").match(/externalModules:\s?\[(.*)\]/);if(!s)return[];const l=s[1].split(",").map(w=>w.replace(/['"`]/g,"").trim());return _.externalModules=l,l},v=t=>o.join(t,"./saltygen"),W=["salty","css","styles","styled"],K=(t=[])=>new RegExp(`\\.(${[...W,...t].join("|")})\\.`),E=(t,e=[])=>K(e).test(t),st=async t=>{const e=v(t),n=o.join(t,"salty.config.ts"),s=o.join(e,"salty.config.js"),l=await H(t),w=U(t);await z.build({entryPoints:[n],minify:!0,treeShaking:!0,bundle:!0,outfile:s,format:l,external:w});const f=Date.now(),{config:g}=await import(`${s}?t=${f}`);return g},L=async t=>{const e=await st(t),n=new Set,s=(r,u=[])=>r?Object.entries(r).flatMap(([d,p])=>{if(!p)return;if(typeof p=="object")return s(p,[...u,d]);const x=[...u,d].join(".");n.add(`"${x}"`);const h=[...u.map(N.dashCase),N.dashCase(d)].join("-"),{result:j}=R.parseValueTokens(p);return`--${h}: ${j};`}):[],l=r=>r?Object.entries(r).flatMap(([u,d])=>{const p=s(d);return u==="base"?p.join(""):`${u} { ${p.join("")} }`}):[],w=r=>r?Object.entries(r).flatMap(([u,d])=>Object.entries(d).flatMap(([p,x])=>{const h=s(x,[u]),j=`.${u}-${p}, [data-${u}="${p}"]`,P=h.join("");return`${j} { ${P} }`})):[],f=s(e.variables),g=l(e.responsiveVariables),i=w(e.conditionalVariables),$=v(t),S=o.join($,"css/variables.css"),k=`:root { ${f.join("")} ${g.join("")} } ${i.join("")}`;a.writeFileSync(S,k);const m=o.join($,"types/css-tokens.d.ts"),y=`type VariableTokens = ${[...n].join("|")||'""'}; type PropertyValueToken = \`{\${VariableTokens}}\``;a.writeFileSync(m,y);const C=o.join($,"css/global.css"),F=R.parseStyles(e.global,"");a.writeFileSync(C,F);const b=o.join($,"css/templates.css"),T=R.parseTemplates(e.templates);a.writeFileSync(b,T)},O=async(t,e,n)=>{const s=N.toHash(e),l=o.join(n,"js",s+".js"),w=await H(t),f=U(t);await z.build({entryPoints:[e],minify:!0,treeShaking:!0,bundle:!0,outfile:l,format:w,target:["es2022"],keepNames:!0,external:f});const g=Date.now();return await import(`${l}?t=${g}`)},J=async t=>{const e=v(t),n=o.join(e,"salty.config.js"),{config:s}=await import(n);return s},nt=async t=>{try{const e=[],n=[],s=v(t),l=o.join(s,"index.css");(()=>{a.existsSync(s)&&Z.execSync("rm -rf "+s),a.mkdirSync(s),a.mkdirSync(o.join(s,"css")),a.mkdirSync(o.join(s,"types"))})(),await L(t);const f=await J(t);async function g(c,y){const C=["node_modules","saltygen"],F=a.statSync(c);if(F.isDirectory()){const b=a.readdirSync(c);if(C.some(r=>c.includes(r)))return;await Promise.all(b.map(r=>g(o.join(c,r),o.join(y,r))))}else if(F.isFile()&&E(c)){const T=await O(t,c,s),r=[];Object.entries(T).forEach(([x,h])=>{if(h.isKeyframes&&h.css){const q=`${h.animationName}.css`,A=`css/${q}`,X=o.join(s,A);e.push(q),a.writeFileSync(X,h.css);return}if(!h.generator)return;const j=h.generator._withBuildContext({name:x,config:f}),P=`${j.hash}-${j.priority}.css`;n[j.priority]||(n[j.priority]=[]),n[j.priority].push(P),r.push(P);const M=`css/${P}`,G=o.join(s,M);a.writeFileSync(G,j.css)});const u=r.map(x=>`@import url('./${x}');`).join(`
-`),d=N.toHash(c,6),p=o.join(s,`css/${d}.css`);a.writeFileSync(p,u)}}await g(t,s);const i=e.map(c=>`@import url('./css/${c}');`).join(`
-`);let m=`@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
-
-${["variables.css","global.css","templates.css"].filter(c=>{try{return a.readFileSync(o.join(s,"css",c),"utf8").length>0}catch{return!1}}).map(c=>`@import url('./css/${c}');`).join(`
-`)}
-${i}`;if(f.importStrategy!=="component"){const c=n.flat().map(y=>`@import url('./css/${y}');`).join(`
-`);m+=c}a.writeFileSync(l,m)}catch(e){console.error(e)}},ot=async(t,e)=>{try{const n=[],s=o.join(t,"./saltygen"),l=o.join(s,"index.css");if(E(e)){const f=await J(t),g=await O(t,e,s);Object.entries(g).forEach(([m,c])=>{if(!c.generator)return;const y=c.generator._withBuildContext({name:m,config:f}),C=`${y.hash}-${y.priority}.css`,F=`css/${C}`,b=o.join(s,F);n.push(C),a.writeFileSync(b,y.css)});const i=a.readFileSync(l,"utf8").split(`
-`),$=n.map(m=>`@import url('../saltygen/css/${m}');`),k=[...new Set([...i,...$])].join(`
-`);a.writeFileSync(l,k)}}catch(n){console.error(n)}},it=async(t,e)=>{try{const n=o.join(t,"./saltygen");if(E(e)){const l=a.readFileSync(e,"utf8");l.replace(/^(?!export\s)const\s.*/gm,S=>`export ${S}`)!==l&&await I.writeFile(e,l);const f=await J(t),g=await O(t,e,n);let i=l;Object.entries(g).forEach(([S,k])=>{var P;if(k.isKeyframes||!k.generator)return;const m=k.generator._withBuildContext({name:S,config:f}),c=new RegExp(`\\s${S}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(l);if(!c)return console.error("Could not find the original declaration");const y=(P=c.at(1))==null?void 0:P.trim(),C=new RegExp(`\\s${S}[=\\s]+styled\\(`,"g").exec(i);if(!C)return console.error("Could not find the original declaration");const{index:F}=C;let b=!1;const T=setTimeout(()=>b=!0,5e3);let r=0,u=!1,d=0;for(;!u&&!b;){const M=i[F+r];M==="("&&d++,M===")"&&d--,d===0&&M===")"&&(u=!0),r>i.length&&(b=!0),r++}if(!b)clearTimeout(T);else throw new Error("Failed to find the end of the styled call and timed out");const p=F+r,x=i.slice(F,p),h=i,j=` ${S} = styled(${y}, "${m.classNames}", "${m._callerName}", ${JSON.stringify(m.props)});`;i=i.replace(x,j),h===i&&console.error("Minimize file failed to change content",{name:S,tagName:y})});const $=N.toHash(e,6);return f.importStrategy==="component"&&(i=`import '../../saltygen/css/${$}.css';
-${i}`),i=i.replace("{ styled }","{ styledClient as styled }"),i=i.replace("@salty-css/react/styled","@salty-css/react/styled-client"),i}}catch(n){console.error("Error in minimizeFile:",n)}};exports.compileSaltyFile=O;exports.generateConfigStyles=L;exports.generateCss=nt;exports.generateFile=ot;exports.isSaltyFile=E;exports.minimizeFile=it;exports.saltyFileExtensions=W;exports.saltyFileRegExp=K;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("esbuild");require("child_process");require("../dash-case-DKzpenwY.cjs");require("path");require("fs");require("fs/promises");require("../parse-templates-DVK3iZIl.cjs");const e=require("../index-BKoD9apd.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

@@ -11,6 +11,6 @@ export declare const compileSaltyFile: (dirname: string, sourceFilePath: string,
         css?: string;
     };
 }>;
-export declare const generateCss: (dirname: string) => Promise<void>;
+export declare const generateCss: (dirname: string, prod?: 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>;

package/compiler/index.js

@@ -1,214 +1,18 @@
-import * as z from "esbuild";
-import { execSync as U } from "child_process";
-import { t as J, d as _ } from "../dash-case-DMQMcCO6.js";
-import { join as n } from "path";
-import { existsSync as W, writeFileSync as j, mkdirSync as v, statSync as X, readdirSync as Y, readFileSync as N } from "fs";
-import { readFile as Z, writeFile as Q } from "fs/promises";
-import { p as tt, a as st, b as et } from "../parse-templates-DUUSaubj.js";
-const H = (t) => {
-  if (!t || t === "/") throw new Error("Could not find package.json file");
-  const s = n(t, "package.json");
-  return W(s) ? s : H(n(t, ".."));
-}, nt = async (t) => {
-  const s = H(t);
-  return await Z(s, "utf-8").then(JSON.parse).catch(() => {
-  });
-}, ot = async (t) => {
-  const s = await nt(t);
-  if (s)
-    return s.type;
-};
-let M;
-const K = async (t) => {
-  if (M) return M;
-  const s = await ot(t);
-  return s === "module" ? M = "esm" : (s === "commonjs" || import.meta.url.endsWith(".cjs")) && (M = "cjs"), M || "esm";
-}, V = {
-  externalModules: []
-}, G = (t) => {
-  if (V.externalModules.length > 0) return V.externalModules;
-  const s = n(t, "salty.config.ts"), e = N(s, "utf8").match(/externalModules:\s?\[(.*)\]/);
-  if (!e) return [];
-  const i = e[1].split(",").map((w) => w.replace(/['"`]/g, "").trim());
-  return V.externalModules = i, i;
-}, E = (t) => n(t, "./saltygen"), ct = ["salty", "css", "styles", "styled"], rt = (t = []) => new RegExp(`\\.(${[...ct, ...t].join("|")})\\.`), O = (t, s = []) => rt(s).test(t), at = async (t) => {
-  const s = E(t), o = n(t, "salty.config.ts"), e = n(s, "salty.config.js"), i = await K(t), w = G(t);
-  await z.build({
-    entryPoints: [o],
-    minify: !0,
-    treeShaking: !0,
-    bundle: !0,
-    outfile: e,
-    format: i,
-    external: w
-  });
-  const f = Date.now(), { config: y } = await import(`${e}?t=${f}`);
-  return y;
-}, it = async (t) => {
-  const s = await at(t), o = /* @__PURE__ */ new Set(), e = (a, l = []) => a ? Object.entries(a).flatMap(([g, p]) => {
-    if (!p) return;
-    if (typeof p == "object") return e(p, [...l, g]);
-    const C = [...l, g].join(".");
-    o.add(`"${C}"`);
-    const m = [...l.map(_), _(g)].join("-"), { result: h } = et(p);
-    return `--${m}: ${h};`;
-  }) : [], i = (a) => a ? Object.entries(a).flatMap(([l, g]) => {
-    const p = e(g);
-    return l === "base" ? p.join("") : `${l} { ${p.join("")} }`;
-  }) : [], w = (a) => a ? Object.entries(a).flatMap(([l, g]) => Object.entries(g).flatMap(([p, C]) => {
-    const m = e(C, [l]), h = `.${l}-${p}, [data-${l}="${p}"]`, P = m.join("");
-    return `${h} { ${P} }`;
-  })) : [], f = e(s.variables), y = i(s.responsiveVariables), c = w(s.conditionalVariables), x = E(t), $ = n(x, "css/variables.css"), k = `:root { ${f.join("")} ${y.join("")} } ${c.join("")}`;
-  j($, k);
-  const d = n(x, "types/css-tokens.d.ts"), u = `type VariableTokens = ${[...o].join("|") || '""'}; type PropertyValueToken = \`{\${VariableTokens}}\``;
-  j(d, u);
-  const S = n(x, "css/global.css"), F = tt(s.global, "");
-  j(S, F);
-  const b = n(x, "css/templates.css"), D = st(s.templates);
-  j(b, D);
-}, R = async (t, s, o) => {
-  const e = J(s), i = n(o, "js", e + ".js"), w = await K(t), f = G(t);
-  await z.build({
-    entryPoints: [s],
-    minify: !0,
-    treeShaking: !0,
-    bundle: !0,
-    outfile: i,
-    format: w,
-    target: ["es2022"],
-    keepNames: !0,
-    external: f
-  });
-  const y = Date.now();
-  return await import(`${i}?t=${y}`);
-}, B = async (t) => {
-  const s = E(t), o = n(s, "salty.config.js"), { config: e } = await import(o);
-  return e;
-}, dt = async (t) => {
-  try {
-    const s = [], o = [], e = E(t), i = n(e, "index.css");
-    (() => {
-      W(e) && U("rm -rf " + e), v(e), v(n(e, "css")), v(n(e, "types"));
-    })(), await it(t);
-    const f = await B(t);
-    async function y(r, u) {
-      const S = ["node_modules", "saltygen"], F = X(r);
-      if (F.isDirectory()) {
-        const b = Y(r);
-        if (S.some((a) => r.includes(a))) return;
-        await Promise.all(b.map((a) => y(n(r, a), n(u, a))));
-      } else if (F.isFile() && O(r)) {
-        const D = await R(t, r, e), a = [];
-        Object.entries(D).forEach(([C, m]) => {
-          if (m.isKeyframes && m.css) {
-            const I = `${m.animationName}.css`, A = `css/${I}`, L = n(e, A);
-            s.push(I), j(L, m.css);
-            return;
-          }
-          if (!m.generator) return;
-          const h = m.generator._withBuildContext({
-            name: C,
-            config: f
-          }), P = `${h.hash}-${h.priority}.css`;
-          o[h.priority] || (o[h.priority] = []), o[h.priority].push(P), a.push(P);
-          const T = `css/${P}`, q = n(e, T);
-          j(q, h.css);
-        });
-        const l = a.map((C) => `@import url('./${C}');`).join(`
-`), g = J(r, 6), p = n(e, `css/${g}.css`);
-        j(p, l);
-      }
-    }
-    await y(t, e);
-    const c = s.map((r) => `@import url('./css/${r}');`).join(`
-`);
-    let d = `@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
-
-${["variables.css", "global.css", "templates.css"].filter((r) => {
-      try {
-        return N(n(e, "css", r), "utf8").length > 0;
-      } catch {
-        return !1;
-      }
-    }).map((r) => `@import url('./css/${r}');`).join(`
-`)}
-${c}`;
-    if (f.importStrategy !== "component") {
-      const r = o.flat().map((u) => `@import url('./css/${u}');`).join(`
-`);
-      d += r;
-    }
-    j(i, d);
-  } catch (s) {
-    console.error(s);
-  }
-}, mt = async (t, s) => {
-  try {
-    const o = [], e = n(t, "./saltygen"), i = n(e, "index.css");
-    if (O(s)) {
-      const f = await B(t), y = await R(t, s, e);
-      Object.entries(y).forEach(([d, r]) => {
-        if (!r.generator) return;
-        const u = r.generator._withBuildContext({
-          name: d,
-          config: f
-        }), S = `${u.hash}-${u.priority}.css`, F = `css/${S}`, b = n(e, F);
-        o.push(S), j(b, u.css);
-      });
-      const c = N(i, "utf8").split(`
-`), x = o.map((d) => `@import url('../saltygen/css/${d}');`), k = [.../* @__PURE__ */ new Set([...c, ...x])].join(`
-`);
-      j(i, k);
-    }
-  } catch (o) {
-    console.error(o);
-  }
-}, ht = async (t, s) => {
-  try {
-    const o = n(t, "./saltygen");
-    if (O(s)) {
-      const i = N(s, "utf8");
-      i.replace(/^(?!export\s)const\s.*/gm, ($) => `export ${$}`) !== i && await Q(s, i);
-      const f = await B(t), y = await R(t, s, o);
-      let c = i;
-      Object.entries(y).forEach(([$, k]) => {
-        var P;
-        if (k.isKeyframes || !k.generator) return;
-        const d = k.generator._withBuildContext({
-          name: $,
-          config: f
-        }), r = new RegExp(`\\s${$}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(i);
-        if (!r) return console.error("Could not find the original declaration");
-        const u = (P = r.at(1)) == null ? void 0 : P.trim(), S = new RegExp(`\\s${$}[=\\s]+styled\\(`, "g").exec(c);
-        if (!S) return console.error("Could not find the original declaration");
-        const { index: F } = S;
-        let b = !1;
-        const D = setTimeout(() => b = !0, 5e3);
-        let a = 0, l = !1, g = 0;
-        for (; !l && !b; ) {
-          const T = c[F + a];
-          T === "(" && g++, T === ")" && g--, g === 0 && T === ")" && (l = !0), a > c.length && (b = !0), a++;
-        }
-        if (!b) clearTimeout(D);
-        else throw new Error("Failed to find the end of the styled call and timed out");
-        const p = F + a, C = c.slice(F, p), m = c, h = ` ${$} = styled(${u}, "${d.classNames}", "${d._callerName}", ${JSON.stringify(d.props)});`;
-        c = c.replace(C, h), m === c && console.error("Minimize file failed to change content", { name: $, tagName: u });
-      });
-      const x = J(s, 6);
-      return f.importStrategy === "component" && (c = `import '../../saltygen/css/${x}.css';
-${c}`), c = c.replace("{ styled }", "{ styledClient as styled }"), c = c.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), c;
-    }
-  } catch (o) {
-    console.error("Error in minimizeFile:", o);
-  }
-};
+import "esbuild";
+import "child_process";
+import "../dash-case-DMQMcCO6.js";
+import "path";
+import "fs";
+import "fs/promises";
+import "../parse-templates-DUUSaubj.js";
+import { d as p, c as n, g, e as F, i as y, m as x, s as S, b as c } from "../index-BGaLvshf.js";
 export {
-  R as compileSaltyFile,
-  it as generateConfigStyles,
-  dt as generateCss,
-  mt as generateFile,
-  O as isSaltyFile,
-  ht as minimizeFile,
-  ct as saltyFileExtensions,
-  rt as saltyFileRegExp
+  p as compileSaltyFile,
+  n as generateConfigStyles,
+  g as generateCss,
+  F as generateFile,
+  y as isSaltyFile,
+  x as minimizeFile,
+  S as saltyFileExtensions,
+  c as saltyFileRegExp
 };

package/generator/index.cjs

@@ -1 +1 @@
-"use strict";var m=Object.defineProperty;var l=(a,t,s)=>t in a?m(a,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):a[t]=s;var c=(a,t,s)=>l(a,typeof t!="symbol"?t+"":t,s);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../dash-case-DKzpenwY.cjs"),p=require("../parse-templates-DVK3iZIl.cjs");class g{constructor(t,s){c(this,"_callerName");c(this,"_context");this.tagName=t,this.params=s}get hash(){return u.toHash(this.params.base||this.params)}get priority(){var t;return typeof this.tagName=="function"||typeof this.tagName=="object"?(((t=this.tagName.generator)==null?void 0:t.priority)||0)+1:0}get classNames(){const t=[this.hash],{className:s}=this.params;return s&&t.push(s),t.join(" ")}get cssClassName(){return this.hash}get cssDisplayNameVar(){return`--${this.hash}-display-name: ${this._callerName};`}get templateKeys(){var t;return(t=this._context)!=null&&t.config.templates?p.getTemplateKeys(this._context.config.templates):[]}get css(){var e;const{base:t={},variants:s={},compoundVariants:r=[]}=this.params,i={...t,variants:s,compoundVariants:r};return p.parseStyles(i,`.${this.cssClassName}`,this.priority,(e=this._context)==null?void 0:e.config)}get props(){const{element:t}=this.params,s=this.params.variants?Object.keys(this.params.variants).map(e=>{var n;const o=(n=this.params.defaultVariants)==null?void 0:n[e];return o!==void 0?`${e}=${String(o)}`:e}):void 0,r=new Set([]),i=/\{props\.([\w\d]+)\}/gi.exec(JSON.stringify(this.params.base));return i&&i.forEach((e,o,n)=>{const h=n.at(1);h&&r.add(h)}),{element:t,variantKeys:s,propValueKeys:[...r]}}_withBuildContext(t){this._context=t;const{name:s,config:r}=t;return this._callerName=s,this}}exports.StyleComponentGenerator=g;
+"use strict";var m=Object.defineProperty;var l=(a,t,s)=>t in a?m(a,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):a[t]=s;var o=(a,t,s)=>l(a,typeof t!="symbol"?t+"":t,s);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../dash-case-DKzpenwY.cjs"),p=require("../parse-templates-DVK3iZIl.cjs");class g{constructor(t,s){o(this,"_isProd");o(this,"_callerName");o(this,"_context");this.tagName=t,this.params=s}get hash(){return u.toHash(this.params.base||this.params)}get priority(){var t;return typeof this.tagName=="function"||typeof this.tagName=="object"?(((t=this.tagName.generator)==null?void 0:t.priority)||0)+1:0}get classNames(){const t=[this.hash],{className:s}=this.params;return s&&t.push(s),t.join(" ")}get cssClassName(){return this.hash}get cssDisplayNameVar(){return`--${this.hash}-display-name: ${this._callerName};`}get templateKeys(){var t;return(t=this._context)!=null&&t.config.templates?p.getTemplateKeys(this._context.config.templates):[]}get css(){var e;const{base:t={},variants:s={},compoundVariants:i=[]}=this.params,r={...t,variants:s,compoundVariants:i};return p.parseStyles(r,`.${this.cssClassName}`,this.priority,(e=this._context)==null?void 0:e.config)}get props(){const{element:t}=this.params,s=this.params.variants?Object.keys(this.params.variants).map(e=>{var n;const c=(n=this.params.defaultVariants)==null?void 0:n[e];return c!==void 0?`${e}=${String(c)}`:e}):void 0,i=new Set([]),r=/\{props\.([\w\d]+)\}/gi.exec(JSON.stringify(this.params.base));return r&&r.forEach((e,c,n)=>{const h=n.at(1);h&&i.add(h)}),{element:t,variantKeys:s,propValueKeys:[...i],attr:{"data-component-name":this._isProd?void 0:this._callerName}}}_withBuildContext(t){this._context=t;const{name:s,config:i,prod:r}=t;return this._isProd=r,this._callerName=s,this}}exports.StyleComponentGenerator=g;

package/generator/index.js

@@ -1,12 +1,13 @@
-var h = Object.defineProperty;
-var m = (e, t, s) => t in e ? h(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s;
-var c = (e, t, s) => m(e, typeof t != "symbol" ? t + "" : t, s);
+var p = Object.defineProperty;
+var m = (e, t, s) => t in e ? p(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s;
+var n = (e, t, s) => m(e, typeof t != "symbol" ? t + "" : t, s);
 import { t as l } from "../dash-case-DMQMcCO6.js";
 import { g, p as u } from "../parse-templates-DUUSaubj.js";
-class d {
+class N {
   constructor(t, s) {
-    c(this, "_callerName");
-    c(this, "_context");
+    n(this, "_isProd");
+    n(this, "_callerName");
+    n(this, "_context");
     this.tagName = t, this.params = s;
   }
   get hash() {
@@ -32,30 +33,33 @@ class d {
   }
   get css() {
     var a;
-    const { base: t = {}, variants: s = {}, compoundVariants: r = [] } = this.params, i = { ...t, variants: s, compoundVariants: r };
-    return u(i, `.${this.cssClassName}`, this.priority, (a = this._context) == null ? void 0 : a.config);
+    const { base: t = {}, variants: s = {}, compoundVariants: i = [] } = this.params, r = { ...t, variants: s, compoundVariants: i };
+    return u(r, `.${this.cssClassName}`, this.priority, (a = this._context) == null ? void 0 : a.config);
   }
   get props() {
     const { element: t } = this.params, s = this.params.variants ? Object.keys(this.params.variants).map((a) => {
-      var n;
-      const o = (n = this.params.defaultVariants) == null ? void 0 : n[a];
-      return o !== void 0 ? `${a}=${String(o)}` : a;
-    }) : void 0, r = /* @__PURE__ */ new Set([]), i = /\{props\.([\w\d]+)\}/gi.exec(JSON.stringify(this.params.base));
-    return i && i.forEach((a, o, n) => {
-      const p = n.at(1);
-      p && r.add(p);
+      var o;
+      const c = (o = this.params.defaultVariants) == null ? void 0 : o[a];
+      return c !== void 0 ? `${a}=${String(c)}` : a;
+    }) : void 0, i = /* @__PURE__ */ new Set([]), r = /\{props\.([\w\d]+)\}/gi.exec(JSON.stringify(this.params.base));
+    return r && r.forEach((a, c, o) => {
+      const h = o.at(1);
+      h && i.add(h);
     }), {
       element: t,
       variantKeys: s,
-      propValueKeys: [...r]
+      propValueKeys: [...i],
+      attr: {
+        "data-component-name": this._isProd ? void 0 : this._callerName
+      }
     };
   }
   _withBuildContext(t) {
     this._context = t;
-    const { name: s, config: r } = t;
-    return this._callerName = s, this;
+    const { name: s, config: i, prod: r } = t;
+    return this._isProd = r, this._callerName = s, this;
   }
 }
 export {
-  d as StyleComponentGenerator
+  N as StyleComponentGenerator
 };

package/generator/style-generator.d.ts

@@ -3,10 +3,14 @@ export interface GeneratorProps {
     element?: string;
     variantKeys?: string[];
     propValueKeys?: string[];
+    attr: {
+        [key: string]: any;
+    };
 }
 export declare class StyleComponentGenerator {
     tagName: Tag<any>;
     params: StyledParams;
+    _isProd: boolean | undefined;
     _callerName: string | undefined;
     _context: {
         name: string;
@@ -24,5 +28,6 @@ export declare class StyleComponentGenerator {
     _withBuildContext(context: {
         name: string;
         config: any;
+        prod: boolean;
     }): this;
 }

package/index-BGaLvshf.js

@@ -0,0 +1,232 @@
+import * as H from "esbuild";
+import { execSync as Q } from "child_process";
+import { t as B, d as W } from "./dash-case-DMQMcCO6.js";
+import { join as o } from "path";
+import { existsSync as K, writeFileSync as w, mkdirSync as V, statSync as tt, readdirSync as st, readFileSync as v } from "fs";
+import { readFile as et, writeFile as nt } from "fs/promises";
+import { p as ot, a as rt, b as ct } from "./parse-templates-DUUSaubj.js";
+import { createLogger as at, format as J, transports as it } from "winston";
+const L = (t) => {
+  if (!t || t === "/") throw new Error("Could not find package.json file");
+  const s = o(t, "package.json");
+  return K(s) ? s : L(o(t, ".."));
+}, lt = async (t) => {
+  const s = L(t);
+  return await et(s, "utf-8").then(JSON.parse).catch(() => {
+  });
+}, pt = async (t) => {
+  const s = await lt(t);
+  if (s)
+    return s.type;
+};
+let M;
+const q = async (t) => {
+  if (M) return M;
+  const s = await pt(t);
+  return s === "module" ? M = "esm" : (s === "commonjs" || import.meta.url.endsWith(".cjs")) && (M = "cjs"), M || "esm";
+}, R = at({
+  level: "debug",
+  format: J.combine(J.colorize(), J.cli()),
+  transports: [new it.Console({})]
+}), Ct = (t) => {
+  R.error(t);
+}, O = {
+  externalModules: []
+}, A = (t) => {
+  if (O.externalModules.length > 0) return O.externalModules;
+  const s = o(t, "salty.config.ts"), e = v(s, "utf8").match(/externalModules:\s?\[(.*)\]/);
+  if (!e) return [];
+  const n = e[1].split(",").map((l) => l.replace(/['"`]/g, "").trim());
+  return O.externalModules = n, n;
+}, N = (t) => o(t, "./saltygen"), ft = ["salty", "css", "styles", "styled"], ut = (t = []) => new RegExp(`\\.(${[...ft, ...t].join("|")})\\.`), I = (t, s = []) => ut(s).test(t), gt = async (t) => {
+  const s = N(t), i = o(t, "salty.config.ts"), e = o(s, "salty.config.js"), n = await q(t), l = A(t);
+  await H.build({
+    entryPoints: [i],
+    minify: !0,
+    treeShaking: !0,
+    bundle: !0,
+    outfile: e,
+    format: n,
+    external: l
+  });
+  const S = Date.now(), { config: f } = await import(`${e}?t=${S}`);
+  return f;
+}, dt = async (t) => {
+  const s = await gt(t), i = /* @__PURE__ */ new Set(), e = (u, a = []) => u ? Object.entries(u).flatMap(([m, p]) => {
+    if (!p) return;
+    if (typeof p == "object") return e(p, [...a, m]);
+    const P = [...a, m].join(".");
+    i.add(`"${P}"`);
+    const x = [...a.map(W), W(m)].join("-"), { result: y } = ct(p);
+    return `--${x}: ${y};`;
+  }) : [], n = (u) => u ? Object.entries(u).flatMap(([a, m]) => {
+    const p = e(m);
+    return a === "base" ? p.join("") : `${a} { ${p.join("")} }`;
+  }) : [], l = (u) => u ? Object.entries(u).flatMap(([a, m]) => Object.entries(m).flatMap(([p, P]) => {
+    const x = e(P, [a]), y = `.${a}-${p}, [data-${a}="${p}"]`, b = x.join("");
+    return `${y} { ${b} }`;
+  })) : [], S = e(s.variables), f = n(s.responsiveVariables), C = l(s.conditionalVariables), r = N(t), T = o(r, "css/variables.css"), g = `:root { ${S.join("")} ${f.join("")} } ${C.join("")}`;
+  w(T, g);
+  const h = o(r, "types/css-tokens.d.ts"), c = `type VariableTokens = ${[...i].join("|") || '""'}; type PropertyValueToken = \`{\${VariableTokens}}\``;
+  w(h, c);
+  const d = o(r, "css/global.css"), k = ot(s.global, "");
+  w(d, k);
+  const $ = o(r, "css/templates.css"), j = rt(s.templates);
+  w($, j);
+}, _ = async (t, s, i) => {
+  const e = B(s), n = o(i, "js", e + ".js"), l = await q(t), S = A(t);
+  await H.build({
+    entryPoints: [s],
+    minify: !0,
+    treeShaking: !0,
+    bundle: !0,
+    outfile: n,
+    format: l,
+    target: ["es2022"],
+    keepNames: !0,
+    external: S
+  });
+  const f = Date.now();
+  return await import(`${n}?t=${f}`);
+}, z = async (t) => {
+  const s = N(t), i = o(s, "salty.config.js"), { config: e } = await import(i);
+  return e;
+}, U = () => {
+  try {
+    return process.env.NODE_ENV === "production";
+  } catch {
+    return !1;
+  }
+}, Ft = async (t, s = U()) => {
+  try {
+    s ? R.info("Generating CSS in production mode! 🔥") : R.info("Generating CSS in development mode! 🚀");
+    const i = [], e = [], n = N(t), l = o(n, "index.css");
+    (() => {
+      K(n) && Q("rm -rf " + n), V(n), V(o(n, "css")), V(o(n, "types"));
+    })(), await dt(t);
+    const f = await z(t);
+    async function C(c, d) {
+      const k = ["node_modules", "saltygen"], $ = tt(c);
+      if ($.isDirectory()) {
+        const j = st(c);
+        if (k.some((a) => c.includes(a))) return;
+        await Promise.all(j.map((a) => C(o(c, a), o(d, a))));
+      } else if ($.isFile() && I(c)) {
+        const u = await _(t, c, n), a = [];
+        Object.entries(u).forEach(([x, y]) => {
+          if (y.isKeyframes && y.css) {
+            const G = `${y.animationName}.css`, Y = `css/${G}`, Z = o(n, Y);
+            i.push(G), w(Z, y.css);
+            return;
+          }
+          if (!y.generator) return;
+          const b = y.generator._withBuildContext({
+            name: x,
+            config: f,
+            prod: s
+          }), D = `${b.hash}-${b.priority}.css`;
+          e[b.priority] || (e[b.priority] = []), e[b.priority].push(D), a.push(D);
+          const E = `css/${D}`, X = o(n, E);
+          w(X, b.css);
+        });
+        const m = a.map((x) => `@import url('./${x}');`).join(`
+`), p = B(c, 6), P = o(n, `css/${p}.css`);
+        w(P, m);
+      }
+    }
+    await C(t, n);
+    const r = i.map((c) => `@import url('./css/${c}');`).join(`
+`);
+    let F = `@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
+
+${["variables.css", "global.css", "templates.css"].filter((c) => {
+      try {
+        return v(o(n, "css", c), "utf8").length > 0;
+      } catch {
+        return !1;
+      }
+    }).map((c) => `@import url('./css/${c}');`).join(`
+`)}
+${r}`;
+    if (f.importStrategy !== "component") {
+      const c = e.flat().map((d) => `@import url('./css/${d}');`).join(`
+`);
+      F += c;
+    }
+    w(l, F);
+  } catch (i) {
+    console.error(i);
+  }
+}, jt = async (t, s) => {
+  try {
+    const i = [], e = o(t, "./saltygen"), n = o(e, "index.css");
+    if (I(s)) {
+      const S = await z(t), f = await _(t, s, e);
+      Object.entries(f).forEach(([h, F]) => {
+        if (!F.generator) return;
+        const c = F.generator._withBuildContext({
+          name: h,
+          config: S
+        }), d = `${c.hash}-${c.priority}.css`, k = `css/${d}`, $ = o(e, k);
+        i.push(d), w($, c.css);
+      });
+      const C = v(n, "utf8").split(`
+`), r = i.map((h) => `@import url('../saltygen/css/${h}');`), g = [.../* @__PURE__ */ new Set([...C, ...r])].join(`
+`);
+      w(n, g);
+    }
+  } catch (i) {
+    console.error(i);
+  }
+}, xt = async (t, s, i = U()) => {
+  try {
+    const e = o(t, "./saltygen");
+    if (I(s)) {
+      const l = v(s, "utf8");
+      l.replace(/^(?!export\s)const\s.*/gm, (g) => `export ${g}`) !== l && await nt(s, l);
+      const f = await z(t), C = await _(t, s, e);
+      let r = l;
+      Object.entries(C).forEach(([g, h]) => {
+        var D;
+        if (h.isKeyframes || !h.generator) return;
+        const F = h.generator._withBuildContext({
+          name: g,
+          config: f,
+          prod: i
+        }), c = new RegExp(`\\s${g}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(l);
+        if (!c) return console.error("Could not find the original declaration");
+        const d = (D = c.at(1)) == null ? void 0 : D.trim(), k = new RegExp(`\\s${g}[=\\s]+styled\\(`, "g").exec(r);
+        if (!k) return console.error("Could not find the original declaration");
+        const { index: $ } = k;
+        let j = !1;
+        const u = setTimeout(() => j = !0, 5e3);
+        let a = 0, m = !1, p = 0;
+        for (; !m && !j; ) {
+          const E = r[$ + a];
+          E === "(" && p++, E === ")" && p--, p === 0 && E === ")" && (m = !0), a > r.length && (j = !0), a++;
+        }
+        if (!j) clearTimeout(u);
+        else throw new Error("Failed to find the end of the styled call and timed out");
+        const P = $ + a, x = r.slice($, P), y = r, b = ` ${g} = styled(${d}, "${F.classNames}", ${JSON.stringify(F.props)});`;
+        r = r.replace(x, b), y === r && console.error("Minimize file failed to change content", { name: g, tagName: d });
+      });
+      const T = B(s, 6);
+      return f.importStrategy === "component" && (r = `import '../../saltygen/css/${T}.css';
+${r}`), r = r.replace("{ styled }", "{ styledClient as styled }"), r = r.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), r;
+    }
+  } catch (e) {
+    console.error("Error in minimizeFile:", e);
+  }
+};
+export {
+  Ct as a,
+  ut as b,
+  dt as c,
+  _ as d,
+  jt as e,
+  Ft as g,
+  I as i,
+  R as l,
+  xt as m,
+  ft as s
+};

package/index-BKoD9apd.cjs

@@ -0,0 +1,11 @@
+"use strict";const te=require("esbuild"),se=require("child_process"),N=require("./dash-case-DKzpenwY.cjs"),i=require("path"),l=require("fs"),H=require("fs/promises"),J=require("./parse-templates-DVK3iZIl.cjs"),v=require("winston");var q=typeof document<"u"?document.currentScript:null;function ne(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,s.get?s:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const U=ne(te),G=e=>{if(!e||e==="/")throw new Error("Could not find package.json file");const t=i.join(e,"package.json");return l.existsSync(t)?t:G(i.join(e,".."))},oe=async e=>{const t=G(e);return await H.readFile(t,"utf-8").then(JSON.parse).catch(()=>{})},ie=async e=>{const t=await oe(e);if(t)return t.type};let T;const L=async e=>{if(T)return T;const t=await ie(e);return t==="module"?T="esm":(t==="commonjs"||(typeof document>"u"?require("url").pathToFileURL(__filename).href:q&&q.tagName.toUpperCase()==="SCRIPT"&&q.src||new URL("index-BKoD9apd.cjs",document.baseURI).href).endsWith(".cjs"))&&(T="cjs"),T||"esm"},O=v.createLogger({level:"debug",format:v.format.combine(v.format.colorize(),v.format.cli()),transports:[new v.transports.Console({})]}),re=e=>{O.error(e)},I={externalModules:[]},W=e=>{if(I.externalModules.length>0)return I.externalModules;const t=i.join(e,"salty.config.ts"),s=l.readFileSync(t,"utf8").match(/externalModules:\s?\[(.*)\]/);if(!s)return[];const o=s[1].split(",").map(u=>u.replace(/['"`]/g,"").trim());return I.externalModules=o,o},V=e=>i.join(e,"./saltygen"),K=["salty","css","styles","styled"],A=(e=[])=>new RegExp(`\\.(${[...K,...e].join("|")})\\.`),R=(e,t=[])=>A(t).test(e),ce=async e=>{const t=V(e),n=i.join(e,"salty.config.ts"),s=i.join(t,"salty.config.js"),o=await L(e),u=W(e);await U.build({entryPoints:[n],minify:!0,treeShaking:!0,bundle:!0,outfile:s,format:o,external:u});const b=Date.now(),{config:p}=await import(`${s}?t=${b}`);return p},X=async e=>{const t=await ce(e),n=new Set,s=(g,a=[])=>g?Object.entries(g).flatMap(([m,f])=>{if(!f)return;if(typeof f=="object")return s(f,[...a,m]);const P=[...a,m].join(".");n.add(`"${P}"`);const x=[...a.map(N.dashCase),N.dashCase(m)].join("-"),{result:h}=J.parseValueTokens(f);return`--${x}: ${h};`}):[],o=g=>g?Object.entries(g).flatMap(([a,m])=>{const f=s(m);return a==="base"?f.join(""):`${a} { ${f.join("")} }`}):[],u=g=>g?Object.entries(g).flatMap(([a,m])=>Object.entries(m).flatMap(([f,P])=>{const x=s(P,[a]),h=`.${a}-${f}, [data-${a}="${f}"]`,w=x.join("");return`${h} { ${w} }`})):[],b=s(t.variables),p=o(t.responsiveVariables),F=u(t.conditionalVariables),r=V(e),E=i.join(r,"css/variables.css"),d=`:root { ${b.join("")} ${p.join("")} } ${F.join("")}`;l.writeFileSync(E,d);const j=i.join(r,"types/css-tokens.d.ts"),c=`type VariableTokens = ${[...n].join("|")||'""'}; type PropertyValueToken = \`{\${VariableTokens}}\``;l.writeFileSync(j,c);const y=i.join(r,"css/global.css"),k=J.parseStyles(t.global,"");l.writeFileSync(y,k);const S=i.join(r,"css/templates.css"),C=J.parseTemplates(t.templates);l.writeFileSync(S,C)},_=async(e,t,n)=>{const s=N.toHash(t),o=i.join(n,"js",s+".js"),u=await L(e),b=W(e);await U.build({entryPoints:[t],minify:!0,treeShaking:!0,bundle:!0,outfile:o,format:u,target:["es2022"],keepNames:!0,external:b});const p=Date.now();return await import(`${o}?t=${p}`)},z=async e=>{const t=V(e),n=i.join(t,"salty.config.js"),{config:s}=await import(n);return s},Y=()=>{try{return process.env.NODE_ENV==="production"}catch{return!1}},ae=async(e,t=Y())=>{try{t?O.info("Generating CSS in production mode! 🔥"):O.info("Generating CSS in development mode! 🚀");const n=[],s=[],o=V(e),u=i.join(o,"index.css");(()=>{l.existsSync(o)&&se.execSync("rm -rf "+o),l.mkdirSync(o),l.mkdirSync(i.join(o,"css")),l.mkdirSync(i.join(o,"types"))})(),await X(e);const p=await z(e);async function F(c,y){const k=["node_modules","saltygen"],S=l.statSync(c);if(S.isDirectory()){const C=l.readdirSync(c);if(k.some(a=>c.includes(a)))return;await Promise.all(C.map(a=>F(i.join(c,a),i.join(y,a))))}else if(S.isFile()&&R(c)){const g=await _(e,c,o),a=[];Object.entries(g).forEach(([x,h])=>{if(h.isKeyframes&&h.css){const B=`${h.animationName}.css`,Q=`css/${B}`,ee=i.join(o,Q);n.push(B),l.writeFileSync(ee,h.css);return}if(!h.generator)return;const w=h.generator._withBuildContext({name:x,config:p,prod:t}),D=`${w.hash}-${w.priority}.css`;s[w.priority]||(s[w.priority]=[]),s[w.priority].push(D),a.push(D);const M=`css/${D}`,Z=i.join(o,M);l.writeFileSync(Z,w.css)});const m=a.map(x=>`@import url('./${x}');`).join(`
+`),f=N.toHash(c,6),P=i.join(o,`css/${f}.css`);l.writeFileSync(P,m)}}await F(e,o);const r=n.map(c=>`@import url('./css/${c}');`).join(`
+`);let $=`@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
+
+${["variables.css","global.css","templates.css"].filter(c=>{try{return l.readFileSync(i.join(o,"css",c),"utf8").length>0}catch{return!1}}).map(c=>`@import url('./css/${c}');`).join(`
+`)}
+${r}`;if(p.importStrategy!=="component"){const c=s.flat().map(y=>`@import url('./css/${y}');`).join(`
+`);$+=c}l.writeFileSync(u,$)}catch(n){console.error(n)}},le=async(e,t)=>{try{const n=[],s=i.join(e,"./saltygen"),o=i.join(s,"index.css");if(R(t)){const b=await z(e),p=await _(e,t,s);Object.entries(p).forEach(([j,$])=>{if(!$.generator)return;const c=$.generator._withBuildContext({name:j,config:b}),y=`${c.hash}-${c.priority}.css`,k=`css/${y}`,S=i.join(s,k);n.push(y),l.writeFileSync(S,c.css)});const F=l.readFileSync(o,"utf8").split(`
+`),r=n.map(j=>`@import url('../saltygen/css/${j}');`),d=[...new Set([...F,...r])].join(`
+`);l.writeFileSync(o,d)}}catch(n){console.error(n)}},ue=async(e,t,n=Y())=>{try{const s=i.join(e,"./saltygen");if(R(t)){const u=l.readFileSync(t,"utf8");u.replace(/^(?!export\s)const\s.*/gm,d=>`export ${d}`)!==u&&await H.writeFile(t,u);const p=await z(e),F=await _(e,t,s);let r=u;Object.entries(F).forEach(([d,j])=>{var D;if(j.isKeyframes||!j.generator)return;const $=j.generator._withBuildContext({name:d,config:p,prod:n}),c=new RegExp(`\\s${d}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(u);if(!c)return console.error("Could not find the original declaration");const y=(D=c.at(1))==null?void 0:D.trim(),k=new RegExp(`\\s${d}[=\\s]+styled\\(`,"g").exec(r);if(!k)return console.error("Could not find the original declaration");const{index:S}=k;let C=!1;const g=setTimeout(()=>C=!0,5e3);let a=0,m=!1,f=0;for(;!m&&!C;){const M=r[S+a];M==="("&&f++,M===")"&&f--,f===0&&M===")"&&(m=!0),a>r.length&&(C=!0),a++}if(!C)clearTimeout(g);else throw new Error("Failed to find the end of the styled call and timed out");const P=S+a,x=r.slice(S,P),h=r,w=` ${d} = styled(${y}, "${$.classNames}", ${JSON.stringify($.props)});`;r=r.replace(x,w),h===r&&console.error("Minimize file failed to change content",{name:d,tagName:y})});const E=N.toHash(t,6);return p.importStrategy==="component"&&(r=`import '../../saltygen/css/${E}.css';
+${r}`),r=r.replace("{ styled }","{ styledClient as styled }"),r=r.replace("@salty-css/react/styled","@salty-css/react/styled-client"),r}}catch(s){console.error("Error in minimizeFile:",s)}};exports.compileSaltyFile=_;exports.generateConfigStyles=X;exports.generateCss=ae;exports.generateFile=le;exports.isSaltyFile=R;exports.logError=re;exports.logger=O;exports.minimizeFile=ue;exports.saltyFileExtensions=K;exports.saltyFileRegExp=A;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salty-css/core",
-  "version": "0.0.1-alpha.84",
+  "version": "0.0.1-alpha.86",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "typings": "./dist/index.d.ts",