@salty-css/core 0.0.1-alpha.53 → 0.0.1-alpha.55
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/README.md +1 -1
- package/bin/main.cjs +5 -5
- package/bin/main.js +58 -57
- package/compiler/index.cjs +9 -9
- package/compiler/index.js +119 -118
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -25,7 +25,7 @@ In the world of frontend dev is there anything saltier than CSS? Salty CSS is bu
|
|
|
25
25
|
- [Core](https://www.npmjs.com/package/@salty-css/react) → `npm install @salty-css/core`
|
|
26
26
|
- [ESLint](https://www.npmjs.com/package/@salty-css/eslint-plugin-core) → `npm install @salty-css/eslint-plugin-core`
|
|
27
27
|
|
|
28
|
-
[View React example](#
|
|
28
|
+
[View React example](#code-examples)
|
|
29
29
|
|
|
30
30
|
### Add Salty CSS to your project with `salty-css` CLI
|
|
31
31
|
|
package/bin/main.cjs
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Q=require("commander"),W=require("fs"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Q=require("commander"),W=require("fs"),s=require("fs/promises"),n=require("path"),X=require("ejs"),Y=require("../compiler/index.cjs"),Z=require("../pascal-case-iWoaJWwT.cjs"),N=require("winston"),ee=require("child_process"),te=require("ora");var R=typeof document<"u"?document.currentScript:null;const t=N.createLogger({level:"debug",format:N.format.combine(N.format.colorize(),N.format.cli()),transports:[new N.transports.Console({})]}),h=a=>{t.error(a)},G=a=>new Promise((m,C)=>{ee.exec(a,P=>{if(P)return C(P);m()})}),b=async(...a)=>{const m=a.map(F=>F.replace("-D","").split("@").slice(0,-1).join("@").trim()).join(", "),C=te(`Installing packages: ${m}`).start(),P=a.join(" ");await G(`npm install ${P}`),C.succeed(`Installed packages: ${m}`)},ne=()=>W.existsSync(n.join(process.cwd(),"node_modules",".bin","prettier"));async function _(a){try{if(!ne())return;await G(`./node_modules/.bin/prettier --write "${a}"`),t.info(`Formatted ${a} with Prettier`)}catch(m){t.error(`Error formatting ${a} with Prettier:`,m)}}async function ie(){const a=new Q.Command;a.name("salty-css").description("Salty-CSS CLI tool to help with annoying configuration tasks.");const m={"salty.config.ts":Promise.resolve().then(()=>require("../salty.config-BupieCfE.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"))},C=async(i,r)=>{const{default:o}=await m[i],u=X.render(o,r);return{fileName:i,content:u}},P=async()=>{const i=n.join(process.cwd(),".saltyrc");return await s.readFile(i,"utf-8").then(JSON.parse).catch(()=>({}))},F=async(i=n.join(process.cwd(),"package.json"))=>{const r=await s.readFile(i,"utf-8").then(JSON.parse).catch(()=>{});if(!r)throw"Could not read package.json file!";return r},z=async()=>{const i=new URL("../package.json",typeof document>"u"?require("url").pathToFileURL(__filename).href:R&&R.tagName.toUpperCase()==="SCRIPT"&&R.src||new URL("bin/main.cjs",document.baseURI).href);return F(i)},H=await(async()=>(await P()).defaultProject)(),k=await z(),$={core:`@salty-css/core@${k.version}`,react:`@salty-css/react@${k.version}`,eslintPluginCore:`@salty-css/eslint-plugin-core@${k.version}`,vite:`@salty-css/vite@${k.version}`,next:`@salty-css/next@${k.version}`},U=i=>{const r=i==="."?"":i,o=process.cwd();return n.join(o,r)};a.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 F().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:o=i,cssFile:u,skipInstall:g}=this.opts();if(!o)return h("Project directory must be provided. Add it as the first argument after init command or use the --dir option.");g||(await b($.core,$.react),await b(`-D ${$.eslintPluginCore}`));const f=process.cwd(),l=U(o),j=await Promise.all([C("salty.config.ts"),C("saltygen/index.css")]);await s.mkdir(l,{recursive:!0});const y=j.map(async({fileName:e,content:p})=>{const c=n.join(l,e);if(await s.readFile(c,"utf-8").catch(()=>{})!==void 0){t.debug("File already exists: "+c);return}const v=e.split("/").slice(0,-1).join("/");v&&await s.mkdir(n.join(l,v),{recursive:!0}),t.info("Creating file: "+c),await s.writeFile(c,p),await _(c)});await Promise.all(y);const D=n.relative(f,l)||".",d=n.join(f,".saltyrc"),w=await s.readFile(d,"utf-8").catch(()=>{});if(w===void 0){t.info("Creating file: "+d);const p=JSON.stringify({defaultProject:D,projects:[D]},null,2);await s.writeFile(d,p)}else{t.info("Edit file: "+d);const e=JSON.parse(w),p=new Set((e==null?void 0:e.projects)||[]);p.add(D),e.projects=[...p];const c=JSON.stringify(e,null,2);await s.writeFile(d,c)}const A=n.join(f,".gitignore"),I=await s.readFile(A,"utf-8").catch(()=>{});I!==void 0&&(I.includes("saltygen")||(t.info("Edit file: "+A),await s.writeFile(A,I+`
|
|
2
2
|
|
|
3
3
|
# Salty-CSS
|
|
4
4
|
saltygen
|
|
5
|
-
`)));const O=["src","public","assets","styles","css","app"],
|
|
6
|
-
`+p),await _(e)}}else
|
|
5
|
+
`)));const O=["src","public","assets","styles","css","app"],B=["styles","css","app","pages"],V=["index","styles","main","global","globals"],K=[".css",".scss",".sass"],M=await(async()=>{if(u)return u;for(const e of O)for(const p of V)for(const c of K){const S=n.join(l,e,p+c);if(await s.readFile(S,"utf-8").catch(()=>{})!==void 0)return n.relative(l,S);for(const J of B){const q=n.join(l,e,J,p+c);if(await s.readFile(q,"utf-8").catch(()=>{})!==void 0)return n.relative(l,q)}}})();if(M){const e=n.join(l,M),p=await s.readFile(e,"utf-8").catch(()=>{});if(p!==void 0&&!p.includes("saltygen")){const S=n.join(e,".."),J=`@import '${n.relative(S,n.join(l,"saltygen/index.css"))}';`;t.info("Adding global import statement to CSS file: "+e),await s.writeFile(e,J+`
|
|
6
|
+
`+p),await _(e)}}else t.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");const L=n.join(l,"vite.config.ts"),E=await s.readFile(L,"utf-8").catch(()=>{});if(E!==void 0&&!E.includes("saltyPlugin")){t.info("Edit file: "+L);const p=`import { saltyPlugin } from '@salty-css/vite';
|
|
7
7
|
`,S=E.replace(/(plugins: \[)/,`$1
|
|
8
|
-
saltyPlugin(__dirname),`);g||await b(`-D ${$.vite}`),
|
|
8
|
+
saltyPlugin(__dirname),`);g||await b(`-D ${$.vite}`),t.info("Adding Salty-CSS plugin to Vite config..."),await s.writeFile(L,p+S),await _(L)}const T=["next.config.js","next.config.cjs","next.config.ts","next.config.mjs"].map(e=>n.join(l,e)).find(e=>W.existsSync(e));if(T){let e=await s.readFile(T,"utf-8").catch(()=>{});if(e!==void 0&&!e.includes("withSaltyCss")){let c=!1;/\splugins([^=]*)=[^[]\[/.test(e)&&!c&&(e=e.replace(/\splugins([^=]*)=[^[]\[/,(q,x)=>` plugins${x}= [withSaltyCss,`),c=!0);const v=e.includes("module.exports"),J=v?`const { withSaltyCss } = require('@salty-css/next');
|
|
9
9
|
`:`import { withSaltyCss } from '@salty-css/next';
|
|
10
|
-
`;v&&!c?(e=e.replace(/module.exports = ([^;]+)/,(q,x)=>`module.exports = withSaltyCss(${x})`),c=!0):c||(e=e.replace(/export default ([^;]+)/,(q,x)=>`export default withSaltyCss(${x})`)),g||await b(`-D ${$.next}`),
|
|
10
|
+
`;v&&!c?(e=e.replace(/module.exports = ([^;]+)/,(q,x)=>`module.exports = withSaltyCss(${x})`),c=!0):c||(e=e.replace(/export default ([^;]+)/,(q,x)=>`export default withSaltyCss(${x})`)),g||await b(`-D ${$.next}`),t.info("Adding Salty-CSS plugin to Next.js config..."),await s.writeFile(T,J+e),await _(T)}}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. Star the project on GitHub: https://github.com/margarita-form/salty-css"),t.info("5. Read about the features in the documentation: https://salty-css.dev")}),a.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=H){t.info("Building the Salty-CSS project...");const{dir:r=i}=this.opts();if(!r)return h("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");const o=U(r);await Y.generateCss(o)}),a.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.").action(async function(i,r=H){const{file:o=i,dir:u=r,tag:g,name:f,className:l}=this.opts();if(!o)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 j=U(u),y=o.split("/").slice(0,-1).join("/");y&&await s.mkdir(n.join(j,y),{recursive:!0});const D=n.join(j,o),d=n.parse(D);d.ext||(d.ext=".ts"),d.name.endsWith(".css")||(d.name=d.name+".css"),d.base=d.name+d.ext;const w=n.format(d);if(await s.readFile(w,"utf-8").catch(()=>{})!==void 0){t.error("File already exists:",w);return}t.info("Generating a new file: "+w);const I=Z.pascalCase(f||d.base.replace(/\.css\.\w+$/,"")),{content:O}=await C("react/react-styled-file.ts",{tag:g,name:I,className:l});await s.writeFile(w,O),await _(w)}),a.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:r,version:o=i}=this.opts(),u=n.join(process.cwd(),"package.json"),g=await F(u).catch(y=>h(y));if(!g)return;const f={...g.dependencies,...g.devDependencies},l=Object.keys(f).filter(y=>y==="salty-css"||y.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 j=l.map(y=>o==="@"?`${y}@${k.version}`:`${y}@${o.replace(/^@/,"")}`);r?(t.warn("Using legacy peer dependencies to update packages."),await b(...j,"--legacy-peer-deps")):await b(...j),t.info("Salty-CSS packages updated successfully!")}),a.option("-v, --version","Show the current version of Salty-CSS.").action(async function(){const i=await z();t.info("CLI is running: "+i.version);const r=n.join(process.cwd(),"package.json"),o=await F(r).catch(f=>h(f));if(!o)return;const u={...o.dependencies,...o.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: "+r);for(const f of g)t.info(`${f}: ${u[f]}`)}),a.parseAsync(process.argv)}exports.main=ie;
|
package/bin/main.js
CHANGED
|
@@ -1,34 +1,34 @@
|
|
|
1
1
|
import { Command as Y } from "commander";
|
|
2
|
-
import { existsSync as
|
|
3
|
-
import { mkdir as
|
|
2
|
+
import { existsSync as B } from "fs";
|
|
3
|
+
import { mkdir as R, readFile as m, writeFile as C } from "fs/promises";
|
|
4
4
|
import { join as i, relative as _, parse as Z, format as tt } from "path";
|
|
5
5
|
import { render as et } from "ejs";
|
|
6
6
|
import { generateCss as nt } from "../compiler/index.js";
|
|
7
7
|
import { p as st } from "../pascal-case-BQpR5PdN.js";
|
|
8
|
-
import { createLogger as it, format as
|
|
8
|
+
import { createLogger as it, format as W, transports as ot } from "winston";
|
|
9
9
|
import { exec as at } from "child_process";
|
|
10
10
|
import rt from "ora";
|
|
11
|
-
const
|
|
11
|
+
const e = it({
|
|
12
12
|
level: "debug",
|
|
13
|
-
format:
|
|
13
|
+
format: W.combine(W.colorize(), W.cli()),
|
|
14
14
|
transports: [new ot.Console({})]
|
|
15
15
|
}), h = (o) => {
|
|
16
|
-
|
|
16
|
+
e.error(o);
|
|
17
17
|
}, V = (o) => new Promise((y, v) => {
|
|
18
18
|
at(o, (k) => {
|
|
19
19
|
if (k) return v(k);
|
|
20
20
|
y();
|
|
21
21
|
});
|
|
22
|
-
}),
|
|
22
|
+
}), $ = async (...o) => {
|
|
23
23
|
const y = o.map((x) => x.replace("-D", "").split("@").slice(0, -1).join("@").trim()).join(", "), v = rt(`Installing packages: ${y}`).start(), k = o.join(" ");
|
|
24
24
|
await V(`npm install ${k}`), v.succeed(`Installed packages: ${y}`);
|
|
25
|
-
}, ct = () =>
|
|
25
|
+
}, ct = () => B(i(process.cwd(), "node_modules", ".bin", "prettier"));
|
|
26
26
|
async function E(o) {
|
|
27
27
|
try {
|
|
28
28
|
if (!ct()) return;
|
|
29
|
-
await V(`./node_modules/.bin/prettier --write "${o}"`),
|
|
29
|
+
await V(`./node_modules/.bin/prettier --write "${o}"`), e.info(`Formatted ${o} with Prettier`);
|
|
30
30
|
} catch (y) {
|
|
31
|
-
|
|
31
|
+
e.error(`Error formatting ${o} with Prettier:`, y);
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
async function Pt() {
|
|
@@ -40,61 +40,61 @@ async function Pt() {
|
|
|
40
40
|
"saltygen/index.css": import("../index-D_732b92.js"),
|
|
41
41
|
// React
|
|
42
42
|
"react/react-styled-file.ts": import("../react-styled-file-CGVf5n1B.js")
|
|
43
|
-
}, v = async (
|
|
44
|
-
const { default: s } = await y[
|
|
45
|
-
return { fileName:
|
|
43
|
+
}, v = async (n, a) => {
|
|
44
|
+
const { default: s } = await y[n], f = et(s, a);
|
|
45
|
+
return { fileName: n, content: f };
|
|
46
46
|
}, k = async () => {
|
|
47
|
-
const
|
|
48
|
-
return await m(
|
|
49
|
-
}, x = async (
|
|
50
|
-
const a = await m(
|
|
47
|
+
const n = i(process.cwd(), ".saltyrc");
|
|
48
|
+
return await m(n, "utf-8").then(JSON.parse).catch(() => ({}));
|
|
49
|
+
}, x = async (n = i(process.cwd(), "package.json")) => {
|
|
50
|
+
const a = await m(n, "utf-8").then(JSON.parse).catch(() => {
|
|
51
51
|
});
|
|
52
52
|
if (!a) throw "Could not read package.json file!";
|
|
53
53
|
return a;
|
|
54
|
-
},
|
|
55
|
-
const
|
|
56
|
-
return x(
|
|
57
|
-
},
|
|
54
|
+
}, G = async () => {
|
|
55
|
+
const n = new URL("../package.json", import.meta.url);
|
|
56
|
+
return x(n);
|
|
57
|
+
}, M = await (async () => (await k()).defaultProject)(), F = await G(), D = {
|
|
58
58
|
core: `@salty-css/core@${F.version}`,
|
|
59
59
|
react: `@salty-css/react@${F.version}`,
|
|
60
60
|
eslintPluginCore: `@salty-css/eslint-plugin-core@${F.version}`,
|
|
61
61
|
vite: `@salty-css/vite@${F.version}`,
|
|
62
62
|
next: `@salty-css/next@${F.version}`
|
|
63
|
-
}, U = (
|
|
64
|
-
const a =
|
|
63
|
+
}, U = (n) => {
|
|
64
|
+
const a = n === "." ? "" : n, s = process.cwd();
|
|
65
65
|
return i(s, a);
|
|
66
66
|
};
|
|
67
|
-
o.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(
|
|
67
|
+
o.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 = ".") {
|
|
68
68
|
if (!await x().catch(() => {
|
|
69
69
|
})) return h("Salty CSS project must be initialized in a directory with a package.json file.");
|
|
70
|
-
|
|
71
|
-
const { dir: s =
|
|
70
|
+
e.info("Initializing a new Salty-CSS project!");
|
|
71
|
+
const { dir: s = n, cssFile: f, skipInstall: g } = this.opts();
|
|
72
72
|
if (!s) return h("Project directory must be provided. Add it as the first argument after init command or use the --dir option.");
|
|
73
|
-
g || (await
|
|
73
|
+
g || (await $(D.core, D.react), await $(`-D ${D.eslintPluginCore}`));
|
|
74
74
|
const p = process.cwd(), c = U(s), P = await Promise.all([v("salty.config.ts"), v("saltygen/index.css")]);
|
|
75
|
-
await
|
|
75
|
+
await R(c, { recursive: !0 });
|
|
76
76
|
const u = P.map(async ({ fileName: t, content: d }) => {
|
|
77
77
|
const r = i(c, t);
|
|
78
78
|
if (await m(r, "utf-8").catch(() => {
|
|
79
79
|
}) !== void 0) {
|
|
80
|
-
|
|
80
|
+
e.debug("File already exists: " + r);
|
|
81
81
|
return;
|
|
82
82
|
}
|
|
83
83
|
const j = t.split("/").slice(0, -1).join("/");
|
|
84
|
-
j && await
|
|
84
|
+
j && await R(i(c, j), { recursive: !0 }), e.info("Creating file: " + r), await C(r, d), await E(r);
|
|
85
85
|
});
|
|
86
86
|
await Promise.all(u);
|
|
87
87
|
const I = _(p, c) || ".", l = i(p, ".saltyrc"), w = await m(l, "utf-8").catch(() => {
|
|
88
88
|
});
|
|
89
89
|
if (w === void 0) {
|
|
90
|
-
|
|
90
|
+
e.info("Creating file: " + l);
|
|
91
91
|
const d = JSON.stringify({
|
|
92
92
|
defaultProject: I,
|
|
93
93
|
projects: [I]
|
|
94
94
|
}, null, 2);
|
|
95
95
|
await C(l, d);
|
|
96
96
|
} else {
|
|
97
|
-
|
|
97
|
+
e.info("Edit file: " + l);
|
|
98
98
|
const t = JSON.parse(w), d = new Set((t == null ? void 0 : t.projects) || []);
|
|
99
99
|
d.add(I), t.projects = [...d];
|
|
100
100
|
const r = JSON.stringify(t, null, 2);
|
|
@@ -102,12 +102,12 @@ async function Pt() {
|
|
|
102
102
|
}
|
|
103
103
|
const L = i(p, ".gitignore"), J = await m(L, "utf-8").catch(() => {
|
|
104
104
|
});
|
|
105
|
-
J !== void 0 && (J.includes("saltygen") || (
|
|
105
|
+
J !== void 0 && (J.includes("saltygen") || (e.info("Edit file: " + L), await C(L, J + `
|
|
106
106
|
|
|
107
107
|
# Salty-CSS
|
|
108
108
|
saltygen
|
|
109
109
|
`)));
|
|
110
|
-
const z = ["src", "public", "assets", "styles", "css", "app"], K = ["styles", "css", "app", "pages"], Q = ["index", "styles", "main", "global", "globals"], X = [".css", ".scss", ".sass"],
|
|
110
|
+
const z = ["src", "public", "assets", "styles", "css", "app"], K = ["styles", "css", "app", "pages"], Q = ["index", "styles", "main", "global", "globals"], X = [".css", ".scss", ".sass"], q = await (async () => {
|
|
111
111
|
if (f) return f;
|
|
112
112
|
for (const t of z)
|
|
113
113
|
for (const d of Q)
|
|
@@ -122,63 +122,64 @@ saltygen
|
|
|
122
122
|
}
|
|
123
123
|
}
|
|
124
124
|
})();
|
|
125
|
-
if (
|
|
126
|
-
const t = i(c,
|
|
125
|
+
if (q) {
|
|
126
|
+
const t = i(c, q), d = await m(t, "utf-8").catch(() => {
|
|
127
127
|
});
|
|
128
128
|
if (d !== void 0 && !d.includes("saltygen")) {
|
|
129
129
|
const S = i(t, ".."), N = `@import '${_(S, i(c, "saltygen/index.css"))}';`;
|
|
130
|
-
|
|
130
|
+
e.info("Adding global import statement to CSS file: " + t), await C(t, N + `
|
|
131
131
|
` + d), await E(t);
|
|
132
132
|
}
|
|
133
133
|
} else
|
|
134
|
-
|
|
134
|
+
e.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");
|
|
135
135
|
const O = i(c, "vite.config.ts"), H = await m(O, "utf-8").catch(() => {
|
|
136
136
|
});
|
|
137
137
|
if (H !== void 0 && !H.includes("saltyPlugin")) {
|
|
138
|
-
|
|
138
|
+
e.info("Edit file: " + O);
|
|
139
139
|
const d = `import { saltyPlugin } from '@salty-css/vite';
|
|
140
140
|
`, S = H.replace(/(plugins: \[)/, `$1
|
|
141
141
|
saltyPlugin(__dirname),`);
|
|
142
|
-
g || await
|
|
142
|
+
g || await $(`-D ${D.vite}`), e.info("Adding Salty-CSS plugin to Vite config..."), await C(O, d + S), await E(O);
|
|
143
143
|
}
|
|
144
|
-
const T = ["next.config.js", "next.config.cjs", "next.config.ts", "next.config.mjs"].map((t) => i(c, t)).find((t) =>
|
|
144
|
+
const T = ["next.config.js", "next.config.cjs", "next.config.ts", "next.config.mjs"].map((t) => i(c, t)).find((t) => B(t));
|
|
145
145
|
if (T) {
|
|
146
146
|
let t = await m(T, "utf-8").catch(() => {
|
|
147
147
|
});
|
|
148
148
|
if (t !== void 0 && !t.includes("withSaltyCss")) {
|
|
149
149
|
let r = !1;
|
|
150
|
-
/\splugins([^=]*)=[^[]\[/.test(t) && !r && (t = t.replace(/\splugins([^=]*)=[^[]\[/, (A,
|
|
150
|
+
/\splugins([^=]*)=[^[]\[/.test(t) && !r && (t = t.replace(/\splugins([^=]*)=[^[]\[/, (A, b) => ` plugins${b}= [withSaltyCss,`), r = !0);
|
|
151
151
|
const j = t.includes("module.exports"), N = j ? `const { withSaltyCss } = require('@salty-css/next');
|
|
152
152
|
` : `import { withSaltyCss } from '@salty-css/next';
|
|
153
153
|
`;
|
|
154
|
-
j && !r ? (t = t.replace(/module.exports = ([^;]+)/, (A,
|
|
154
|
+
j && !r ? (t = t.replace(/module.exports = ([^;]+)/, (A, b) => `module.exports = withSaltyCss(${b})`), r = !0) : r || (t = t.replace(/export default ([^;]+)/, (A, b) => `export default withSaltyCss(${b})`)), g || await $(`-D ${D.next}`), e.info("Adding Salty-CSS plugin to Next.js config..."), await C(T, N + t), await E(T);
|
|
155
155
|
}
|
|
156
156
|
}
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
157
|
+
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. Star the project on GitHub: https://github.com/margarita-form/salty-css"), e.info("5. Read about the features in the documentation: https://salty-css.dev");
|
|
158
|
+
}), o.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 = M) {
|
|
159
|
+
e.info("Building the Salty-CSS project...");
|
|
160
|
+
const { dir: a = n } = this.opts();
|
|
160
161
|
if (!a) return h("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");
|
|
161
162
|
const s = U(a);
|
|
162
163
|
await nt(s);
|
|
163
|
-
}), o.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.").action(async function(
|
|
164
|
-
const { file: s =
|
|
164
|
+
}), o.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.").action(async function(n, a = M) {
|
|
165
|
+
const { file: s = n, dir: f = a, tag: g, name: p, className: c } = this.opts();
|
|
165
166
|
if (!s) return h("File to generate must be provided. Add it as the first argument after generate command or use the --file option.");
|
|
166
167
|
if (!f) return h("Project directory must be provided. Add it as the second argument after generate command or use the --dir option.");
|
|
167
168
|
const P = U(f), u = s.split("/").slice(0, -1).join("/");
|
|
168
|
-
u && await
|
|
169
|
+
u && await R(i(P, u), { recursive: !0 });
|
|
169
170
|
const I = i(P, s), l = Z(I);
|
|
170
171
|
l.ext || (l.ext = ".ts"), l.name.endsWith(".css") || (l.name = l.name + ".css"), l.base = l.name + l.ext;
|
|
171
172
|
const w = tt(l);
|
|
172
173
|
if (await m(w, "utf-8").catch(() => {
|
|
173
174
|
}) !== void 0) {
|
|
174
|
-
|
|
175
|
+
e.error("File already exists:", w);
|
|
175
176
|
return;
|
|
176
177
|
}
|
|
177
|
-
|
|
178
|
+
e.info("Generating a new file: " + w);
|
|
178
179
|
const J = st(p || l.base.replace(/\.css\.\w+$/, "")), { content: z } = await v("react/react-styled-file.ts", { tag: g, name: J, className: c });
|
|
179
180
|
await C(w, z), await E(w);
|
|
180
|
-
}), o.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(
|
|
181
|
-
const { legacyPeerDeps: a, version: s =
|
|
181
|
+
}), o.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") {
|
|
182
|
+
const { legacyPeerDeps: a, version: s = n } = this.opts(), f = i(process.cwd(), "package.json"), g = await x(f).catch((u) => h(u));
|
|
182
183
|
if (!g) return;
|
|
183
184
|
const p = { ...g.dependencies, ...g.devDependencies }, c = Object.keys(p).filter((u) => u === "salty-css" || u.startsWith("@salty-css/"));
|
|
184
185
|
if (!c.length)
|
|
@@ -186,10 +187,10 @@ saltygen
|
|
|
186
187
|
"No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: " + f
|
|
187
188
|
);
|
|
188
189
|
const P = c.map((u) => s === "@" ? `${u}@${F.version}` : `${u}@${s.replace(/^@/, "")}`);
|
|
189
|
-
a ? (
|
|
190
|
+
a ? (e.warn("Using legacy peer dependencies to update packages."), await $(...P, "--legacy-peer-deps")) : await $(...P), e.info("Salty-CSS packages updated successfully!");
|
|
190
191
|
}), o.option("-v, --version", "Show the current version of Salty-CSS.").action(async function() {
|
|
191
|
-
const
|
|
192
|
-
|
|
192
|
+
const n = await G();
|
|
193
|
+
e.info("CLI is running: " + n.version);
|
|
193
194
|
const a = i(process.cwd(), "package.json"), s = await x(a).catch((p) => h(p));
|
|
194
195
|
if (!s) return;
|
|
195
196
|
const f = { ...s.dependencies, ...s.devDependencies }, g = Object.keys(f).filter((p) => p === "salty-css" || p.startsWith("@salty-css/"));
|
|
@@ -198,7 +199,7 @@ saltygen
|
|
|
198
199
|
"No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: " + a
|
|
199
200
|
);
|
|
200
201
|
for (const p of g)
|
|
201
|
-
|
|
202
|
+
e.info(`${p}: ${f[p]}`);
|
|
202
203
|
}), o.parseAsync(process.argv);
|
|
203
204
|
}
|
|
204
205
|
export {
|
package/compiler/index.cjs
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
2
|
-
`),
|
|
3
|
-
`);let
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const W=require("esbuild"),G=require("child_process"),N=require("../dash-case-DKzpenwY.cjs"),i=require("path"),a=require("fs"),J=require("fs/promises"),V=require("../parse-templates-W0YfTmOT.cjs");function A(t){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const e=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(s,n,e.get?e:{enumerable:!0,get:()=>t[n]})}}return s.default=t,Object.freeze(s)}const q=A(W),O=t=>i.join(t,"./saltygen"),M=["salty","css","styles","styled"],z=(t=[])=>new RegExp(`\\.(${[...M,...t].join("|")})\\.`),E=(t,s=[])=>z(s).test(t),L=async t=>{const s=O(t),n=i.join(t,"salty.config.ts"),e=i.join(s,"salty.config.js");await q.build({entryPoints:[n],minify:!0,treeShaking:!0,bundle:!0,outfile:e,format:"esm",external:["react"]});const l=Date.now(),{config:k}=await import(`${e}?t=${l}`);return k},B=async t=>{const s=await L(t),n=new Set,e=(c,y=[])=>c?Object.entries(c).flatMap(([u,p])=>{if(!p)return;if(typeof p=="object")return e(p,[...y,u]);const w=[...y,u].join(".");n.add(`"${w}"`);const d=[...y.map(N.dashCase),N.dashCase(u)].join("-"),{result:m}=V.parseValueTokens(p);return`--${d}: ${m};`}):[],l=c=>c?Object.entries(c).flatMap(([y,u])=>{const p=e(u);return y==="base"?p.join(""):`${y} { ${p.join("")} }`}):[],k=c=>c?Object.entries(c).flatMap(([y,u])=>Object.entries(u).flatMap(([p,w])=>{const d=e(w,[y]),m=`.${y}-${p}, [data-${y}="${p}"]`,D=d.join("");return`${m} { ${D} }`})):[],S=e(s.variables),C=l(s.responsiveVariables),r=k(s.conditionalVariables),F=O(t),h=i.join(F,"css/variables.css"),x=`:root { ${S.join("")} ${C.join("")} } ${r.join("")}`;a.writeFileSync(h,x);const g=i.join(F,"types/css-tokens.d.ts"),f=`type VariableTokens = ${[...n].join("|")||'""'}; type PropertyValueToken = \`{\${VariableTokens}}\``;a.writeFileSync(g,f);const $=i.join(F,"css/global.css"),b=V.parseStyles(s.global,"");a.writeFileSync($,b);const j=i.join(F,"css/templates.css"),P=V.parseTemplates(s.templates);a.writeFileSync(j,P)},v=async(t,s)=>{const n=N.toHash(t),e=i.join(s,"js",n+".js");await q.build({entryPoints:[t],minify:!0,treeShaking:!0,bundle:!0,outfile:e,format:"esm",target:["es2022"],keepNames:!0,external:["react"]});const l=Date.now();return await import(`${e}?t=${l}`)},_=async t=>{const s=O(t),n=i.join(s,"salty.config.js"),{config:e}=await import(n);return e},U=async t=>{try{const s=[],n=[],e=O(t),l=i.join(e,"index.css");(()=>{a.existsSync(e)&&G.execSync("rm -rf "+e),a.mkdirSync(e),a.mkdirSync(i.join(e,"css")),a.mkdirSync(i.join(e,"types"))})(),await B(t);const S=await _(t);async function C(o,f){const $=["node_modules","saltygen"],b=a.statSync(o);if(b.isDirectory()){const j=a.readdirSync(o);if($.some(c=>o.includes(c)))return;await Promise.all(j.map(c=>C(i.join(o,c),i.join(f,c))))}else if(b.isFile()&&E(o)){const P=await v(o,e),c=[];Object.entries(P).forEach(([w,d])=>{if(d.isKeyframes&&d.css){const R=`${d.animationName}.css`,H=`css/${R}`,K=i.join(e,H);s.push(R),a.writeFileSync(K,d.css);return}if(!d.generator)return;const m=d.generator._withBuildContext({name:w,config:S}),D=`${m.hash}-${m.priority}.css`;n[m.priority]||(n[m.priority]=[]),n[m.priority].push(D),c.push(D);const T=`css/${D}`,I=i.join(e,T);a.writeFileSync(I,m.css)});const y=c.map(w=>`@import url('./${w}');`).join(`
|
|
2
|
+
`),u=N.toHash(o,6),p=i.join(e,`css/${u}.css`);a.writeFileSync(p,y)}}await C(t,e);const r=s.map(o=>`@import url('./css/${o}');`).join(`
|
|
3
|
+
`);let g=`@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
|
4
4
|
|
|
5
|
-
${["variables.css","global.css","templates.css"].filter(
|
|
5
|
+
${["variables.css","global.css","templates.css"].filter(o=>{try{return a.readFileSync(i.join(e,"css",o),"utf8").length>0}catch{return!1}}).map(o=>`@import url('./css/${o}');`).join(`
|
|
6
6
|
`)}
|
|
7
|
-
${
|
|
8
|
-
`);
|
|
9
|
-
`)
|
|
10
|
-
`);
|
|
11
|
-
${
|
|
7
|
+
${r}`;if(S.importStrategy!=="component"){const o=n.flat().map(f=>`@import url('./css/${f}');`).join(`
|
|
8
|
+
`);g+=o}a.writeFileSync(l,g)}catch(s){console.error(s)}},X=async(t,s)=>{try{const n=[],e=i.join(t,"./saltygen"),l=i.join(e,"index.css");if(E(s)){const S=await _(t),C=await v(s,e);Object.entries(C).forEach(([g,o])=>{if(!o.generator)return;const f=o.generator._withBuildContext({name:g,config:S}),$=`${f.hash}-${f.priority}.css`,b=`css/${$}`,j=i.join(e,b);n.push($),a.writeFileSync(j,f.css)});const r=a.readFileSync(l,"utf8").split(`
|
|
9
|
+
`),F=n.map(g=>`@import url('../saltygen/css/${g}');`),x=[...new Set([...r,...F])].join(`
|
|
10
|
+
`);a.writeFileSync(l,x)}}catch(n){console.error(n)}},Y=async(t,s)=>{try{const n=i.join(t,"./saltygen");if(E(s)){const l=a.readFileSync(s,"utf8");l.replace(/^(?!export\s)const\s.*/gm,h=>`export ${h}`)!==l&&await J.writeFile(s,l);const S=await _(t),C=await v(s,n);let r=l;Object.entries(C).forEach(([h,x])=>{var D;if(x.isKeyframes||!x.generator)return;const g=x.generator._withBuildContext({name:h,config:S}),o=new RegExp(`\\s${h}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(l);if(!o)return console.error("Could not find the original declaration");const f=(D=o.at(1))==null?void 0:D.trim(),$=new RegExp(`\\s${h}[=\\s]+styled\\(`,"g").exec(r);if(!$)return console.error("Could not find the original declaration");const{index:b}=$;let j=!1;const P=setTimeout(()=>j=!0,5e3);let c=0,y=!1,u=0;for(;!y&&!j;){const T=r[b+c];T==="("&&u++,T===")"&&u--,u===0&&T===")"&&(y=!0),c>r.length&&(j=!0),c++}if(!j)clearTimeout(P);else throw new Error("Failed to find the end of the styled call and timed out");const p=b+c,w=r.slice(b,p),d=r,m=` ${h} = styled(${f}, "${g.classNames}", "${g._callerName}", ${JSON.stringify(g.props)});`;r=r.replace(w,m),d===r&&console.error("Minimize file failed to change content",{name:h,tagName:f})});const F=N.toHash(s,6);return S.importStrategy==="component"&&(r=`import '../../saltygen/css/${F}.css';
|
|
11
|
+
${r}`),r=r.replace("{ styled }","{ styledClient as styled }"),r=r.replace("@salty-css/react/styled","@salty-css/react/styled-client"),r}}catch(n){console.error("Error in minimizeFile:",n)}};exports.compileSaltyFile=v;exports.generateConfigStyles=B;exports.generateCss=U;exports.generateFile=X;exports.isSaltyFile=E;exports.minimizeFile=Y;exports.saltyFileExtensions=M;exports.saltyFileRegExp=z;
|
package/compiler/index.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as _ from "esbuild";
|
|
2
|
-
import { execSync as
|
|
2
|
+
import { execSync as W } from "child_process";
|
|
3
3
|
import { t as E, d as M } from "../dash-case-DMQMcCO6.js";
|
|
4
|
-
import { join as
|
|
5
|
-
import { writeFileSync as
|
|
6
|
-
import { writeFile as
|
|
7
|
-
import { p as
|
|
8
|
-
const
|
|
9
|
-
const e =
|
|
4
|
+
import { join as i } from "path";
|
|
5
|
+
import { writeFileSync as b, existsSync as G, mkdirSync as V, statSync as J, readdirSync as q, readFileSync as v } from "fs";
|
|
6
|
+
import { writeFile as A } from "fs/promises";
|
|
7
|
+
import { p as L, a as U, b as X } from "../parse-templates-D4p3pgQR.js";
|
|
8
|
+
const N = (s) => i(s, "./saltygen"), Y = ["salty", "css", "styles", "styled"], Z = (s = []) => new RegExp(`\\.(${[...Y, ...s].join("|")})\\.`), O = (s, e = []) => Z(e).test(s), Q = async (s) => {
|
|
9
|
+
const e = N(s), n = i(s, "salty.config.ts"), t = i(e, "salty.config.js");
|
|
10
10
|
await _.build({
|
|
11
11
|
entryPoints: [n],
|
|
12
12
|
minify: !0,
|
|
@@ -16,32 +16,32 @@ const T = (s) => o(s, "./saltygen"), X = ["salty", "css", "styles", "styled"], Y
|
|
|
16
16
|
format: "esm",
|
|
17
17
|
external: ["react"]
|
|
18
18
|
});
|
|
19
|
-
const
|
|
20
|
-
return
|
|
21
|
-
},
|
|
22
|
-
const e = await
|
|
23
|
-
if (!
|
|
24
|
-
if (typeof
|
|
25
|
-
const
|
|
26
|
-
n.add(`"${
|
|
27
|
-
const
|
|
28
|
-
return `--${
|
|
29
|
-
}) : [],
|
|
30
|
-
const
|
|
31
|
-
return
|
|
32
|
-
}) : [],
|
|
33
|
-
const
|
|
34
|
-
return `${
|
|
35
|
-
})) : [],
|
|
36
|
-
|
|
37
|
-
const
|
|
38
|
-
|
|
39
|
-
const
|
|
40
|
-
|
|
41
|
-
const
|
|
42
|
-
|
|
19
|
+
const a = Date.now(), { config: k } = await import(`${t}?t=${a}`);
|
|
20
|
+
return k;
|
|
21
|
+
}, tt = async (s) => {
|
|
22
|
+
const e = await Q(s), n = /* @__PURE__ */ new Set(), t = (c, l = []) => c ? Object.entries(c).flatMap(([m, p]) => {
|
|
23
|
+
if (!p) return;
|
|
24
|
+
if (typeof p == "object") return t(p, [...l, m]);
|
|
25
|
+
const j = [...l, m].join(".");
|
|
26
|
+
n.add(`"${j}"`);
|
|
27
|
+
const g = [...l.map(M), M(m)].join("-"), { result: u } = X(p);
|
|
28
|
+
return `--${g}: ${u};`;
|
|
29
|
+
}) : [], a = (c) => c ? Object.entries(c).flatMap(([l, m]) => {
|
|
30
|
+
const p = t(m);
|
|
31
|
+
return l === "base" ? p.join("") : `${l} { ${p.join("")} }`;
|
|
32
|
+
}) : [], k = (c) => c ? Object.entries(c).flatMap(([l, m]) => Object.entries(m).flatMap(([p, j]) => {
|
|
33
|
+
const g = t(j, [l]), u = `.${l}-${p}, [data-${l}="${p}"]`, D = g.join("");
|
|
34
|
+
return `${u} { ${D} }`;
|
|
35
|
+
})) : [], w = t(e.variables), C = a(e.responsiveVariables), r = k(e.conditionalVariables), F = N(s), d = i(F, "css/variables.css"), x = `:root { ${w.join("")} ${C.join("")} } ${r.join("")}`;
|
|
36
|
+
b(d, x);
|
|
37
|
+
const y = i(F, "types/css-tokens.d.ts"), f = `type VariableTokens = ${[...n].join("|") || '""'}; type PropertyValueToken = \`{\${VariableTokens}}\``;
|
|
38
|
+
b(y, f);
|
|
39
|
+
const S = i(F, "css/global.css"), $ = L(e.global, "");
|
|
40
|
+
b(S, $);
|
|
41
|
+
const h = i(F, "css/templates.css"), P = U(e.templates);
|
|
42
|
+
b(h, P);
|
|
43
43
|
}, R = async (s, e) => {
|
|
44
|
-
const n = E(s), t =
|
|
44
|
+
const n = E(s), t = i(e, "js", n + ".js");
|
|
45
45
|
await _.build({
|
|
46
46
|
entryPoints: [s],
|
|
47
47
|
minify: !0,
|
|
@@ -53,123 +53,124 @@ const T = (s) => o(s, "./saltygen"), X = ["salty", "css", "styles", "styled"], Y
|
|
|
53
53
|
keepNames: !0,
|
|
54
54
|
external: ["react"]
|
|
55
55
|
});
|
|
56
|
-
const
|
|
57
|
-
return await import(`${t}?t=${
|
|
56
|
+
const a = Date.now();
|
|
57
|
+
return await import(`${t}?t=${a}`);
|
|
58
58
|
}, B = async (s) => {
|
|
59
|
-
const e =
|
|
59
|
+
const e = N(s), n = i(e, "salty.config.js"), { config: t } = await import(n);
|
|
60
60
|
return t;
|
|
61
|
-
},
|
|
61
|
+
}, ct = async (s) => {
|
|
62
62
|
try {
|
|
63
|
-
const e = [], n = [], t =
|
|
63
|
+
const e = [], n = [], t = N(s), a = i(t, "index.css");
|
|
64
64
|
(() => {
|
|
65
|
-
|
|
66
|
-
})(), await
|
|
67
|
-
const
|
|
68
|
-
async function C(
|
|
69
|
-
const $ =
|
|
65
|
+
G(t) && W("rm -rf " + t), V(t), V(i(t, "css")), V(i(t, "types"));
|
|
66
|
+
})(), await tt(s);
|
|
67
|
+
const w = await B(s);
|
|
68
|
+
async function C(o, f) {
|
|
69
|
+
const S = ["node_modules", "saltygen"], $ = J(o);
|
|
70
70
|
if ($.isDirectory()) {
|
|
71
|
-
const
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
71
|
+
const h = q(o);
|
|
72
|
+
if (S.some((c) => o.includes(c))) return;
|
|
73
|
+
await Promise.all(h.map((c) => C(i(o, c), i(f, c))));
|
|
74
|
+
} else if ($.isFile() && O(o)) {
|
|
75
|
+
const P = await R(o, t), c = [];
|
|
76
|
+
Object.entries(P).forEach(([j, g]) => {
|
|
77
|
+
if (g.isKeyframes && g.css) {
|
|
78
|
+
const I = `${g.animationName}.css`, H = `css/${I}`, K = i(t, H);
|
|
79
|
+
e.push(I), b(K, g.css);
|
|
79
80
|
return;
|
|
80
81
|
}
|
|
81
|
-
if (!
|
|
82
|
-
const
|
|
83
|
-
name:
|
|
84
|
-
config:
|
|
85
|
-
}),
|
|
86
|
-
n[
|
|
87
|
-
const
|
|
88
|
-
|
|
82
|
+
if (!g.generator) return;
|
|
83
|
+
const u = g.generator._withBuildContext({
|
|
84
|
+
name: j,
|
|
85
|
+
config: w
|
|
86
|
+
}), D = `${u.hash}-${u.priority}.css`;
|
|
87
|
+
n[u.priority] || (n[u.priority] = []), n[u.priority].push(D), c.push(D);
|
|
88
|
+
const T = `css/${D}`, z = i(t, T);
|
|
89
|
+
b(z, u.css);
|
|
89
90
|
});
|
|
90
|
-
const l =
|
|
91
|
-
`),
|
|
92
|
-
|
|
91
|
+
const l = c.map((j) => `@import url('./${j}');`).join(`
|
|
92
|
+
`), m = E(o, 6), p = i(t, `css/${m}.css`);
|
|
93
|
+
b(p, l);
|
|
93
94
|
}
|
|
94
95
|
}
|
|
95
96
|
await C(s, t);
|
|
96
|
-
const
|
|
97
|
+
const r = e.map((o) => `@import url('./css/${o}');`).join(`
|
|
97
98
|
`);
|
|
98
|
-
let
|
|
99
|
+
let y = `@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
|
99
100
|
|
|
100
|
-
${["variables.css", "global.css", "templates.css"].filter((
|
|
101
|
+
${["variables.css", "global.css", "templates.css"].filter((o) => {
|
|
101
102
|
try {
|
|
102
|
-
return v(
|
|
103
|
+
return v(i(t, "css", o), "utf8").length > 0;
|
|
103
104
|
} catch {
|
|
104
105
|
return !1;
|
|
105
106
|
}
|
|
106
|
-
}).map((
|
|
107
|
+
}).map((o) => `@import url('./css/${o}');`).join(`
|
|
107
108
|
`)}
|
|
108
|
-
${
|
|
109
|
-
if (
|
|
110
|
-
const
|
|
109
|
+
${r}`;
|
|
110
|
+
if (w.importStrategy !== "component") {
|
|
111
|
+
const o = n.flat().map((f) => `@import url('./css/${f}');`).join(`
|
|
111
112
|
`);
|
|
112
|
-
|
|
113
|
+
y += o;
|
|
113
114
|
}
|
|
114
|
-
|
|
115
|
+
b(a, y);
|
|
115
116
|
} catch (e) {
|
|
116
117
|
console.error(e);
|
|
117
118
|
}
|
|
118
|
-
},
|
|
119
|
+
}, at = async (s, e) => {
|
|
119
120
|
try {
|
|
120
|
-
const n = [], t =
|
|
121
|
+
const n = [], t = i(s, "./saltygen"), a = i(t, "index.css");
|
|
121
122
|
if (O(e)) {
|
|
122
|
-
const
|
|
123
|
-
Object.entries(C).forEach(([
|
|
124
|
-
if (!
|
|
125
|
-
const
|
|
126
|
-
name:
|
|
127
|
-
config:
|
|
128
|
-
}),
|
|
129
|
-
n.push(
|
|
123
|
+
const w = await B(s), C = await R(e, t);
|
|
124
|
+
Object.entries(C).forEach(([y, o]) => {
|
|
125
|
+
if (!o.generator) return;
|
|
126
|
+
const f = o.generator._withBuildContext({
|
|
127
|
+
name: y,
|
|
128
|
+
config: w
|
|
129
|
+
}), S = `${f.hash}-${f.priority}.css`, $ = `css/${S}`, h = i(t, $);
|
|
130
|
+
n.push(S), b(h, f.css);
|
|
130
131
|
});
|
|
131
|
-
const
|
|
132
|
-
`),
|
|
132
|
+
const r = v(a, "utf8").split(`
|
|
133
|
+
`), F = n.map((y) => `@import url('../saltygen/css/${y}');`), x = [.../* @__PURE__ */ new Set([...r, ...F])].join(`
|
|
133
134
|
`);
|
|
134
|
-
|
|
135
|
+
b(a, x);
|
|
135
136
|
}
|
|
136
137
|
} catch (n) {
|
|
137
138
|
console.error(n);
|
|
138
139
|
}
|
|
139
|
-
},
|
|
140
|
+
}, lt = async (s, e) => {
|
|
140
141
|
try {
|
|
141
|
-
const n =
|
|
142
|
+
const n = i(s, "./saltygen");
|
|
142
143
|
if (O(e)) {
|
|
143
|
-
const
|
|
144
|
-
|
|
145
|
-
const
|
|
146
|
-
let
|
|
147
|
-
Object.entries(C).forEach(([
|
|
148
|
-
var
|
|
144
|
+
const a = v(e, "utf8");
|
|
145
|
+
a.replace(/^(?!export\s)const\s.*/gm, (d) => `export ${d}`) !== a && await A(e, a);
|
|
146
|
+
const w = await B(s), C = await R(e, n);
|
|
147
|
+
let r = a;
|
|
148
|
+
Object.entries(C).forEach(([d, x]) => {
|
|
149
|
+
var D;
|
|
149
150
|
if (x.isKeyframes || !x.generator) return;
|
|
150
|
-
const
|
|
151
|
-
name:
|
|
152
|
-
config:
|
|
153
|
-
}),
|
|
154
|
-
if (!
|
|
155
|
-
const
|
|
156
|
-
if (
|
|
157
|
-
const { index:
|
|
158
|
-
let
|
|
159
|
-
const P = setTimeout(() =>
|
|
160
|
-
let
|
|
161
|
-
for (; !
|
|
162
|
-
const
|
|
163
|
-
|
|
151
|
+
const y = x.generator._withBuildContext({
|
|
152
|
+
name: d,
|
|
153
|
+
config: w
|
|
154
|
+
}), o = new RegExp(`\\s${d}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(a);
|
|
155
|
+
if (!o) return console.error("Could not find the original declaration");
|
|
156
|
+
const f = (D = o.at(1)) == null ? void 0 : D.trim(), S = new RegExp(`\\s${d}[=\\s]+styled\\(`, "g").exec(r);
|
|
157
|
+
if (!S) return console.error("Could not find the original declaration");
|
|
158
|
+
const { index: $ } = S;
|
|
159
|
+
let h = !1;
|
|
160
|
+
const P = setTimeout(() => h = !0, 5e3);
|
|
161
|
+
let c = 0, l = !1, m = 0;
|
|
162
|
+
for (; !l && !h; ) {
|
|
163
|
+
const T = r[$ + c];
|
|
164
|
+
T === "(" && m++, T === ")" && m--, m === 0 && T === ")" && (l = !0), c > r.length && (h = !0), c++;
|
|
164
165
|
}
|
|
165
|
-
if (!
|
|
166
|
+
if (!h) clearTimeout(P);
|
|
166
167
|
else throw new Error("Failed to find the end of the styled call and timed out");
|
|
167
|
-
const
|
|
168
|
-
|
|
168
|
+
const p = $ + c, j = r.slice($, p), g = r, u = ` ${d} = styled(${f}, "${y.classNames}", "${y._callerName}", ${JSON.stringify(y.props)});`;
|
|
169
|
+
r = r.replace(j, u), g === r && console.error("Minimize file failed to change content", { name: d, tagName: f });
|
|
169
170
|
});
|
|
170
|
-
const
|
|
171
|
-
return
|
|
172
|
-
${
|
|
171
|
+
const F = E(e, 6);
|
|
172
|
+
return w.importStrategy === "component" && (r = `import '../../saltygen/css/${F}.css';
|
|
173
|
+
${r}`), r = r.replace("{ styled }", "{ styledClient as styled }"), r = r.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), r;
|
|
173
174
|
}
|
|
174
175
|
} catch (n) {
|
|
175
176
|
console.error("Error in minimizeFile:", n);
|
|
@@ -177,11 +178,11 @@ ${i}`), i = i.replace("{ styled }", "{ styledClient as styled }"), i = i.replace
|
|
|
177
178
|
};
|
|
178
179
|
export {
|
|
179
180
|
R as compileSaltyFile,
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
181
|
+
tt as generateConfigStyles,
|
|
182
|
+
ct as generateCss,
|
|
183
|
+
at as generateFile,
|
|
183
184
|
O as isSaltyFile,
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
185
|
+
lt as minimizeFile,
|
|
186
|
+
Y as saltyFileExtensions,
|
|
187
|
+
Z as saltyFileRegExp
|
|
187
188
|
};
|