@salty-css/core 0.0.1-alpha.12 → 0.0.1-alpha.120
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 +40 -0
- package/README.md +102 -26
- package/bin/bin-util.d.ts +2 -0
- package/bin/index.cjs +2 -0
- package/bin/index.d.ts +2 -0
- package/bin/index.js +3 -0
- package/bin/logger.d.ts +2 -0
- package/bin/main.cjs +11 -0
- package/bin/main.d.ts +1 -0
- package/bin/main.js +260 -0
- package/bin/prettier.d.ts +1 -0
- package/compiler/get-files.d.ts +3 -0
- package/compiler/index.cjs +1 -11
- package/compiler/index.d.ts +4 -6
- package/compiler/index.js +16 -180
- package/config/config-types.d.ts +15 -5
- package/dash-case-BJEkFEGQ.cjs +1 -0
- package/dash-case-DBThphLm.js +19 -0
- package/generator/index.cjs +1 -1
- package/generator/index.js +34 -18
- package/generator/parse-templates.d.ts +2 -0
- package/generator/style-generator.d.ts +13 -4
- package/index-84Wroia-.cjs +1 -0
- package/index-BKt0qRhM.js +300 -0
- package/index-D_732b92.js +4 -0
- package/index-mhoDzsNb.cjs +21 -0
- package/package.json +20 -2
- package/parse-templates-BuKrl3n7.js +100 -0
- package/parse-templates-DIOn-gO_.cjs +8 -0
- package/pascal-case-BQpR5PdN.js +6 -0
- package/pascal-case-iWoaJWwT.cjs +1 -0
- package/react-styled-file-CGVf5n1B.js +11 -0
- package/react-styled-file-Dkubsz-U.cjs +8 -0
- package/react-vanilla-file-CCXbsjIb.js +18 -0
- package/react-vanilla-file-CG_WJLam.cjs +15 -0
- package/salty.config-BhBY_oOk.js +10 -0
- package/salty.config-Dk6ZcCxI.cjs +7 -0
- package/templates/salty-reset.d.ts +2 -0
- package/types/index.d.ts +48 -21
- package/util/camel-case.d.ts +1 -0
- package/util/dot-case.d.ts +1 -0
- package/util/index.cjs +1 -1
- package/util/index.d.ts +2 -0
- package/util/index.js +7 -15
- package/util/module-type.d.ts +1 -0
- package/util/pascal-case.d.ts +1 -0
- package/parse-templates-BOSK0Tb6.js +0 -90
- package/parse-templates-BY1Xai-_.cjs +0 -8
@@ -0,0 +1,300 @@
|
|
1
|
+
import * as q from "esbuild";
|
2
|
+
import { execSync as et } from "child_process";
|
3
|
+
import { t as H, d as G } from "./dash-case-DBThphLm.js";
|
4
|
+
import { join as o, parse as st } from "path";
|
5
|
+
import { existsSync as I, writeFileSync as b, mkdirSync as O, readFileSync as J, statSync as nt, readdirSync as ot } from "fs";
|
6
|
+
import { readFile as rt, writeFile as at } from "fs/promises";
|
7
|
+
import { p as L, a as it, b as ct, c as lt } from "./parse-templates-BuKrl3n7.js";
|
8
|
+
import { createLogger as pt, format as z, transports as ft } from "winston";
|
9
|
+
const U = (t) => {
|
10
|
+
if (!t || t === "/") throw new Error("Could not find package.json file");
|
11
|
+
const e = o(t, "package.json");
|
12
|
+
return I(e) ? e : U(o(t, ".."));
|
13
|
+
}, ut = async (t) => {
|
14
|
+
const e = U(t);
|
15
|
+
return await rt(e, "utf-8").then(JSON.parse).catch(() => {
|
16
|
+
});
|
17
|
+
}, gt = async (t) => {
|
18
|
+
const e = await ut(t);
|
19
|
+
if (e)
|
20
|
+
return e.type;
|
21
|
+
};
|
22
|
+
let v;
|
23
|
+
const X = async (t) => {
|
24
|
+
if (v) return v;
|
25
|
+
const e = await gt(t);
|
26
|
+
return e === "module" ? v = "esm" : (e === "commonjs" || import.meta.url.endsWith(".cjs")) && (v = "cjs"), v || "esm";
|
27
|
+
}, B = pt({
|
28
|
+
level: "debug",
|
29
|
+
format: z.combine(z.colorize(), z.cli()),
|
30
|
+
transports: [new ft.Console({})]
|
31
|
+
}), Ft = (t) => {
|
32
|
+
B.error(t);
|
33
|
+
};
|
34
|
+
function Y(t) {
|
35
|
+
return t ? typeof t != "string" ? Y(String(t)) : t.replace(/[\s-]/g, ".").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g, (e, a) => (a > 0 ? "." : "") + e.toLowerCase()) : "";
|
36
|
+
}
|
37
|
+
const dt = {
|
38
|
+
/** Set box model to border-box */
|
39
|
+
"*, *::before, *::after": {
|
40
|
+
boxSizing: "border-box"
|
41
|
+
},
|
42
|
+
/** Remove default margin and padding */
|
43
|
+
"*": {
|
44
|
+
margin: 0
|
45
|
+
},
|
46
|
+
/** Remove adjust font properties */
|
47
|
+
html: {
|
48
|
+
lineHeight: 1.15,
|
49
|
+
textSizeAdjust: "100%",
|
50
|
+
WebkitFontSmoothing: "antialiased"
|
51
|
+
},
|
52
|
+
/** Make media elements responsive */
|
53
|
+
"img, picture, video, canvas, svg": {
|
54
|
+
display: "block",
|
55
|
+
maxWidth: "100%"
|
56
|
+
},
|
57
|
+
/** Avoid overflow of text */
|
58
|
+
"p, h1, h2, h3, h4, h5, h6": {
|
59
|
+
overflowWrap: "break-word"
|
60
|
+
},
|
61
|
+
/** Improve text wrapping */
|
62
|
+
p: {
|
63
|
+
textWrap: "pretty"
|
64
|
+
},
|
65
|
+
"h1, h2, h3, h4, h5, h6": {
|
66
|
+
textWrap: "balance"
|
67
|
+
},
|
68
|
+
/** Improve button line height */
|
69
|
+
button: {
|
70
|
+
lineHeight: "1em"
|
71
|
+
},
|
72
|
+
/** Improve form elements */
|
73
|
+
"input, optgroup, select, textarea": {
|
74
|
+
fontFamily: "inherit",
|
75
|
+
fontSize: "100%",
|
76
|
+
lineHeight: "1.15em"
|
77
|
+
}
|
78
|
+
}, A = {
|
79
|
+
externalModules: []
|
80
|
+
}, Q = (t) => {
|
81
|
+
if (A.externalModules.length > 0) return A.externalModules;
|
82
|
+
const e = o(t, "salty.config.ts"), s = J(e, "utf8").match(/externalModules:\s?\[(.*)\]/);
|
83
|
+
if (!s) return [];
|
84
|
+
const r = s[1].split(",").map((l) => l.replace(/['"`]/g, "").trim());
|
85
|
+
return A.externalModules = r, r;
|
86
|
+
}, R = (t) => o(t, "./saltygen"), yt = ["salty", "css", "styles", "styled"], mt = (t = []) => new RegExp(`\\.(${[...yt, ...t].join("|")})\\.`), Z = (t, e = []) => mt(e).test(t), ht = async (t) => {
|
87
|
+
const e = R(t), a = o(t, "salty.config.ts"), s = o(e, "salty.config.js"), r = await X(t), l = Q(t);
|
88
|
+
await q.build({
|
89
|
+
entryPoints: [a],
|
90
|
+
minify: !0,
|
91
|
+
treeShaking: !0,
|
92
|
+
bundle: !0,
|
93
|
+
outfile: s,
|
94
|
+
format: r,
|
95
|
+
external: l
|
96
|
+
});
|
97
|
+
const m = Date.now(), { config: g } = await import(`${s}?t=${m}`);
|
98
|
+
return g;
|
99
|
+
}, bt = async (t) => {
|
100
|
+
const e = await ht(t), a = /* @__PURE__ */ new Set(), s = (f, c = []) => f ? Object.entries(f).flatMap(([u, p]) => {
|
101
|
+
if (!p) return;
|
102
|
+
if (typeof p == "object") return s(p, [...c, u]);
|
103
|
+
const C = Y(u), V = G(u), M = [...c, C].join(".");
|
104
|
+
a.add(`"${M}"`);
|
105
|
+
const N = [...c.map(G), V].join("-"), { result: W } = lt(p);
|
106
|
+
return `--${N}: ${W};`;
|
107
|
+
}) : [], r = (f) => f ? Object.entries(f).flatMap(([c, u]) => {
|
108
|
+
const p = s(u);
|
109
|
+
return c === "base" ? p.join("") : `${c} { ${p.join("")} }`;
|
110
|
+
}) : [], l = (f) => f ? Object.entries(f).flatMap(([c, u]) => Object.entries(u).flatMap(([p, C]) => {
|
111
|
+
const V = s(C, [c]), M = `.${c}-${p}, [data-${c}="${p}"]`, N = V.join("");
|
112
|
+
return `${M} { ${N} }`;
|
113
|
+
})) : [], m = s(e.variables), g = r(e.responsiveVariables), $ = l(e.conditionalVariables), n = R(t), F = o(n, "css/variables.css"), y = `:root { ${m.join("")} ${g.join("")} } ${$.join("")}`;
|
114
|
+
b(F, y);
|
115
|
+
const S = o(n, "css/global.css"), w = L(e.global, "");
|
116
|
+
b(S, `@layer global { ${w} }`);
|
117
|
+
const i = o(n, "css/reset.css"), k = e.reset === "none" ? {} : typeof e.reset == "object" ? e.reset : dt, x = L(k, "");
|
118
|
+
b(i, `@layer reset { ${x} }`);
|
119
|
+
const j = o(n, "css/templates.css"), T = it(e.templates), d = ct(e.templates);
|
120
|
+
b(j, T);
|
121
|
+
const P = o(n, "types/css-tokens.d.ts"), E = `
|
122
|
+
// Variable types
|
123
|
+
type VariableTokens = ${[...a].join("|")};
|
124
|
+
type PropertyValueToken = \`{\${VariableTokens}}\`;
|
125
|
+
|
126
|
+
// Template types
|
127
|
+
type TemplateTokens = {
|
128
|
+
${Object.entries(d).map(([f, c]) => `${f}?: ${c}`).join(`
|
129
|
+
`)}
|
130
|
+
}
|
131
|
+
`;
|
132
|
+
b(P, E);
|
133
|
+
}, _ = async (t, e, a) => {
|
134
|
+
const s = H(e), r = o(a, "./temp");
|
135
|
+
I(r) || O(r);
|
136
|
+
const l = st(e);
|
137
|
+
let m = J(e, "utf8");
|
138
|
+
m = m.replace(/styled\([^"'`{,]+,/g, "styled('div',");
|
139
|
+
const g = o(a, "js", s + ".js"), $ = Q(t), n = await X(t);
|
140
|
+
await q.build({
|
141
|
+
stdin: {
|
142
|
+
contents: m,
|
143
|
+
sourcefile: l.base,
|
144
|
+
resolveDir: l.dir,
|
145
|
+
loader: "tsx"
|
146
|
+
},
|
147
|
+
minify: !1,
|
148
|
+
treeShaking: !0,
|
149
|
+
bundle: !0,
|
150
|
+
outfile: g,
|
151
|
+
format: n,
|
152
|
+
target: ["node20"],
|
153
|
+
keepNames: !0,
|
154
|
+
external: $,
|
155
|
+
packages: "external"
|
156
|
+
});
|
157
|
+
const F = Date.now();
|
158
|
+
return await import(`${g}?t=${F}`);
|
159
|
+
}, K = async (t) => {
|
160
|
+
const e = R(t), a = o(e, "salty.config.js"), { config: s } = await import(a);
|
161
|
+
return s;
|
162
|
+
}, tt = () => {
|
163
|
+
try {
|
164
|
+
return process.env.NODE_ENV === "production";
|
165
|
+
} catch {
|
166
|
+
return !1;
|
167
|
+
}
|
168
|
+
}, Tt = async (t, e = tt()) => {
|
169
|
+
try {
|
170
|
+
e ? B.info("Generating CSS in production mode! 🔥") : B.info("Generating CSS in development mode! 🚀");
|
171
|
+
const a = [], s = [], r = R(t), l = o(r, "index.css");
|
172
|
+
(() => {
|
173
|
+
I(r) && et("rm -rf " + r), O(r), O(o(r, "css")), O(o(r, "types"));
|
174
|
+
})(), await bt(t);
|
175
|
+
const g = await K(t);
|
176
|
+
async function $(i, h) {
|
177
|
+
const k = ["node_modules", "saltygen"], x = nt(i);
|
178
|
+
if (x.isDirectory()) {
|
179
|
+
const j = ot(i);
|
180
|
+
if (k.some((d) => i.includes(d))) return;
|
181
|
+
await Promise.all(j.map((d) => $(o(i, d), o(h, d))));
|
182
|
+
} else if (x.isFile() && Z(i)) {
|
183
|
+
const T = await _(t, i, r), d = [];
|
184
|
+
Object.entries(T).forEach(([f, c]) => {
|
185
|
+
if (c.isKeyframes && c.css) {
|
186
|
+
const M = `${c.animationName}.css`, N = `css/${M}`, W = o(r, N);
|
187
|
+
a.push(M), b(W, c.css);
|
188
|
+
return;
|
189
|
+
}
|
190
|
+
if (!c.generator) return;
|
191
|
+
const u = c.generator._withBuildContext({
|
192
|
+
name: f,
|
193
|
+
config: g,
|
194
|
+
prod: e
|
195
|
+
}), p = `${u.hash}-${u.priority}.css`;
|
196
|
+
s[u.priority] || (s[u.priority] = []), s[u.priority].push(p), d.push(p);
|
197
|
+
const C = `css/${p}`, V = o(r, C);
|
198
|
+
b(V, u.css);
|
199
|
+
});
|
200
|
+
const P = d.map((f) => `@import url('./${f}');`).join(`
|
201
|
+
`), D = H(i, 6), E = o(r, `css/${D}.css`);
|
202
|
+
b(E, P);
|
203
|
+
}
|
204
|
+
}
|
205
|
+
await $(t, r);
|
206
|
+
const n = a.map((i) => `@import url('./css/${i}');`).join(`
|
207
|
+
`);
|
208
|
+
let w = `@layer reset, global, l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
209
|
+
|
210
|
+
${["variables.css", "reset.css", "global.css", "templates.css"].filter((i) => {
|
211
|
+
try {
|
212
|
+
return J(o(r, "css", i), "utf8").length > 0;
|
213
|
+
} catch {
|
214
|
+
return !1;
|
215
|
+
}
|
216
|
+
}).map((i) => `@import url('./css/${i}');`).join(`
|
217
|
+
`)}
|
218
|
+
${n}`;
|
219
|
+
if (g.importStrategy !== "component") {
|
220
|
+
const i = s.flat().map((h) => `@import url('./css/${h}');`).join(`
|
221
|
+
`);
|
222
|
+
w += i;
|
223
|
+
}
|
224
|
+
b(l, w);
|
225
|
+
} catch (a) {
|
226
|
+
console.error(a);
|
227
|
+
}
|
228
|
+
}, Pt = async (t, e) => {
|
229
|
+
try {
|
230
|
+
const a = [], s = o(t, "./saltygen"), r = o(s, "index.css");
|
231
|
+
if (Z(e)) {
|
232
|
+
const m = await K(t), g = await _(t, e, s);
|
233
|
+
Object.entries(g).forEach(([S, w]) => {
|
234
|
+
if (!w.generator) return;
|
235
|
+
const i = w.generator._withBuildContext({
|
236
|
+
name: S,
|
237
|
+
config: m
|
238
|
+
}), h = `${i.hash}-${i.priority}.css`, k = `css/${h}`, x = o(s, k);
|
239
|
+
a.push(h), b(x, i.css);
|
240
|
+
});
|
241
|
+
const $ = J(r, "utf8").split(`
|
242
|
+
`), n = a.map((S) => `@import url('../saltygen/css/${S}');`), y = [.../* @__PURE__ */ new Set([...$, ...n])].join(`
|
243
|
+
`);
|
244
|
+
b(r, y);
|
245
|
+
}
|
246
|
+
} catch (a) {
|
247
|
+
console.error(a);
|
248
|
+
}
|
249
|
+
}, Dt = async (t, e, a = tt()) => {
|
250
|
+
try {
|
251
|
+
const s = o(t, "./saltygen");
|
252
|
+
if (Z(e)) {
|
253
|
+
const l = J(e, "utf8");
|
254
|
+
l.replace(/^(?!export\s)const\s.*/gm, (y) => `export ${y}`) !== l && await at(e, l);
|
255
|
+
const g = await K(t), $ = await _(t, e, s);
|
256
|
+
let n = l;
|
257
|
+
Object.entries($).forEach(([y, S]) => {
|
258
|
+
var p;
|
259
|
+
if (S.isKeyframes || !S.generator) return;
|
260
|
+
const w = S.generator._withBuildContext({
|
261
|
+
name: y,
|
262
|
+
config: g,
|
263
|
+
prod: a
|
264
|
+
}), i = new RegExp(`\\s${y}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(l);
|
265
|
+
if (!i) return console.error("Could not find the original declaration");
|
266
|
+
const h = (p = i.at(1)) == null ? void 0 : p.trim(), k = new RegExp(`\\s${y}[=\\s]+styled\\(`, "g").exec(n);
|
267
|
+
if (!k) return console.error("Could not find the original declaration");
|
268
|
+
const { index: x } = k;
|
269
|
+
let j = !1;
|
270
|
+
const T = setTimeout(() => j = !0, 5e3);
|
271
|
+
let d = 0, P = !1, D = 0;
|
272
|
+
for (; !P && !j; ) {
|
273
|
+
const C = n[x + d];
|
274
|
+
C === "(" && D++, C === ")" && D--, D === 0 && C === ")" && (P = !0), d > n.length && (j = !0), d++;
|
275
|
+
}
|
276
|
+
if (!j) clearTimeout(T);
|
277
|
+
else throw new Error("Failed to find the end of the styled call and timed out");
|
278
|
+
const E = x + d, f = n.slice(x, E), c = n, u = ` ${y} = styled(${h}, "${w.classNames}", ${JSON.stringify(w.props)});`;
|
279
|
+
n = n.replace(f, u), c === n && console.error("Minimize file failed to change content", { name: y, tagName: h });
|
280
|
+
});
|
281
|
+
const F = H(e, 6);
|
282
|
+
return g.importStrategy === "component" && (n = `import '../../saltygen/css/${F}.css';
|
283
|
+
${n}`), n = n.replace("{ styled }", "{ styledClient as styled }"), n = n.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), n;
|
284
|
+
}
|
285
|
+
} catch (s) {
|
286
|
+
console.error("Error in minimizeFile:", s);
|
287
|
+
}
|
288
|
+
};
|
289
|
+
export {
|
290
|
+
Ft as a,
|
291
|
+
mt as b,
|
292
|
+
bt as c,
|
293
|
+
_ as d,
|
294
|
+
Pt as e,
|
295
|
+
Tt as g,
|
296
|
+
Z as i,
|
297
|
+
B as l,
|
298
|
+
Dt as m,
|
299
|
+
yt as s
|
300
|
+
};
|
@@ -0,0 +1,21 @@
|
|
1
|
+
"use strict";const se=require("esbuild"),ne=require("child_process"),_=require("./dash-case-BJEkFEGQ.cjs"),o=require("path"),c=require("fs"),Z=require("fs/promises"),V=require("./parse-templates-DIOn-gO_.cjs"),R=require("winston");var I=typeof document<"u"?document.currentScript:null;function oe(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const s in e)if(s!=="default"){const n=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,n.get?n:{enumerable:!0,get:()=>e[s]})}}return t.default=e,Object.freeze(t)}const K=oe(se),L=e=>{if(!e||e==="/")throw new Error("Could not find package.json file");const t=o.join(e,"package.json");return c.existsSync(t)?t:L(o.join(e,".."))},re=async e=>{const t=L(e);return await Z.readFile(t,"utf-8").then(JSON.parse).catch(()=>{})},ie=async e=>{const t=await re(e);if(t)return t.type};let E;const U=async e=>{if(E)return E;const t=await ie(e);return t==="module"?E="esm":(t==="commonjs"||(typeof document>"u"?require("url").pathToFileURL(__filename).href:I&&I.tagName.toUpperCase()==="SCRIPT"&&I.src||new URL("index-mhoDzsNb.cjs",document.baseURI).href).endsWith(".cjs"))&&(E="cjs"),E||"esm"},J=R.createLogger({level:"debug",format:R.format.combine(R.format.colorize(),R.format.cli()),transports:[new R.transports.Console({})]}),ce=e=>{J.error(e)};function G(e){return e?typeof e!="string"?G(String(e)):e.replace(/[\s-]/g,".").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g,(t,s)=>(s>0?".":"")+t.toLowerCase()):""}const ae={"*, *::before, *::after":{boxSizing:"border-box"},"*":{margin:0},html:{lineHeight:1.15,textSizeAdjust:"100%",WebkitFontSmoothing:"antialiased"},"img, picture, video, canvas, svg":{display:"block",maxWidth:"100%"},"p, h1, h2, h3, h4, h5, h6":{overflowWrap:"break-word"},p:{textWrap:"pretty"},"h1, h2, h3, h4, h5, h6":{textWrap:"balance"},button:{lineHeight:"1em"},"input, optgroup, select, textarea":{fontFamily:"inherit",fontSize:"100%",lineHeight:"1.15em"}},A={externalModules:[]},X=e=>{if(A.externalModules.length>0)return A.externalModules;const t=o.join(e,"salty.config.ts"),n=c.readFileSync(t,"utf8").match(/externalModules:\s?\[(.*)\]/);if(!n)return[];const i=n[1].split(",").map(p=>p.replace(/['"`]/g,"").trim());return A.externalModules=i,i},q=e=>o.join(e,"./saltygen"),Y=["salty","css","styles","styled"],Q=(e=[])=>new RegExp(`\\.(${[...Y,...e].join("|")})\\.`),z=(e,t=[])=>Q(t).test(e),le=async e=>{const t=q(e),s=o.join(e,"salty.config.ts"),n=o.join(t,"salty.config.js"),i=await U(e),p=X(e);await K.build({entryPoints:[s],minify:!0,treeShaking:!0,bundle:!0,outfile:n,format:i,external:p});const h=Date.now(),{config:g}=await import(`${n}?t=${h}`);return g},ee=async e=>{const t=await le(e),s=new Set,n=(f,l=[])=>f?Object.entries(f).flatMap(([d,u])=>{if(!u)return;if(typeof u=="object")return n(u,[...l,d]);const x=G(d),N=_.dashCase(d),v=[...l,x].join(".");s.add(`"${v}"`);const O=[...l.map(_.dashCase),N].join("-"),{result:H}=V.parseValueTokens(u);return`--${O}: ${H};`}):[],i=f=>f?Object.entries(f).flatMap(([l,d])=>{const u=n(d);return l==="base"?u.join(""):`${l} { ${u.join("")} }`}):[],p=f=>f?Object.entries(f).flatMap(([l,d])=>Object.entries(d).flatMap(([u,x])=>{const N=n(x,[l]),v=`.${l}-${u}, [data-${l}="${u}"]`,O=N.join("");return`${v} { ${O} }`})):[],h=n(t.variables),g=i(t.responsiveVariables),b=p(t.conditionalVariables),r=q(e),k=o.join(r,"css/variables.css"),m=`:root { ${h.join("")} ${g.join("")} } ${b.join("")}`;c.writeFileSync(k,m);const j=o.join(r,"css/global.css"),w=V.parseStyles(t.global,"");c.writeFileSync(j,`@layer global { ${w} }`);const a=o.join(r,"css/reset.css"),C=t.reset==="none"?{}:typeof t.reset=="object"?t.reset:ae,F=V.parseStyles(C,"");c.writeFileSync(a,`@layer reset { ${F} }`);const $=o.join(r,"css/templates.css"),T=V.parseTemplates(t.templates),y=V.getTemplateTypes(t.templates);c.writeFileSync($,T);const P=o.join(r,"types/css-tokens.d.ts"),M=`
|
2
|
+
// Variable types
|
3
|
+
type VariableTokens = ${[...s].join("|")};
|
4
|
+
type PropertyValueToken = \`{\${VariableTokens}}\`;
|
5
|
+
|
6
|
+
// Template types
|
7
|
+
type TemplateTokens = {
|
8
|
+
${Object.entries(y).map(([f,l])=>`${f}?: ${l}`).join(`
|
9
|
+
`)}
|
10
|
+
}
|
11
|
+
`;c.writeFileSync(P,M)},W=async(e,t,s)=>{const n=_.toHash(t),i=o.join(s,"./temp");c.existsSync(i)||c.mkdirSync(i);const p=o.parse(t);let h=c.readFileSync(t,"utf8");h=h.replace(/styled\([^"'`{,]+,/g,"styled('div',");const g=o.join(s,"js",n+".js"),b=X(e),r=await U(e);await K.build({stdin:{contents:h,sourcefile:p.base,resolveDir:p.dir,loader:"tsx"},minify:!1,treeShaking:!0,bundle:!0,outfile:g,format:r,target:["node20"],keepNames:!0,external:b,packages:"external"});const k=Date.now();return await import(`${g}?t=${k}`)},B=async e=>{const t=q(e),s=o.join(t,"salty.config.js"),{config:n}=await import(s);return n},te=()=>{try{return process.env.NODE_ENV==="production"}catch{return!1}},pe=async(e,t=te())=>{try{t?J.info("Generating CSS in production mode! 🔥"):J.info("Generating CSS in development mode! 🚀");const s=[],n=[],i=q(e),p=o.join(i,"index.css");(()=>{c.existsSync(i)&&ne.execSync("rm -rf "+i),c.mkdirSync(i),c.mkdirSync(o.join(i,"css")),c.mkdirSync(o.join(i,"types"))})(),await ee(e);const g=await B(e);async function b(a,S){const C=["node_modules","saltygen"],F=c.statSync(a);if(F.isDirectory()){const $=c.readdirSync(a);if(C.some(y=>a.includes(y)))return;await Promise.all($.map(y=>b(o.join(a,y),o.join(S,y))))}else if(F.isFile()&&z(a)){const T=await W(e,a,i),y=[];Object.entries(T).forEach(([f,l])=>{if(l.isKeyframes&&l.css){const v=`${l.animationName}.css`,O=`css/${v}`,H=o.join(i,O);s.push(v),c.writeFileSync(H,l.css);return}if(!l.generator)return;const d=l.generator._withBuildContext({name:f,config:g,prod:t}),u=`${d.hash}-${d.priority}.css`;n[d.priority]||(n[d.priority]=[]),n[d.priority].push(u),y.push(u);const x=`css/${u}`,N=o.join(i,x);c.writeFileSync(N,d.css)});const P=y.map(f=>`@import url('./${f}');`).join(`
|
12
|
+
`),D=_.toHash(a,6),M=o.join(i,`css/${D}.css`);c.writeFileSync(M,P)}}await b(e,i);const r=s.map(a=>`@import url('./css/${a}');`).join(`
|
13
|
+
`);let w=`@layer reset, global, l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
14
|
+
|
15
|
+
${["variables.css","reset.css","global.css","templates.css"].filter(a=>{try{return c.readFileSync(o.join(i,"css",a),"utf8").length>0}catch{return!1}}).map(a=>`@import url('./css/${a}');`).join(`
|
16
|
+
`)}
|
17
|
+
${r}`;if(g.importStrategy!=="component"){const a=n.flat().map(S=>`@import url('./css/${S}');`).join(`
|
18
|
+
`);w+=a}c.writeFileSync(p,w)}catch(s){console.error(s)}},ue=async(e,t)=>{try{const s=[],n=o.join(e,"./saltygen"),i=o.join(n,"index.css");if(z(t)){const h=await B(e),g=await W(e,t,n);Object.entries(g).forEach(([j,w])=>{if(!w.generator)return;const a=w.generator._withBuildContext({name:j,config:h}),S=`${a.hash}-${a.priority}.css`,C=`css/${S}`,F=o.join(n,C);s.push(S),c.writeFileSync(F,a.css)});const b=c.readFileSync(i,"utf8").split(`
|
19
|
+
`),r=s.map(j=>`@import url('../saltygen/css/${j}');`),m=[...new Set([...b,...r])].join(`
|
20
|
+
`);c.writeFileSync(i,m)}}catch(s){console.error(s)}},fe=async(e,t,s=te())=>{try{const n=o.join(e,"./saltygen");if(z(t)){const p=c.readFileSync(t,"utf8");p.replace(/^(?!export\s)const\s.*/gm,m=>`export ${m}`)!==p&&await Z.writeFile(t,p);const g=await B(e),b=await W(e,t,n);let r=p;Object.entries(b).forEach(([m,j])=>{var u;if(j.isKeyframes||!j.generator)return;const w=j.generator._withBuildContext({name:m,config:g,prod:s}),a=new RegExp(`\\s${m}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(p);if(!a)return console.error("Could not find the original declaration");const S=(u=a.at(1))==null?void 0:u.trim(),C=new RegExp(`\\s${m}[=\\s]+styled\\(`,"g").exec(r);if(!C)return console.error("Could not find the original declaration");const{index:F}=C;let $=!1;const T=setTimeout(()=>$=!0,5e3);let y=0,P=!1,D=0;for(;!P&&!$;){const x=r[F+y];x==="("&&D++,x===")"&&D--,D===0&&x===")"&&(P=!0),y>r.length&&($=!0),y++}if(!$)clearTimeout(T);else throw new Error("Failed to find the end of the styled call and timed out");const M=F+y,f=r.slice(F,M),l=r,d=` ${m} = styled(${S}, "${w.classNames}", ${JSON.stringify(w.props)});`;r=r.replace(f,d),l===r&&console.error("Minimize file failed to change content",{name:m,tagName:S})});const k=_.toHash(t,6);return g.importStrategy==="component"&&(r=`import '../../saltygen/css/${k}.css';
|
21
|
+
${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=W;exports.generateConfigStyles=ee;exports.generateCss=pe;exports.generateFile=ue;exports.isSaltyFile=z;exports.logError=ce;exports.logger=J;exports.minimizeFile=fe;exports.saltyFileExtensions=Y;exports.saltyFileRegExp=Q;
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@salty-css/core",
|
3
|
-
"version": "0.0.1-alpha.
|
3
|
+
"version": "0.0.1-alpha.120",
|
4
4
|
"main": "./dist/index.js",
|
5
5
|
"module": "./dist/index.mjs",
|
6
6
|
"typings": "./dist/index.d.ts",
|
@@ -10,7 +10,12 @@
|
|
10
10
|
"publishConfig": {
|
11
11
|
"access": "public"
|
12
12
|
},
|
13
|
-
"
|
13
|
+
"description": "Core library for Salty CSS. Will be used by other Salty CSS libraries and plugins.",
|
14
|
+
"homepage": "https://salty-css.dev/",
|
15
|
+
"repository": {
|
16
|
+
"type": "git",
|
17
|
+
"url": "git+https://github.com/margarita-form/salty-css.git"
|
18
|
+
},
|
14
19
|
"bugs": {
|
15
20
|
"url": "https://github.com/margarita-form/salty-css/issues"
|
16
21
|
},
|
@@ -23,11 +28,18 @@
|
|
23
28
|
"name": "core"
|
24
29
|
},
|
25
30
|
"peerDependencies": {
|
31
|
+
"commander": ">=12.x",
|
32
|
+
"ejs": ">=3.x",
|
26
33
|
"esbuild": ">=0.21.x",
|
34
|
+
"ora": ">=8.x",
|
27
35
|
"react": ">=18.x || >=19.x",
|
28
36
|
"winston": ">=3.x"
|
29
37
|
},
|
30
38
|
"exports": {
|
39
|
+
"./bin/main": {
|
40
|
+
"import": "./bin/main.js",
|
41
|
+
"require": "./bin/main.cjs"
|
42
|
+
},
|
31
43
|
"./compiler": {
|
32
44
|
"import": "./compiler/index.js",
|
33
45
|
"require": "./compiler/index.cjs"
|
@@ -52,5 +64,11 @@
|
|
52
64
|
"import": "./util/index.js",
|
53
65
|
"require": "./util/index.cjs"
|
54
66
|
}
|
67
|
+
},
|
68
|
+
"bin": {
|
69
|
+
"salty": "./bin/index.js",
|
70
|
+
"salty-css": "./bin/index.js",
|
71
|
+
"salty-css-cjs": "./bin/index.cjs",
|
72
|
+
"@salty-css/core": "./bin/index.js"
|
55
73
|
}
|
56
74
|
}
|
@@ -0,0 +1,100 @@
|
|
1
|
+
import { d as O } from "./dash-case-DBThphLm.js";
|
2
|
+
const N = (t, e) => {
|
3
|
+
if (typeof t != "string") return { result: t };
|
4
|
+
if (!e) return { result: t };
|
5
|
+
const s = [];
|
6
|
+
return Object.values(e).forEach((n) => {
|
7
|
+
const { pattern: o, transform: i } = n;
|
8
|
+
t = t.replace(o, (d) => {
|
9
|
+
const { value: c, css: j } = i(d);
|
10
|
+
return j && s.push(j), c;
|
11
|
+
});
|
12
|
+
}), { result: t, additionalCss: s };
|
13
|
+
}, P = (t) => typeof t != "string" ? { result: t } : /\{[^{}]+\}/g.test(t) ? { result: t.replace(/\{([^{}]+)\}/g, (...n) => `var(--${O(n[1].replaceAll(".", "-"))})`) } : { result: t }, a = (t, e, s, n) => {
|
14
|
+
if (!t) return "";
|
15
|
+
const o = [], i = Object.entries(t).reduce((c, [j, r]) => {
|
16
|
+
const f = j.trim();
|
17
|
+
if (typeof r == "function" && (r = r()), typeof r == "object") {
|
18
|
+
if (!r) return c;
|
19
|
+
if (f === "variants")
|
20
|
+
return Object.entries(r).forEach(([p, u]) => {
|
21
|
+
u && Object.entries(u).forEach(([m, b]) => {
|
22
|
+
if (!b) return;
|
23
|
+
const y = `${e}.${p}-${m}`, l = a(b, y, s);
|
24
|
+
o.push(l);
|
25
|
+
});
|
26
|
+
}), c;
|
27
|
+
if (f === "defaultVariants")
|
28
|
+
return c;
|
29
|
+
if (f === "compoundVariants")
|
30
|
+
return r.forEach((p) => {
|
31
|
+
const { css: u, ...m } = p, b = Object.entries(m).reduce((l, [w, W]) => `${l}.${w}-${W}`, e), y = a(u, b, s);
|
32
|
+
o.push(y);
|
33
|
+
}), c;
|
34
|
+
if (f.startsWith("@")) {
|
35
|
+
const p = a(r, e, s), u = `${f} {
|
36
|
+
${p.replace(`
|
37
|
+
`, `
|
38
|
+
`)}
|
39
|
+
}`;
|
40
|
+
return o.push(u), c;
|
41
|
+
}
|
42
|
+
const $ = j.includes("&") ? f.replace("&", e) : f.startsWith(":") ? `${e}${f}` : `${e} ${f}`, h = a(r, $, s);
|
43
|
+
return o.push(h), c;
|
44
|
+
}
|
45
|
+
if (n != null && n.templates && n.templates[f]) {
|
46
|
+
const h = r.split(".").reduce((p, u) => p[u], n.templates[f]);
|
47
|
+
if (h) {
|
48
|
+
const p = a(h, "");
|
49
|
+
return `${c}${p}`;
|
50
|
+
}
|
51
|
+
return console.warn(`Template "${f}" with path of "${r}" was not found in config!`), c;
|
52
|
+
}
|
53
|
+
const S = f.startsWith("-") ? f : O(f), g = ($, h = ";") => c = `${c}${$}${h}`, T = ($) => g(`${S}:${$}`);
|
54
|
+
if (typeof r == "number") return T(r);
|
55
|
+
if (typeof r != "string")
|
56
|
+
if ("toString" in r) r = r.toString();
|
57
|
+
else return c;
|
58
|
+
const { modifiers: V } = n || {}, k = function* () {
|
59
|
+
yield P(r), yield N(r, V);
|
60
|
+
}();
|
61
|
+
for (const { result: $, additionalCss: h = [] } of k)
|
62
|
+
r = $, h.forEach((p) => {
|
63
|
+
const u = a(p, "");
|
64
|
+
g(u, "");
|
65
|
+
});
|
66
|
+
return T(r);
|
67
|
+
}, "");
|
68
|
+
if (!i) return o.join(`
|
69
|
+
`);
|
70
|
+
if (!e) return i;
|
71
|
+
let d = "";
|
72
|
+
return s !== void 0 ? d = `@layer l${s} { ${e} { ${i} } }` : d = `${e} { ${i} }`, [d, ...o].join(`
|
73
|
+
`);
|
74
|
+
}, _ = (t, e = []) => {
|
75
|
+
if (!t) return "";
|
76
|
+
const s = [], n = {};
|
77
|
+
if (Object.entries(t).forEach(([o, i]) => {
|
78
|
+
if (typeof i == "object") {
|
79
|
+
if (!i) return;
|
80
|
+
const d = o.trim(), c = _(i, [...e, d]);
|
81
|
+
s.push(c);
|
82
|
+
} else
|
83
|
+
n[o] = i;
|
84
|
+
}), Object.keys(n).length) {
|
85
|
+
const o = e.map(O).join("-"), i = a(n, `.${o}`);
|
86
|
+
s.push(i);
|
87
|
+
}
|
88
|
+
return s.join(`
|
89
|
+
`);
|
90
|
+
}, A = (t) => Object.keys(t), K = (t) => Object.entries(t).reduce((e, [s, n]) => (typeof n == "object" && (e[s] = E(n).map((o) => `"${o}"`).join(" | ")), e), {}), E = (t, e = "", s = /* @__PURE__ */ new Set()) => t ? (Object.entries(t).forEach(([n, o]) => {
|
91
|
+
const i = e ? `${e}.${n}` : n;
|
92
|
+
return typeof o == "object" ? E(o, i, s) : s.add(e);
|
93
|
+
}), [...s]) : [];
|
94
|
+
export {
|
95
|
+
_ as a,
|
96
|
+
K as b,
|
97
|
+
P as c,
|
98
|
+
A as g,
|
99
|
+
a as p
|
100
|
+
};
|
@@ -0,0 +1,8 @@
|
|
1
|
+
"use strict";const T=require("./dash-case-BJEkFEGQ.cjs"),N=(t,e)=>{if(typeof t!="string")return{result:t};if(!e)return{result:t};const r=[];return Object.values(e).forEach(n=>{const{pattern:o,transform:i}=n;t=t.replace(o,d=>{const{value:c,css:j}=i(d);return j&&r.push(j),c})}),{result:t,additionalCss:r}},S=t=>typeof t!="string"?{result:t}:/\{[^{}]+\}/g.test(t)?{result:t.replace(/\{([^{}]+)\}/g,(...n)=>`var(--${T.dashCase(n[1].replaceAll(".","-"))})`)}:{result:t},a=(t,e,r,n)=>{if(!t)return"";const o=[],i=Object.entries(t).reduce((c,[j,s])=>{const p=j.trim();if(typeof s=="function"&&(s=s()),typeof s=="object"){if(!s)return c;if(p==="variants")return Object.entries(s).forEach(([f,u])=>{u&&Object.entries(u).forEach(([l,m])=>{if(!m)return;const y=`${e}.${f}-${l}`,b=a(m,y,r);o.push(b)})}),c;if(p==="defaultVariants")return c;if(p==="compoundVariants")return s.forEach(f=>{const{css:u,...l}=f,m=Object.entries(l).reduce((b,[q,K])=>`${b}.${q}-${K}`,e),y=a(u,m,r);o.push(y)}),c;if(p.startsWith("@")){const f=a(s,e,r),u=`${p} {
|
2
|
+
${f.replace(`
|
3
|
+
`,`
|
4
|
+
`)}
|
5
|
+
}`;return o.push(u),c}const $=j.includes("&")?p.replace("&",e):p.startsWith(":")?`${e}${p}`:`${e} ${p}`,h=a(s,$,r);return o.push(h),c}if(n!=null&&n.templates&&n.templates[p]){const h=s.split(".").reduce((f,u)=>f[u],n.templates[p]);if(h){const f=a(h,"");return`${c}${f}`}return console.warn(`Template "${p}" with path of "${s}" was not found in config!`),c}const k=p.startsWith("-")?p:T.dashCase(p),O=($,h=";")=>c=`${c}${$}${h}`,g=$=>O(`${k}:${$}`);if(typeof s=="number")return g(s);if(typeof s!="string")if("toString"in s)s=s.toString();else return c;const{modifiers:w}=n||{},W=function*(){yield S(s),yield N(s,w)}();for(const{result:$,additionalCss:h=[]}of W)s=$,h.forEach(f=>{const u=a(f,"");O(u,"")});return g(s)},"");if(!i)return o.join(`
|
6
|
+
`);if(!e)return i;let d="";return r!==void 0?d=`@layer l${r} { ${e} { ${i} } }`:d=`${e} { ${i} }`,[d,...o].join(`
|
7
|
+
`)},E=(t,e=[])=>{if(!t)return"";const r=[],n={};if(Object.entries(t).forEach(([o,i])=>{if(typeof i=="object"){if(!i)return;const d=o.trim(),c=E(i,[...e,d]);r.push(c)}else n[o]=i}),Object.keys(n).length){const o=e.map(T.dashCase).join("-"),i=a(n,`.${o}`);r.push(i)}return r.join(`
|
8
|
+
`)},P=t=>Object.keys(t),_=t=>Object.entries(t).reduce((e,[r,n])=>(typeof n=="object"&&(e[r]=V(n).map(o=>`"${o}"`).join(" | ")),e),{}),V=(t,e="",r=new Set)=>t?(Object.entries(t).forEach(([n,o])=>{const i=e?`${e}.${n}`:n;return typeof o=="object"?V(o,i,r):r.add(e)}),[...r]):[];exports.getTemplateKeys=P;exports.getTemplateTypes=_;exports.parseStyles=a;exports.parseTemplates=E;exports.parseValueTokens=S;
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";function r(e){return e?typeof e!="string"?r(String(e)):e.replace(/\s/g,"-").replace(/[-_]([a-z0-9])/g,a=>a[1].toUpperCase()).replace(/^[a-z]/,a=>a.toUpperCase()):""}exports.pascalCase=r;
|
@@ -0,0 +1,8 @@
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=`import { styled } from "@salty-css/react/styled";
|
2
|
+
|
3
|
+
export const <%- name %> = styled('<%- tag %>', {
|
4
|
+
<% if(className) { %>className: '<%- className %>',<% } %>
|
5
|
+
base: {
|
6
|
+
// Add your styles here
|
7
|
+
}
|
8
|
+
})`;exports.default=e;
|
@@ -0,0 +1,18 @@
|
|
1
|
+
const n = `import { <%- styledComponentName %> } from "./<%- fileName %>.css";
|
2
|
+
|
3
|
+
interface <%- componentName %>Props {
|
4
|
+
text?: string;
|
5
|
+
}
|
6
|
+
|
7
|
+
export const <%- componentName %> = ({ text = 'Lorem ipsum' }: <%- componentName %>Props) => {
|
8
|
+
return (
|
9
|
+
<<%- styledComponentName %>>
|
10
|
+
{text}
|
11
|
+
</<%- styledComponentName %>>
|
12
|
+
);
|
13
|
+
};
|
14
|
+
|
15
|
+
export default <%- componentName %>;`;
|
16
|
+
export {
|
17
|
+
n as default
|
18
|
+
};
|
@@ -0,0 +1,15 @@
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=`import { <%- styledComponentName %> } from "./<%- fileName %>.css";
|
2
|
+
|
3
|
+
interface <%- componentName %>Props {
|
4
|
+
text?: string;
|
5
|
+
}
|
6
|
+
|
7
|
+
export const <%- componentName %> = ({ text = 'Lorem ipsum' }: <%- componentName %>Props) => {
|
8
|
+
return (
|
9
|
+
<<%- styledComponentName %>>
|
10
|
+
{text}
|
11
|
+
</<%- styledComponentName %>>
|
12
|
+
);
|
13
|
+
};
|
14
|
+
|
15
|
+
export default <%- componentName %>;`;exports.default=e;
|
@@ -0,0 +1,7 @@
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=`import { defineConfig } from '@salty-css/core/config';
|
2
|
+
|
3
|
+
export const config = defineConfig({
|
4
|
+
// Add your custom config here
|
5
|
+
externalModules: ['react', 'react-dom']
|
6
|
+
});
|
7
|
+
`;exports.default=e;
|