@salty-css/core 0.0.1-alpha.88 → 0.0.1-alpha.89
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/.saltyrc.schema.json +4 -0
- package/bin/main.cjs +5 -5
- package/bin/main.js +65 -64
- package/package.json +1 -1
package/.saltyrc.schema.json
CHANGED
|
@@ -4,6 +4,10 @@
|
|
|
4
4
|
"description": "File .saltyrc.json is used to define projects and their configurations in json format for salty css cli.",
|
|
5
5
|
"type": "object",
|
|
6
6
|
"properties": {
|
|
7
|
+
"info": {
|
|
8
|
+
"type": "string",
|
|
9
|
+
"description": "Info about what the file is about."
|
|
10
|
+
},
|
|
7
11
|
"defaultProject": {
|
|
8
12
|
"type": "string",
|
|
9
13
|
"description": "The default project to be used."
|
package/bin/main.cjs
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ie=require("commander"),L=require("fs"),s=require("fs/promises"),i=require("path"),ne=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(i.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 ie.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(n,r)=>{const{default:l}=await h[n],p=ne.render(l,r);return{fileName:n,content:p}},x=async()=>{const n=i.join(process.cwd(),".saltyrc.json");return await s.readFile(n,"utf-8").then(JSON.parse).catch(()=>({}))},F=i.join(process.cwd(),"package.json"),D=async(n=F)=>{const r=await s.readFile(n,"utf-8").then(JSON.parse).catch(()=>{});if(!r)throw"Could not read package.json file!";return r},Z=async(n,r=F)=>{typeof n=="object"&&(n=JSON.stringify(n,null,2)),await s.writeFile(r,n)},M=async()=>{const n=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(n)},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=n=>{const r=n==="."?"":n,l=process.cwd();return i.join(l,r)};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(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:l=n,cssFile:p,skipInstall:u}=this.opts();if(!l)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 f=process.cwd(),d=R(l),b=await Promise.all([C("salty.config.ts"),C("saltygen/index.css")]);await s.mkdir(d,{recursive:!0});const m=b.map(async({fileName:e,content:a})=>{const c=i.join(d,e);if(await s.readFile(c,"utf-8").catch(()=>{})!==void 0){t.logger.debug("File already exists: "+c);return}const S=e.split("/").slice(0,-1).join("/");S&&await s.mkdir(i.join(d,S),{recursive:!0}),t.logger.info("Creating file: "+c),await s.writeFile(c,a),await P(c)});await Promise.all(m);const E=i.relative(f,d)||".",j=i.join(f,".saltyrc.json"),o=await s.readFile(j,"utf-8").catch(()=>{});if(o===void 0){t.logger.info("Creating file: "+j);const a=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:E,projects:[{dir:E,framework:"react"}]},null,2);await s.writeFile(j,a)}else{const e=JSON.parse(o),a=new Set((e==null?void 0:e.projects)||[]);a.add(E),e.projects=[...a];const c=JSON.stringify(e,null,2);c!==o&&(t.logger.info("Edit file: "+j),await s.writeFile(j,c))}const w=i.join(f,".gitignore"),T=await s.readFile(w,"utf-8").catch(()=>{});T!==void 0&&(T.includes("saltygen")||(t.logger.info("Edit file: "+w),await s.writeFile(w,T+`
|
|
2
2
|
|
|
3
3
|
# Salty-CSS
|
|
4
4
|
saltygen
|
|
5
|
-
`)));const v=["src","public","assets","styles","css","app"],H=["styles","css","app","pages"],z=["index","styles","main","global","globals"],
|
|
6
|
-
`+a),await P(e)}}else t.logger.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");const K=
|
|
5
|
+
`)));const v=["src","public","assets","styles","css","app"],H=["styles","css","app","pages"],z=["index","styles","main","global","globals"],_=[".css",".scss",".sass"],$=await(async()=>{if(p)return p;for(const e of v)for(const a of z)for(const c of _){const y=i.join(d,e,a+c);if(await s.readFile(y,"utf-8").catch(()=>{})!==void 0)return i.relative(d,y);for(const q of H){const O=i.join(d,e,q,a+c);if(await s.readFile(O,"utf-8").catch(()=>{})!==void 0)return i.relative(d,O)}}})();if($){const e=i.join(d,$),a=await s.readFile(e,"utf-8").catch(()=>{});if(a!==void 0&&!a.includes("saltygen")){const y=i.join(e,".."),q=`@import '${i.relative(y,i.join(d,"saltygen/index.css"))}';`;t.logger.info("Adding global import statement to CSS file: "+e),await s.writeFile(e,q+`
|
|
6
|
+
`+a),await P(e)}}else t.logger.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");const K=i.join(f,".eslintrc.json"),ee=L.existsSync(K),Q=i.join(d,".eslintrc.json"),X=L.existsSync(Q);if(ee||X){u||await N(I.eslintConfigCore);const e=X?Q:K,a=await s.readFile(e,"utf-8").catch(()=>{});if(!a)return t.logError("Could not read ESLint config file.");if(!a.includes("salty-css")){const y=JSON.parse(a);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 A=i.join(d,"vite.config.ts"),G=await s.readFile(A,"utf-8").catch(()=>{});if(G!==void 0&&!G.includes("saltyPlugin")){t.logger.info("Edit file: "+A);const a=`import { saltyPlugin } from '@salty-css/vite';
|
|
7
7
|
`,y=G.replace(/(plugins: \[)/,`$1
|
|
8
|
-
saltyPlugin(__dirname),`);u||await N(`-D ${I.vite}`),t.logger.info("Adding Salty-CSS plugin to Vite config..."),await s.writeFile(
|
|
8
|
+
saltyPlugin(__dirname),`);u||await N(`-D ${I.vite}`),t.logger.info("Adding Salty-CSS plugin to Vite config..."),await s.writeFile(A,a+y),await P(A)}const U=["next.config.js","next.config.cjs","next.config.ts","next.config.mjs"].map(e=>i.join(d,e)).find(e=>L.existsSync(e));if(U){let e=await s.readFile(U,"utf-8").catch(()=>{});if(e!==void 0&&!e.includes("withSaltyCss")){let c=!1;/\splugins([^=]*)=[^[]\[/.test(e)&&!c&&(e=e.replace(/\splugins([^=]*)=[^[]\[/,(O,J)=>` plugins${J}= [withSaltyCss,`),c=!0);const S=e.includes("module.exports"),q=S?`const { withSaltyCss } = require('@salty-css/next');
|
|
9
9
|
`:`import { withSaltyCss } from '@salty-css/next';
|
|
10
|
-
`;S&&!c?(e=e.replace(/module.exports = ([^;]+)/,(O,J)=>`module.exports = withSaltyCss(${J})`),c=!0):c||(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(U,q+e),await P(U)}}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(
|
|
10
|
+
`;S&&!c?(e=e.replace(/module.exports = ([^;]+)/,(O,J)=>`module.exports = withSaltyCss(${J})`),c=!0):c||(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(U,q+e),await P(U)}}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(n=B){t.logger.info("Building the Salty-CSS project...");const{dir:r=n}=this.opts();if(!r)return t.logError("Project directory must be provided. Add it as the first argument after build command or use the --dir option.");const l=R(r);await t.generateCss(l)}),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(n,r=B){const{file:l=n,dir:p=r,tag:u,name:f,className:d,reactComponent:b=!1}=this.opts();if(!l)return t.logError("File to generate must be provided. Add it as the first argument after generate command or use the --file option.");if(!p)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(p),E=l.split("/").slice(0,-1).join("/");E&&await s.mkdir(i.join(m,E),{recursive:!0});const j=i.join(m,l),o=i.parse(j);o.ext||(o.ext=".ts"),o.name.endsWith(".css")||(o.name=o.name+".css"),o.base=o.name+o.ext;const w=i.format(o);if(await s.readFile(w,"utf-8").catch(()=>{})!==void 0){t.logger.error("File already exists:",w);return}let v=se.pascalCase(f||o.base.replace(/\.css\.\w+$/,""));if(b){const z=v+"Component";v=v+"Wrapper";const _=o.base.replace(/\.css\.\w+$/,""),{content:V}=await C("react/react-vanilla-file.ts",{tag:u,componentName:z,styledComponentName:v,className:d,fileName:_});o.name=_.replace(/\.css$/,""),o.ext=".tsx",o.base=o.name+o.ext;const $=i.format(o);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:d});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(n="latest"){const{legacyPeerDeps:r,version:l=n}=this.opts(),p=i.join(process.cwd(),"package.json"),u=await D(p).catch(m=>t.logError(m));if(!u)return;const f={...u.dependencies,...u.devDependencies},d=Object.keys(f).filter(m=>m==="salty-css"||m.startsWith("@salty-css/"));if(!d.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: "+p);const b=d.map(m=>l==="@"?`${m}@${k.version}`:`${m}@${l.replace(/^@/,"")}`);r?(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 n=await M();t.logger.info("CLI is running: "+n.version);const r=i.join(process.cwd(),"package.json"),l=await D(r).catch(f=>t.logError(f));if(!l)return;const p={...l.dependencies,...l.devDependencies},u=Object.keys(p).filter(f=>f==="salty-css"||f.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: "+r);for(const f of u)t.logger.info(`${f}: ${p[f]}`)}),g.parseAsync(process.argv)}exports.main=ce;
|
package/bin/main.js
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import { Command as ot } from "commander";
|
|
2
2
|
import { existsSync as G } from "fs";
|
|
3
3
|
import { mkdir as V, readFile as m, writeFile as h } from "fs/promises";
|
|
4
|
-
import { join as
|
|
4
|
+
import { join as a, relative as z, parse as rt, format as et } from "path";
|
|
5
5
|
import { render as ct } from "ejs";
|
|
6
6
|
import { l as e, a as w, g as lt } from "../index-BGaLvshf.js";
|
|
7
7
|
import { p as dt } from "../pascal-case-BQpR5PdN.js";
|
|
8
|
-
import { exec as
|
|
9
|
-
import
|
|
8
|
+
import { exec as ft } from "child_process";
|
|
9
|
+
import pt from "ora";
|
|
10
10
|
const st = (d) => new Promise((C, j) => {
|
|
11
|
-
|
|
11
|
+
ft(d, (F) => {
|
|
12
12
|
if (F) return j(F);
|
|
13
13
|
C();
|
|
14
14
|
});
|
|
15
15
|
}), I = async (...d) => {
|
|
16
|
-
const C = d.map((b) => b.replace("-D", "").split("@").slice(0, -1).join("@").trim()).join(", "), j =
|
|
16
|
+
const C = d.map((b) => b.replace("-D", "").split("@").slice(0, -1).join("@").trim()).join(", "), j = pt(`Installing packages: ${C}`).start(), F = d.join(" ");
|
|
17
17
|
await st(`npm install ${F}`), j.succeed(`Installed packages: ${C}`);
|
|
18
|
-
}, gt = () => G(
|
|
18
|
+
}, gt = () => G(a(process.cwd(), "node_modules", ".bin", "prettier"));
|
|
19
19
|
async function k(d) {
|
|
20
20
|
try {
|
|
21
21
|
if (!gt()) return;
|
|
@@ -35,12 +35,12 @@ async function kt() {
|
|
|
35
35
|
"react/react-styled-file.ts": import("../react-styled-file-CGVf5n1B.js"),
|
|
36
36
|
"react/react-vanilla-file.ts": import("../react-vanilla-file-CCXbsjIb.js")
|
|
37
37
|
}, j = async (s, o) => {
|
|
38
|
-
const { default: c } = await C[s],
|
|
39
|
-
return { fileName: s, content:
|
|
38
|
+
const { default: c } = await C[s], p = ct(c, o);
|
|
39
|
+
return { fileName: s, content: p };
|
|
40
40
|
}, F = async () => {
|
|
41
|
-
const s =
|
|
41
|
+
const s = a(process.cwd(), ".saltyrc.json");
|
|
42
42
|
return await m(s, "utf-8").then(JSON.parse).catch(() => ({}));
|
|
43
|
-
}, b =
|
|
43
|
+
}, b = a(process.cwd(), "package.json"), A = async (s = b) => {
|
|
44
44
|
const o = await m(s, "utf-8").then(JSON.parse).catch(() => {
|
|
45
45
|
});
|
|
46
46
|
if (!o) throw "Could not read package.json file!";
|
|
@@ -58,34 +58,35 @@ async function kt() {
|
|
|
58
58
|
next: `@salty-css/next@${$.version}`
|
|
59
59
|
}, W = (s) => {
|
|
60
60
|
const o = s === "." ? "" : s, c = process.cwd();
|
|
61
|
-
return
|
|
61
|
+
return a(c, o);
|
|
62
62
|
};
|
|
63
63
|
d.command("init [directory]").description("Initialize a new Salty-CSS project.").option("-d, --dir <dir>", "Project directory to initialize the project in.").option("--css-file <css-file>", "Existing CSS file where to import the generated CSS. Path must be relative to the given project directory.").option("--skip-install", "Skip installing dependencies.").action(async function(s = ".") {
|
|
64
64
|
if (!await A().catch(() => {
|
|
65
65
|
})) return w("Salty CSS project must be initialized in a directory with a package.json file.");
|
|
66
66
|
e.info("Initializing a new Salty-CSS project!");
|
|
67
|
-
const { dir: c = s, cssFile:
|
|
67
|
+
const { dir: c = s, cssFile: p, skipInstall: g } = this.opts();
|
|
68
68
|
if (!c) return w("Project directory must be provided. Add it as the first argument after init command or use the --dir option.");
|
|
69
69
|
g || await I(O.core, O.react);
|
|
70
|
-
const
|
|
70
|
+
const f = process.cwd(), l = W(c), J = await Promise.all([j("salty.config.ts"), j("saltygen/index.css")]);
|
|
71
71
|
await V(l, { recursive: !0 });
|
|
72
|
-
const y = J.map(async ({ fileName: t, content:
|
|
73
|
-
const r =
|
|
72
|
+
const y = J.map(async ({ fileName: t, content: i }) => {
|
|
73
|
+
const r = a(l, t);
|
|
74
74
|
if (await m(r, "utf-8").catch(() => {
|
|
75
75
|
}) !== void 0) {
|
|
76
76
|
e.debug("File already exists: " + r);
|
|
77
77
|
return;
|
|
78
78
|
}
|
|
79
79
|
const v = t.split("/").slice(0, -1).join("/");
|
|
80
|
-
v && await V(
|
|
80
|
+
v && await V(a(l, v), { recursive: !0 }), e.info("Creating file: " + r), await h(r, i), await k(r);
|
|
81
81
|
});
|
|
82
82
|
await Promise.all(y);
|
|
83
|
-
const N = z(
|
|
83
|
+
const N = z(f, l) || ".", P = a(f, ".saltyrc.json"), n = await m(P, "utf-8").catch(() => {
|
|
84
84
|
});
|
|
85
85
|
if (n === void 0) {
|
|
86
86
|
e.info("Creating file: " + P);
|
|
87
|
-
const
|
|
87
|
+
const i = JSON.stringify({
|
|
88
88
|
$schema: "./node_modules/@salty-css/core/.saltyrc.schema.json",
|
|
89
|
+
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.",
|
|
89
90
|
defaultProject: N,
|
|
90
91
|
projects: [
|
|
91
92
|
{
|
|
@@ -94,82 +95,82 @@ async function kt() {
|
|
|
94
95
|
}
|
|
95
96
|
]
|
|
96
97
|
}, null, 2);
|
|
97
|
-
await h(P,
|
|
98
|
+
await h(P, i);
|
|
98
99
|
} else {
|
|
99
|
-
const t = JSON.parse(n),
|
|
100
|
-
|
|
100
|
+
const t = JSON.parse(n), i = new Set((t == null ? void 0 : t.projects) || []);
|
|
101
|
+
i.add(N), t.projects = [...i];
|
|
101
102
|
const r = JSON.stringify(t, null, 2);
|
|
102
103
|
r !== n && (e.info("Edit file: " + P), await h(P, r));
|
|
103
104
|
}
|
|
104
|
-
const S =
|
|
105
|
+
const S = a(f, ".gitignore"), L = await m(S, "utf-8").catch(() => {
|
|
105
106
|
});
|
|
106
|
-
|
|
107
|
+
L !== void 0 && (L.includes("saltygen") || (e.info("Edit file: " + S), await h(S, L + `
|
|
107
108
|
|
|
108
109
|
# Salty-CSS
|
|
109
110
|
saltygen
|
|
110
111
|
`)));
|
|
111
|
-
const x = ["src", "public", "assets", "styles", "css", "app"], M = ["styles", "css", "app", "pages"], q = ["index", "styles", "main", "global", "globals"], U = [".css", ".scss", ".sass"],
|
|
112
|
-
if (
|
|
112
|
+
const x = ["src", "public", "assets", "styles", "css", "app"], M = ["styles", "css", "app", "pages"], q = ["index", "styles", "main", "global", "globals"], U = [".css", ".scss", ".sass"], D = await (async () => {
|
|
113
|
+
if (p) return p;
|
|
113
114
|
for (const t of x)
|
|
114
|
-
for (const
|
|
115
|
+
for (const i of q)
|
|
115
116
|
for (const r of U) {
|
|
116
|
-
const u =
|
|
117
|
+
const u = a(l, t, i + r);
|
|
117
118
|
if (await m(u, "utf-8").catch(() => {
|
|
118
119
|
}) !== void 0) return z(l, u);
|
|
119
120
|
for (const H of M) {
|
|
120
|
-
const
|
|
121
|
-
if (await m(
|
|
122
|
-
}) !== void 0) return z(l,
|
|
121
|
+
const T = a(l, t, H, i + r);
|
|
122
|
+
if (await m(T, "utf-8").catch(() => {
|
|
123
|
+
}) !== void 0) return z(l, T);
|
|
123
124
|
}
|
|
124
125
|
}
|
|
125
126
|
})();
|
|
126
|
-
if (
|
|
127
|
-
const t =
|
|
127
|
+
if (D) {
|
|
128
|
+
const t = a(l, D), i = await m(t, "utf-8").catch(() => {
|
|
128
129
|
});
|
|
129
|
-
if (
|
|
130
|
-
const u =
|
|
130
|
+
if (i !== void 0 && !i.includes("saltygen")) {
|
|
131
|
+
const u = a(t, ".."), H = `@import '${z(u, a(l, "saltygen/index.css"))}';`;
|
|
131
132
|
e.info("Adding global import statement to CSS file: " + t), await h(t, H + `
|
|
132
|
-
` +
|
|
133
|
+
` + i), await k(t);
|
|
133
134
|
}
|
|
134
135
|
} else
|
|
135
136
|
e.warn("Could not find a CSS file to import the generated CSS. Please add it manually.");
|
|
136
|
-
const Y =
|
|
137
|
-
if (
|
|
137
|
+
const Y = a(f, ".eslintrc.json"), it = G(Y), Z = a(l, ".eslintrc.json"), tt = G(Z);
|
|
138
|
+
if (it || tt) {
|
|
138
139
|
g || await I(O.eslintConfigCore);
|
|
139
|
-
const t = tt ? Z : Y,
|
|
140
|
+
const t = tt ? Z : Y, i = await m(t, "utf-8").catch(() => {
|
|
140
141
|
});
|
|
141
|
-
if (!
|
|
142
|
-
if (!
|
|
143
|
-
const u = JSON.parse(
|
|
142
|
+
if (!i) return w("Could not read ESLint config file.");
|
|
143
|
+
if (!i.includes("salty-css")) {
|
|
144
|
+
const u = JSON.parse(i);
|
|
144
145
|
e.info("Edit file: " + t), u.extends || (u.extends = []), u.extends.push("@salty-css/core");
|
|
145
146
|
const v = JSON.stringify(u, null, 2);
|
|
146
147
|
await h(t, v), await k(t);
|
|
147
148
|
}
|
|
148
149
|
}
|
|
149
|
-
const _ =
|
|
150
|
+
const _ = a(l, "vite.config.ts"), B = await m(_, "utf-8").catch(() => {
|
|
150
151
|
});
|
|
151
152
|
if (B !== void 0 && !B.includes("saltyPlugin")) {
|
|
152
153
|
e.info("Edit file: " + _);
|
|
153
|
-
const
|
|
154
|
+
const i = `import { saltyPlugin } from '@salty-css/vite';
|
|
154
155
|
`, u = B.replace(/(plugins: \[)/, `$1
|
|
155
156
|
saltyPlugin(__dirname),`);
|
|
156
|
-
g || await I(`-D ${O.vite}`), e.info("Adding Salty-CSS plugin to Vite config..."), await h(_,
|
|
157
|
+
g || await I(`-D ${O.vite}`), e.info("Adding Salty-CSS plugin to Vite config..."), await h(_, i + u), await k(_);
|
|
157
158
|
}
|
|
158
|
-
const R = ["next.config.js", "next.config.cjs", "next.config.ts", "next.config.mjs"].map((t) =>
|
|
159
|
+
const R = ["next.config.js", "next.config.cjs", "next.config.ts", "next.config.mjs"].map((t) => a(l, t)).find((t) => G(t));
|
|
159
160
|
if (R) {
|
|
160
161
|
let t = await m(R, "utf-8").catch(() => {
|
|
161
162
|
});
|
|
162
163
|
if (t !== void 0 && !t.includes("withSaltyCss")) {
|
|
163
164
|
let r = !1;
|
|
164
|
-
/\splugins([^=]*)=[^[]\[/.test(t) && !r && (t = t.replace(/\splugins([^=]*)=[^[]\[/, (
|
|
165
|
+
/\splugins([^=]*)=[^[]\[/.test(t) && !r && (t = t.replace(/\splugins([^=]*)=[^[]\[/, (T, E) => ` plugins${E}= [withSaltyCss,`), r = !0);
|
|
165
166
|
const v = t.includes("module.exports"), H = v ? `const { withSaltyCss } = require('@salty-css/next');
|
|
166
167
|
` : `import { withSaltyCss } from '@salty-css/next';
|
|
167
168
|
`;
|
|
168
|
-
v && !r ? (t = t.replace(/module.exports = ([^;]+)/, (
|
|
169
|
+
v && !r ? (t = t.replace(/module.exports = ([^;]+)/, (T, E) => `module.exports = withSaltyCss(${E})`), r = !0) : r || (t = t.replace(/export default ([^;]+)/, (T, E) => `export default withSaltyCss(${E})`)), g || await I(`-D ${O.next}`), e.info("Adding Salty-CSS plugin to Next.js config..."), await h(R, H + t), await k(R);
|
|
169
170
|
}
|
|
170
171
|
}
|
|
171
|
-
const
|
|
172
|
-
await nt(
|
|
172
|
+
const at = 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));
|
|
173
|
+
await nt(at), 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 ⭐");
|
|
173
174
|
}), 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(s = Q) {
|
|
174
175
|
e.info("Building the Salty-CSS project...");
|
|
175
176
|
const { dir: o = s } = this.opts();
|
|
@@ -177,12 +178,12 @@ saltygen
|
|
|
177
178
|
const c = W(o);
|
|
178
179
|
await lt(c);
|
|
179
180
|
}), 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(s, o = Q) {
|
|
180
|
-
const { file: c = s, dir:
|
|
181
|
+
const { file: c = s, dir: p = o, tag: g, name: f, className: l, reactComponent: J = !1 } = this.opts();
|
|
181
182
|
if (!c) return w("File to generate must be provided. Add it as the first argument after generate command or use the --file option.");
|
|
182
|
-
if (!
|
|
183
|
-
const y = W(
|
|
184
|
-
N && await V(
|
|
185
|
-
const P =
|
|
183
|
+
if (!p) return w("Project directory must be provided. Add it as the second argument after generate command or use the --dir option.");
|
|
184
|
+
const y = W(p), N = c.split("/").slice(0, -1).join("/");
|
|
185
|
+
N && await V(a(y, N), { recursive: !0 });
|
|
186
|
+
const P = a(y, c), n = rt(P);
|
|
186
187
|
n.ext || (n.ext = ".ts"), n.name.endsWith(".css") || (n.name = n.name + ".css"), n.base = n.name + n.ext;
|
|
187
188
|
const S = et(n);
|
|
188
189
|
if (await m(S, "utf-8").catch(() => {
|
|
@@ -190,39 +191,39 @@ saltygen
|
|
|
190
191
|
e.error("File already exists:", S);
|
|
191
192
|
return;
|
|
192
193
|
}
|
|
193
|
-
let x = dt(
|
|
194
|
+
let x = dt(f || n.base.replace(/\.css\.\w+$/, ""));
|
|
194
195
|
if (J) {
|
|
195
196
|
const q = x + "Component";
|
|
196
197
|
x = x + "Wrapper";
|
|
197
198
|
const U = n.base.replace(/\.css\.\w+$/, ""), { content: X } = await j("react/react-vanilla-file.ts", { tag: g, componentName: q, styledComponentName: x, className: l, fileName: U });
|
|
198
199
|
n.name = U.replace(/\.css$/, ""), n.ext = ".tsx", n.base = n.name + n.ext;
|
|
199
|
-
const
|
|
200
|
-
e.info("Generating a new file: " +
|
|
200
|
+
const D = et(n);
|
|
201
|
+
e.info("Generating a new file: " + D), await h(D, X), await k(D);
|
|
201
202
|
}
|
|
202
203
|
const { content: M } = await j("react/react-styled-file.ts", { tag: g, name: x, className: l });
|
|
203
204
|
e.info("Generating a new file: " + S), await h(S, M), await k(S);
|
|
204
205
|
}), 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(s = "latest") {
|
|
205
|
-
const { legacyPeerDeps: o, version: c = s } = this.opts(),
|
|
206
|
+
const { legacyPeerDeps: o, version: c = s } = this.opts(), p = a(process.cwd(), "package.json"), g = await A(p).catch((y) => w(y));
|
|
206
207
|
if (!g) return;
|
|
207
|
-
const
|
|
208
|
+
const f = { ...g.dependencies, ...g.devDependencies }, l = Object.keys(f).filter((y) => y === "salty-css" || y.startsWith("@salty-css/"));
|
|
208
209
|
if (!l.length)
|
|
209
210
|
return w(
|
|
210
|
-
"No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: " +
|
|
211
|
+
"No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: " + p
|
|
211
212
|
);
|
|
212
213
|
const J = l.map((y) => c === "@" ? `${y}@${$.version}` : `${y}@${c.replace(/^@/, "")}`);
|
|
213
214
|
o ? (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!");
|
|
214
215
|
}), d.option("-v, --version", "Show the current version of Salty-CSS.").action(async function() {
|
|
215
216
|
const s = await K();
|
|
216
217
|
e.info("CLI is running: " + s.version);
|
|
217
|
-
const o =
|
|
218
|
+
const o = a(process.cwd(), "package.json"), c = await A(o).catch((f) => w(f));
|
|
218
219
|
if (!c) return;
|
|
219
|
-
const
|
|
220
|
+
const p = { ...c.dependencies, ...c.devDependencies }, g = Object.keys(p).filter((f) => f === "salty-css" || f.startsWith("@salty-css/"));
|
|
220
221
|
if (!g.length)
|
|
221
222
|
return w(
|
|
222
223
|
"No Salty-CSS packages found in package.json. Make sure you are running update command in the same directory! Used package.json path: " + o
|
|
223
224
|
);
|
|
224
|
-
for (const
|
|
225
|
-
e.info(`${
|
|
225
|
+
for (const f of g)
|
|
226
|
+
e.info(`${f}: ${p[f]}`);
|
|
226
227
|
}), d.parseAsync(process.argv);
|
|
227
228
|
}
|
|
228
229
|
export {
|