@salty-css/core 0.0.1-alpha.106 → 0.0.1-alpha.108
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/bin/main.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ee=require("commander"),G=require("fs"),s=require("fs/promises"),i=require("path"),te=require("ejs"),t=require("../index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ee=require("commander"),G=require("fs"),s=require("fs/promises"),i=require("path"),te=require("ejs"),t=require("../index-BNP4ADSL.cjs"),ie=require("../pascal-case-iWoaJWwT.cjs"),ne=require("child_process"),se=require("ora");var z=typeof document<"u"?document.currentScript:null;const Q=p=>new Promise((w,j)=>{ne.exec(p,k=>{if(k)return j(k);w()})}),N=async(...p)=>{const w=p.map(b=>b.replace("-D","").split("@").slice(0,-1).join("@").trim()).join(", "),j=se(`Installing packages: ${w}`).start(),k=p.join(" ");await Q(`npm install ${k}`),j.succeed(`Installed packages: ${w}`)},oe=()=>G.existsSync(i.join(process.cwd(),"node_modules",".bin","prettier"));async function h(p){try{if(!oe())return;await Q(`./node_modules/.bin/prettier --write "${p}"`),t.logger.info(`Formatted ${p} with Prettier`)}catch(w){t.logger.error(`Error formatting ${p} with Prettier:`,w)}}async function ae(){const p=new ee.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(n,l)=>{const{default:d}=await w[n],u=te.render(d,l);return{fileName:n,content:u}},k=async()=>{const n=i.join(process.cwd(),".saltyrc.json");return await s.readFile(n,"utf-8").then(JSON.parse).catch(()=>({}))},b=i.join(process.cwd(),"package.json"),D=async(n=b)=>{const l=await s.readFile(n,"utf-8").then(JSON.parse).catch(()=>{});if(!l)throw"Could not read package.json file!";return l},X=async(n,l=b)=>{typeof n=="object"&&(n=JSON.stringify(n,null,2)),await s.writeFile(l,n)},B=async()=>{const n=new URL("../package.json",typeof document>"u"?require("url").pathToFileURL(__filename).href:z&&z.tagName.toUpperCase()==="SCRIPT"&&z.src||new URL("bin/main.cjs",document.baseURI).href);return D(n)},V=await(async()=>(await k()).defaultProject)(),$=await B(),q={core:`@salty-css/core@${$.version}`,react:`@salty-css/react@${$.version}`,eslintConfigCore:`@salty-css/eslint-config-core@${$.version}`,vite:`@salty-css/vite@${$.version}`,next:`@salty-css/next@${$.version}`},U=n=>{const l=n==="."?"":n,d=process.cwd();return i.join(d,l)};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(n="."){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:d=n,cssFile:u,skipInstall:y}=this.opts();if(!d)return t.logError("Project directory must be provided. Add it as the first argument after init command or use the --dir option.");y||await N(q.core,q.react);const f=process.cwd(),r=U(d),E=await Promise.all([j("salty.config.ts"),j("saltygen/index.css")]);await s.mkdir(r,{recursive:!0});const m=E.map(async({fileName:e,content:g})=>{const a=i.join(r,e);if(await s.readFile(a,"utf-8").catch(()=>{})!==void 0){t.logger.debug("File already exists: "+a);return}const P=e.split("/").slice(0,-1).join("/");P&&await s.mkdir(i.join(r,P),{recursive:!0}),t.logger.info("Creating file: "+a),await s.writeFile(a,g),await h(a)});await Promise.all(m);const x=i.relative(f,r)||".",S=i.join(f,".saltyrc.json"),c=await s.readFile(S,"utf-8").catch(()=>{});if(c===void 0){t.logger.info("Creating file: "+S);const g=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:x,projects:[{dir:x,framework:"react"}]},null,2);await s.writeFile(S,g),await h(S)}else{const e=JSON.parse(c),g=(e==null?void 0:e.projects)||[];if(g.findIndex(o=>o.dir===x)===-1){g.push({dir:x,framework:"react"}),e.projects=[...g];const o=JSON.stringify(e,null,2);o!==c&&(t.logger.info("Edit file: "+S),await s.writeFile(S,o),await h(S))}}const C=i.join(f,".gitignore"),L=await s.readFile(C,"utf-8").catch(()=>{});L!==void 0&&(L.includes("saltygen")||(t.logger.info("Edit file: "+C),await s.writeFile(C,L+`
|
|
2
2
|
|
|
3
3
|
# Salty-CSS
|
|
4
4
|
saltygen
|
|
@@ -8,4 +8,4 @@ ${e}`;e.includes("typescript-eslint")?o.includes(".config(")?o=o.replace(".confi
|
|
|
8
8
|
`,o=W.replace(/(plugins: \[)/,`$1
|
|
9
9
|
saltyPlugin(__dirname),`);y||await N(`-D ${q.vite}`),t.logger.info("Adding Salty-CSS plugin to Vite config..."),await s.writeFile(A,g+o),await h(A)}const R=["next.config.js","next.config.cjs","next.config.ts","next.config.mjs"].map(e=>i.join(r,e)).find(e=>G.existsSync(e));if(R){let e=await s.readFile(R,"utf-8").catch(()=>{});if(e!==void 0&&!e.includes("withSaltyCss")){let a=!1;/\splugins([^=]*)=[^[]\[/.test(e)&&!a&&(e=e.replace(/\splugins([^=]*)=[^[]\[/,(O,I)=>` plugins${I}= [withSaltyCss,`),a=!0);const P=e.includes("module.exports"),T=P?`const { withSaltyCss } = require('@salty-css/next');
|
|
10
10
|
`:`import { withSaltyCss } from '@salty-css/next';
|
|
11
|
-
`;P&&!a?(e=e.replace(/module.exports = ([^;]+)/,(O,I)=>`module.exports = withSaltyCss(${I})`),a=!0):a||(e=e.replace(/export default ([^;]+)/,(O,I)=>`export default withSaltyCss(${I})`)),y||await N(`-D ${q.next}`),t.logger.info("Adding Salty-CSS plugin to Next.js config..."),await s.writeFile(R,T+e),await h(R)}}const Z=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: "+b),e.scripts.prepare=e.scripts.prepare+" && npx salty-css build"):(t.logger.info("Edit file: "+b),e.scripts.prepare="npx salty-css build"),e));await X(Z),t.logger.info("Running the build to generate initial CSS..."),await t.generateCss(r),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 ⭐")}),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(n=V){t.logger.info("Building the Salty-CSS project...");const{dir:l=n}=this.opts();if(!l)return t.logError("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");const d=U(l);await t.generateCss(d)}),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("-
|
|
11
|
+
`;P&&!a?(e=e.replace(/module.exports = ([^;]+)/,(O,I)=>`module.exports = withSaltyCss(${I})`),a=!0):a||(e=e.replace(/export default ([^;]+)/,(O,I)=>`export default withSaltyCss(${I})`)),y||await N(`-D ${q.next}`),t.logger.info("Adding Salty-CSS plugin to Next.js config..."),await s.writeFile(R,T+e),await h(R)}}const Z=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: "+b),e.scripts.prepare=e.scripts.prepare+" && npx salty-css build"):(t.logger.info("Edit file: "+b),e.scripts.prepare="npx salty-css build"),e));await X(Z),t.logger.info("Running the build to generate initial CSS..."),await t.generateCss(r),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 ⭐")}),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(n=V){t.logger.info("Building the Salty-CSS project...");const{dir:l=n}=this.opts();if(!l)return t.logError("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");const d=U(l);await t.generateCss(d)}),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("-r, --reactComponent","Generate a React component as well.").action(async function(n,l=V){const{file:d=n,dir:u=l,tag:y,name:f,className:r,reactComponent:E=!1}=this.opts();if(!d)return t.logError("File to generate must be provided. Add it as the first argument after generate command or use the --file option.");if(!u)return t.logError("Project directory must be provided. Add it as the second argument after generate command or use the --dir option.");const m=U(u),x=d.split("/").slice(0,-1).join("/");x&&await s.mkdir(i.join(m,x),{recursive:!0});const S=i.join(m,d),c=i.parse(S);c.ext||(c.ext=".ts"),c.name.endsWith(".css")||(c.name=c.name+".css"),c.base=c.name+c.ext;const C=i.format(c);if(await s.readFile(C,"utf-8").catch(()=>{})!==void 0){t.logger.error("File already exists:",C);return}let F=ie.pascalCase(f||c.base.replace(/\.css\.\w+$/,""));if(E){const M=F+"Component";F=F+"Wrapper";const _=c.base.replace(/\.css\.\w+$/,""),{content:K}=await j("react/react-vanilla-file.ts",{tag:y,componentName:M,styledComponentName:F,className:r,fileName:_});c.name=_.replace(/\.css$/,""),c.ext=".tsx",c.base=c.name+c.ext;const J=i.format(c);t.logger.info("Generating a new file: "+J),await s.writeFile(J,K),await h(J)}const{content:H}=await j("react/react-styled-file.ts",{tag:y,name:F,className:r});t.logger.info("Generating a new file: "+C),await s.writeFile(C,H),await h(C)}),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(n="latest"){const{legacyPeerDeps:l,version:d=n}=this.opts(),u=i.join(process.cwd(),"package.json"),y=await D(u).catch(m=>t.logError(m));if(!y)return;const f={...y.dependencies,...y.devDependencies},r=Object.keys(f).filter(m=>m==="salty-css"||m.startsWith("@salty-css/"));if(!r.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: "+u);const E=r.map(m=>d==="@"?`${m}@${$.version}`:`${m}@${d.replace(/^@/,"")}`);l?(t.logger.warn("Using legacy peer dependencies to update packages."),await N(...E,"--legacy-peer-deps")):await N(...E),t.logger.info("Salty-CSS packages updated successfully!")}),p.option("-v, --version","Show the current version of Salty-CSS.").action(async function(){const n=await B();t.logger.info("CLI is running: "+n.version);const l=i.join(process.cwd(),"package.json"),d=await D(l).catch(f=>t.logError(f));if(!d)return;const u={...d.dependencies,...d.devDependencies},y=Object.keys(u).filter(f=>f==="salty-css"||f.startsWith("@salty-css/"));if(!y.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: "+l);for(const f of y)t.logger.info(`${f}: ${u[f]}`)}),p.parseAsync(process.argv)}exports.main=ae;
|
package/bin/main.js
CHANGED
|
@@ -3,7 +3,7 @@ import { existsSync as K } from "fs";
|
|
|
3
3
|
import { mkdir as V, readFile as m, writeFile as h } from "fs/promises";
|
|
4
4
|
import { join as i, relative as z, parse as ot, format as Z } from "path";
|
|
5
5
|
import { render as rt } from "ejs";
|
|
6
|
-
import { l as e, a as S, g as tt } from "../index-
|
|
6
|
+
import { l as e, a as S, g as tt } from "../index-BJOgd2yZ.js";
|
|
7
7
|
import { p as ct } from "../pascal-case-BQpR5PdN.js";
|
|
8
8
|
import { exec as lt } from "child_process";
|
|
9
9
|
import dt from "ora";
|
|
@@ -191,7 +191,7 @@ ${t}`;
|
|
|
191
191
|
if (!c) return S("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");
|
|
192
192
|
const l = G(c);
|
|
193
193
|
await tt(l);
|
|
194
|
-
}), 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("-
|
|
194
|
+
}), 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("-r, --reactComponent", "Generate a React component as well.").action(async function(s, c = X) {
|
|
195
195
|
const { file: l = s, dir: g = c, tag: u, name: f, className: o, reactComponent: D = !1 } = this.opts();
|
|
196
196
|
if (!l) return S("File to generate must be provided. Add it as the first argument after generate command or use the --file option.");
|
|
197
197
|
if (!g) return S("Project directory must be provided. Add it as the second argument after generate command or use the --dir option.");
|
package/compiler/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"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-C1-wQz7G.cjs");const e=require("../index-
|
|
1
|
+
"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-C1-wQz7G.cjs");const e=require("../index-BNP4ADSL.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.js
CHANGED
|
@@ -5,7 +5,7 @@ import "path";
|
|
|
5
5
|
import "fs";
|
|
6
6
|
import "fs/promises";
|
|
7
7
|
import "../parse-templates-BNINfXOG.js";
|
|
8
|
-
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-
|
|
8
|
+
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-BJOgd2yZ.js";
|
|
9
9
|
export {
|
|
10
10
|
p as compileSaltyFile,
|
|
11
11
|
n as generateConfigStyles,
|
|
@@ -55,22 +55,22 @@ const q = async (t) => {
|
|
|
55
55
|
const e = await mt(t), c = /* @__PURE__ */ new Set(), s = (i, p = []) => i ? Object.entries(i).flatMap(([d, u]) => {
|
|
56
56
|
if (!u) return;
|
|
57
57
|
if (typeof u == "object") return s(u, [...p, d]);
|
|
58
|
-
const
|
|
59
|
-
c.add(`"${
|
|
58
|
+
const x = [...p, d].join(".");
|
|
59
|
+
c.add(`"${x}"`);
|
|
60
60
|
const y = [...p.map(H), H(d)].join("-"), { result: h } = it(u);
|
|
61
61
|
return `--${y}: ${h};`;
|
|
62
62
|
}) : [], n = (i) => i ? Object.entries(i).flatMap(([p, d]) => {
|
|
63
63
|
const u = s(d);
|
|
64
64
|
return p === "base" ? u.join("") : `${p} { ${u.join("")} }`;
|
|
65
|
-
}) : [], l = (i) => i ? Object.entries(i).flatMap(([p, d]) => Object.entries(d).flatMap(([u,
|
|
66
|
-
const y = s(
|
|
65
|
+
}) : [], l = (i) => i ? Object.entries(i).flatMap(([p, d]) => Object.entries(d).flatMap(([u, x]) => {
|
|
66
|
+
const y = s(x, [p]), h = `.${p}-${u}, [data-${p}="${u}"]`, T = y.join("");
|
|
67
67
|
return `${h} { ${T} }`;
|
|
68
68
|
})) : [], b = s(e.variables), f = n(e.responsiveVariables), $ = l(e.conditionalVariables), o = N(t), D = a(o, "css/variables.css"), g = `:root { ${b.join("")} ${f.join("")} } ${$.join("")}`;
|
|
69
69
|
C(D, g);
|
|
70
70
|
const w = a(o, "css/global.css"), S = at(e.global, "");
|
|
71
71
|
C(w, S);
|
|
72
|
-
const r = a(o, "css/templates.css"), m = rt(e.templates),
|
|
73
|
-
|
|
72
|
+
const r = a(o, "css/templates.css"), m = rt(e.templates), F = ct(e.templates);
|
|
73
|
+
C(r, m);
|
|
74
74
|
const j = a(o, "types/css-tokens.d.ts"), P = `
|
|
75
75
|
// Variable types
|
|
76
76
|
type VariableTokens = ${[...c].join("|")};
|
|
@@ -78,7 +78,7 @@ const q = async (t) => {
|
|
|
78
78
|
|
|
79
79
|
// Template types
|
|
80
80
|
type TemplateTokens = {
|
|
81
|
-
${Object.entries(
|
|
81
|
+
${Object.entries(F).map(([i, p]) => `${i}?: ${p}`).join(`
|
|
82
82
|
`)}
|
|
83
83
|
}
|
|
84
84
|
`;
|
|
@@ -127,14 +127,14 @@ const q = async (t) => {
|
|
|
127
127
|
})(), await yt(t);
|
|
128
128
|
const f = await G(t);
|
|
129
129
|
async function $(r, m) {
|
|
130
|
-
const
|
|
130
|
+
const F = ["node_modules", "saltygen"], j = et(r);
|
|
131
131
|
if (j.isDirectory()) {
|
|
132
132
|
const k = st(r);
|
|
133
|
-
if (
|
|
133
|
+
if (F.some((i) => r.includes(i))) return;
|
|
134
134
|
await Promise.all(k.map((i) => $(a(r, i), a(m, i))));
|
|
135
135
|
} else if (j.isFile() && _(r)) {
|
|
136
136
|
const P = await z(t, r, n), i = [];
|
|
137
|
-
Object.entries(P).forEach(([
|
|
137
|
+
Object.entries(P).forEach(([x, y]) => {
|
|
138
138
|
if (y.isKeyframes && y.css) {
|
|
139
139
|
const W = `${y.animationName}.css`, Y = `css/${W}`, Z = a(n, Y);
|
|
140
140
|
c.push(W), C(Z, y.css);
|
|
@@ -142,7 +142,7 @@ const q = async (t) => {
|
|
|
142
142
|
}
|
|
143
143
|
if (!y.generator) return;
|
|
144
144
|
const h = y.generator._withBuildContext({
|
|
145
|
-
name:
|
|
145
|
+
name: x,
|
|
146
146
|
config: f,
|
|
147
147
|
prod: e
|
|
148
148
|
}), T = `${h.hash}-${h.priority}.css`;
|
|
@@ -150,7 +150,7 @@ const q = async (t) => {
|
|
|
150
150
|
const v = `css/${T}`, X = a(n, v);
|
|
151
151
|
C(X, h.css);
|
|
152
152
|
});
|
|
153
|
-
const p = i.map((
|
|
153
|
+
const p = i.map((x) => `@import url('./${x}');`).join(`
|
|
154
154
|
`), d = B(r, 6), u = a(n, `css/${d}.css`);
|
|
155
155
|
C(u, p);
|
|
156
156
|
}
|
|
@@ -188,7 +188,7 @@ ${o}`;
|
|
|
188
188
|
const r = S.generator._withBuildContext({
|
|
189
189
|
name: w,
|
|
190
190
|
config: b
|
|
191
|
-
}), m = `${r.hash}-${r.priority}.css`,
|
|
191
|
+
}), m = `${r.hash}-${r.priority}.css`, F = `css/${m}`, j = a(s, F);
|
|
192
192
|
c.push(m), C(j, r.css);
|
|
193
193
|
});
|
|
194
194
|
const $ = E(n, "utf8").split(`
|
|
@@ -216,9 +216,9 @@ ${o}`;
|
|
|
216
216
|
prod: c
|
|
217
217
|
}), r = new RegExp(`\\s${g}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(l);
|
|
218
218
|
if (!r) return console.error("Could not find the original declaration");
|
|
219
|
-
const m = (T = r.at(1)) == null ? void 0 : T.trim(),
|
|
220
|
-
if (!
|
|
221
|
-
const { index: j } =
|
|
219
|
+
const m = (T = r.at(1)) == null ? void 0 : T.trim(), F = new RegExp(`\\s${g}[=\\s]+styled\\(`, "g").exec(o);
|
|
220
|
+
if (!F) return console.error("Could not find the original declaration");
|
|
221
|
+
const { index: j } = F;
|
|
222
222
|
let k = !1;
|
|
223
223
|
const P = setTimeout(() => k = !0, 5e3);
|
|
224
224
|
let i = 0, p = !1, d = 0;
|
|
@@ -228,8 +228,8 @@ ${o}`;
|
|
|
228
228
|
}
|
|
229
229
|
if (!k) clearTimeout(P);
|
|
230
230
|
else throw new Error("Failed to find the end of the styled call and timed out");
|
|
231
|
-
const u = j + i,
|
|
232
|
-
o = o.replace(
|
|
231
|
+
const u = j + i, x = o.slice(j, u), y = o, h = ` ${g} = styled(${m}, "${S.classNames}", ${JSON.stringify(S.props)});`;
|
|
232
|
+
o = o.replace(x, h), y === o && console.error("Minimize file failed to change content", { name: g, tagName: m });
|
|
233
233
|
});
|
|
234
234
|
const D = B(e, 6);
|
|
235
235
|
return f.importStrategy === "component" && (o = `import '../../saltygen/css/${D}.css';
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
"use strict";const te=require("esbuild"),se=require("child_process"),N=require("./dash-case-DKzpenwY.cjs"),o=require("path"),a=require("fs"),H=require("fs/promises"),O=require("./parse-templates-C1-wQz7G.cjs"),M=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=o.join(e,"package.json");return a.existsSync(t)?t:G(o.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 v;const L=async e=>{if(v)return v;const t=await ie(e);return t==="module"?v="esm":(t==="commonjs"||(typeof document>"u"?require("url").pathToFileURL(__filename).href:q&&q.tagName.toUpperCase()==="SCRIPT"&&q.src||new URL("index-
|
|
1
|
+
"use strict";const te=require("esbuild"),se=require("child_process"),N=require("./dash-case-DKzpenwY.cjs"),o=require("path"),a=require("fs"),H=require("fs/promises"),O=require("./parse-templates-C1-wQz7G.cjs"),M=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=o.join(e,"package.json");return a.existsSync(t)?t:G(o.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 v;const L=async e=>{if(v)return v;const t=await ie(e);return t==="module"?v="esm":(t==="commonjs"||(typeof document>"u"?require("url").pathToFileURL(__filename).href:q&&q.tagName.toUpperCase()==="SCRIPT"&&q.src||new URL("index-BNP4ADSL.cjs",document.baseURI).href).endsWith(".cjs"))&&(v="cjs"),v||"esm"},V=M.createLogger({level:"debug",format:M.format.combine(M.format.colorize(),M.format.cli()),transports:[new M.transports.Console({})]}),re=e=>{V.error(e)},I={externalModules:[]},W=e=>{if(I.externalModules.length>0)return I.externalModules;const t=o.join(e,"salty.config.ts"),s=a.readFileSync(t,"utf8").match(/externalModules:\s?\[(.*)\]/);if(!s)return[];const i=s[1].split(",").map(p=>p.replace(/['"`]/g,"").trim());return I.externalModules=i,i},R=e=>o.join(e,"./saltygen"),K=["salty","css","styles","styled"],A=(e=[])=>new RegExp(`\\.(${[...K,...e].join("|")})\\.`),_=(e,t=[])=>A(t).test(e),ce=async e=>{const t=R(e),n=o.join(e,"salty.config.ts"),s=o.join(t,"salty.config.js"),i=await L(e),p=W(e);await U.build({entryPoints:[n],minify:!0,treeShaking:!0,bundle:!0,outfile:s,format:i,external:p});const S=Date.now(),{config:f}=await import(`${s}?t=${S}`);return f},X=async e=>{const t=await ce(e),n=new Set,s=(l,u=[])=>l?Object.entries(l).flatMap(([g,d])=>{if(!d)return;if(typeof d=="object")return s(d,[...u,g]);const C=[...u,g].join(".");n.add(`"${C}"`);const h=[...u.map(N.dashCase),N.dashCase(g)].join("-"),{result:j}=O.parseValueTokens(d);return`--${h}: ${j};`}):[],i=l=>l?Object.entries(l).flatMap(([u,g])=>{const d=s(g);return u==="base"?d.join(""):`${u} { ${d.join("")} }`}):[],p=l=>l?Object.entries(l).flatMap(([u,g])=>Object.entries(g).flatMap(([d,C])=>{const h=s(C,[u]),j=`.${u}-${d}, [data-${u}="${d}"]`,T=h.join("");return`${j} { ${T} }`})):[],S=s(t.variables),f=i(t.responsiveVariables),b=p(t.conditionalVariables),r=R(e),P=o.join(r,"css/variables.css"),y=`:root { ${S.join("")} ${f.join("")} } ${b.join("")}`;a.writeFileSync(P,y);const w=o.join(r,"css/global.css"),F=O.parseStyles(t.global,"");a.writeFileSync(w,F);const c=o.join(r,"css/templates.css"),m=O.parseTemplates(t.templates),x=O.getTemplateTypes(t.templates);a.writeFileSync(c,m);const $=o.join(r,"types/css-tokens.d.ts"),D=`
|
|
2
2
|
// Variable types
|
|
3
3
|
type VariableTokens = ${[...n].join("|")};
|
|
4
4
|
type PropertyValueToken = \`{\${VariableTokens}}\`;
|
|
5
5
|
|
|
6
6
|
// Template types
|
|
7
7
|
type TemplateTokens = {
|
|
8
|
-
${Object.entries(
|
|
8
|
+
${Object.entries(x).map(([l,u])=>`${l}?: ${u}`).join(`
|
|
9
9
|
`)}
|
|
10
10
|
}
|
|
11
|
-
`;a.writeFileSync($,D)},J=async(e,t,n)=>{const s=N.toHash(t),i=o.join(n,"./temp");a.existsSync(i)||a.mkdirSync(i);const p=o.parse(t);let S=a.readFileSync(t,"utf8");S=S.replace(/styled\([^"'`{,]+,/g,"styled('div',");const f=o.join(n,"js",s+".js"),b=W(e),r=await L(e);await U.build({stdin:{contents:S,sourcefile:p.base,resolveDir:p.dir,loader:"ts"},minify:!1,treeShaking:!0,bundle:!0,outfile:f,format:r,target:["node20"],keepNames:!0,external:b,packages:"external"});const P=Date.now();return await import(`${f}?t=${P}`)},z=async e=>{const t=R(e),n=o.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?V.info("Generating CSS in production mode! 🔥"):V.info("Generating CSS in development mode! 🚀");const n=[],s=[],i=R(e),p=o.join(i,"index.css");(()=>{a.existsSync(i)&&se.execSync("rm -rf "+i),a.mkdirSync(i),a.mkdirSync(o.join(i,"css")),a.mkdirSync(o.join(i,"types"))})(),await X(e);const f=await z(e);async function b(c,m){const
|
|
12
|
-
`),
|
|
11
|
+
`;a.writeFileSync($,D)},J=async(e,t,n)=>{const s=N.toHash(t),i=o.join(n,"./temp");a.existsSync(i)||a.mkdirSync(i);const p=o.parse(t);let S=a.readFileSync(t,"utf8");S=S.replace(/styled\([^"'`{,]+,/g,"styled('div',");const f=o.join(n,"js",s+".js"),b=W(e),r=await L(e);await U.build({stdin:{contents:S,sourcefile:p.base,resolveDir:p.dir,loader:"ts"},minify:!1,treeShaking:!0,bundle:!0,outfile:f,format:r,target:["node20"],keepNames:!0,external:b,packages:"external"});const P=Date.now();return await import(`${f}?t=${P}`)},z=async e=>{const t=R(e),n=o.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?V.info("Generating CSS in production mode! 🔥"):V.info("Generating CSS in development mode! 🚀");const n=[],s=[],i=R(e),p=o.join(i,"index.css");(()=>{a.existsSync(i)&&se.execSync("rm -rf "+i),a.mkdirSync(i),a.mkdirSync(o.join(i,"css")),a.mkdirSync(o.join(i,"types"))})(),await X(e);const f=await z(e);async function b(c,m){const x=["node_modules","saltygen"],$=a.statSync(c);if($.isDirectory()){const k=a.readdirSync(c);if(x.some(l=>c.includes(l)))return;await Promise.all(k.map(l=>b(o.join(c,l),o.join(m,l))))}else if($.isFile()&&_(c)){const D=await J(e,c,i),l=[];Object.entries(D).forEach(([C,h])=>{if(h.isKeyframes&&h.css){const B=`${h.animationName}.css`,Q=`css/${B}`,ee=o.join(i,Q);n.push(B),a.writeFileSync(ee,h.css);return}if(!h.generator)return;const j=h.generator._withBuildContext({name:C,config:f,prod:t}),T=`${j.hash}-${j.priority}.css`;s[j.priority]||(s[j.priority]=[]),s[j.priority].push(T),l.push(T);const E=`css/${T}`,Z=o.join(i,E);a.writeFileSync(Z,j.css)});const u=l.map(C=>`@import url('./${C}');`).join(`
|
|
12
|
+
`),g=N.toHash(c,6),d=o.join(i,`css/${g}.css`);a.writeFileSync(d,u)}}await b(e,i);const r=n.map(c=>`@import url('./css/${c}');`).join(`
|
|
13
13
|
`);let F=`@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
|
14
14
|
|
|
15
15
|
${["variables.css","global.css","templates.css"].filter(c=>{try{return a.readFileSync(o.join(i,"css",c),"utf8").length>0}catch{return!1}}).map(c=>`@import url('./css/${c}');`).join(`
|
|
16
16
|
`)}
|
|
17
17
|
${r}`;if(f.importStrategy!=="component"){const c=s.flat().map(m=>`@import url('./css/${m}');`).join(`
|
|
18
|
-
`);F+=c}a.writeFileSync(p,F)}catch(n){console.error(n)}},le=async(e,t)=>{try{const n=[],s=o.join(e,"./saltygen"),i=o.join(s,"index.css");if(_(t)){const S=await z(e),f=await J(e,t,s);Object.entries(f).forEach(([w,F])=>{if(!F.generator)return;const c=F.generator._withBuildContext({name:w,config:S}),m=`${c.hash}-${c.priority}.css`,
|
|
19
|
-
`),r=n.map(w=>`@import url('../saltygen/css/${w}');`),
|
|
20
|
-
`);a.writeFileSync(i,
|
|
18
|
+
`);F+=c}a.writeFileSync(p,F)}catch(n){console.error(n)}},le=async(e,t)=>{try{const n=[],s=o.join(e,"./saltygen"),i=o.join(s,"index.css");if(_(t)){const S=await z(e),f=await J(e,t,s);Object.entries(f).forEach(([w,F])=>{if(!F.generator)return;const c=F.generator._withBuildContext({name:w,config:S}),m=`${c.hash}-${c.priority}.css`,x=`css/${m}`,$=o.join(s,x);n.push(m),a.writeFileSync($,c.css)});const b=a.readFileSync(i,"utf8").split(`
|
|
19
|
+
`),r=n.map(w=>`@import url('../saltygen/css/${w}');`),y=[...new Set([...b,...r])].join(`
|
|
20
|
+
`);a.writeFileSync(i,y)}}catch(n){console.error(n)}},pe=async(e,t,n=Y())=>{try{const s=o.join(e,"./saltygen");if(_(t)){const p=a.readFileSync(t,"utf8");p.replace(/^(?!export\s)const\s.*/gm,y=>`export ${y}`)!==p&&await H.writeFile(t,p);const f=await z(e),b=await J(e,t,s);let r=p;Object.entries(b).forEach(([y,w])=>{var T;if(w.isKeyframes||!w.generator)return;const F=w.generator._withBuildContext({name:y,config:f,prod:n}),c=new RegExp(`\\s${y}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(p);if(!c)return console.error("Could not find the original declaration");const m=(T=c.at(1))==null?void 0:T.trim(),x=new RegExp(`\\s${y}[=\\s]+styled\\(`,"g").exec(r);if(!x)return console.error("Could not find the original declaration");const{index:$}=x;let k=!1;const D=setTimeout(()=>k=!0,5e3);let l=0,u=!1,g=0;for(;!u&&!k;){const E=r[$+l];E==="("&&g++,E===")"&&g--,g===0&&E===")"&&(u=!0),l>r.length&&(k=!0),l++}if(!k)clearTimeout(D);else throw new Error("Failed to find the end of the styled call and timed out");const d=$+l,C=r.slice($,d),h=r,j=` ${y} = styled(${m}, "${F.classNames}", ${JSON.stringify(F.props)});`;r=r.replace(C,j),h===r&&console.error("Minimize file failed to change content",{name:y,tagName:m})});const P=N.toHash(t,6);return f.importStrategy==="component"&&(r=`import '../../saltygen/css/${P}.css';
|
|
21
21
|
${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=J;exports.generateConfigStyles=X;exports.generateCss=ae;exports.generateFile=le;exports.isSaltyFile=_;exports.logError=re;exports.logger=V;exports.minimizeFile=pe;exports.saltyFileExtensions=K;exports.saltyFileRegExp=A;
|
package/package.json
CHANGED
package/types/index.d.ts
CHANGED
|
@@ -57,7 +57,7 @@ export type ValueProps = {
|
|
|
57
57
|
export type ParentComponentProps<TAG extends Tag<any>> = TAG extends (props: infer P) => ReactNode ? P : object;
|
|
58
58
|
type StylePropertyValue = Record<never, never> & unknown;
|
|
59
59
|
export type CssStyles = {
|
|
60
|
-
[key in OrString]?: CssProperties | StylePropertyValue | PropertyValueToken | CssStyles;
|
|
60
|
+
[key in OrString]?: CssProperties | StylePropertyValue | PropertyValueToken | TemplateTokens | CssStyles;
|
|
61
61
|
};
|
|
62
62
|
export type Styles = CssStyles & Variants;
|
|
63
63
|
export interface GeneratorOptions {
|