@salty-css/vite 0.0.1-alpha.142 → 0.0.1-alpha.144
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/index.cjs +24 -16
- package/index.js +204 -186
- package/package.json +2 -2
package/index.cjs
CHANGED
@@ -1,29 +1,37 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
2
|
-
${
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const pt=require("esbuild"),dt=require("child_process"),c=require("path"),l=require("fs"),X=require("fs/promises"),W=require("winston");var I=typeof document<"u"?document.currentScript:null;function yt(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const s in t)if(s!=="default"){const n=Object.getOwnPropertyDescriptor(t,s);Object.defineProperty(e,s,n.get?n:{enumerable:!0,get:()=>t[s]})}}return e.default=t,Object.freeze(e)}const Y=yt(pt),U=t=>String.fromCharCode(t+(t>25?39:97)),gt=(t,e)=>{let s="",n;for(n=Math.abs(t);n>52;n=n/52|0)s=U(n%52)+s;return s=U(n%52)+s,s.length<e?s=s.padStart(e,"a"):s.length>e&&(s=s.slice(-e)),s},mt=(t,e)=>{let s=e.length;for(;s;)t=t*33^e.charCodeAt(--s);return t},J=(t,e=5)=>{const s=mt(5381,JSON.stringify(t))>>>0;return gt(s,e)};function V(t){return t?typeof t!="string"?V(String(t)):t.replace(/[\s.]/g,"-").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g,(e,s)=>(s>0?"-":"")+e.toLowerCase()):""}const ht=(t,e)=>{if(typeof t!="string")return{result:t};if(!e)return{result:t};const s=[];return Object.values(e).forEach(n=>{const{pattern:i,transform:o}=n;t=t.replace(i,f=>{const{value:g,css:a}=o(f);return a&&s.push(a),g})}),{result:t,additionalCss:s}},Q=t=>typeof t!="string"?{result:t}:/\{[^{}]+\}/g.test(t)?{result:t.replace(/\{([^{}]+)\}/g,(...n)=>`var(--${V(n[1].replaceAll(".","-"))})`)}:{result:t},M=(t,e,s)=>{if(!t)return"";const n=[],i=Object.entries(t).reduce((f,[g,a])=>{const r=g.trim();if(typeof a=="function"&&(a=a()),typeof a=="object"){if(!a)return f;if(r==="variants")return Object.entries(a).forEach(([u,m])=>{m&&Object.entries(m).forEach(([C,w])=>{if(!w)return;const T=`${e}.${u}-${C}`,N=M(w,T);n.push(N)})}),f;if(r==="defaultVariants")return f;if(r==="compoundVariants")return a.forEach(u=>{const{css:m,...C}=u,w=Object.entries(C).reduce((N,[y,$])=>`${N}.${y}-${$}`,e),T=M(m,w);n.push(T)}),f;if(r.startsWith("@")){const u=M(a,e),m=`${r} {
|
2
|
+
${u.replace(`
|
3
3
|
`,`
|
4
4
|
`)}
|
5
|
-
}`;return n.push(
|
5
|
+
}`;return n.push(m),f}const d=g.includes("&")?r.replace("&",e):r.startsWith(":")?`${e}${r}`:`${e} ${r}`,F=M(a,d);return n.push(F),f}const p=r.startsWith("-")?r:V(r),h=(d,F=";")=>f=`${f}${d}${F}`,j=d=>h(`${p}:${d}`);if(typeof a=="number")return j(a);if(typeof a!="string")if("toString"in a)a=a.toString();else return f;const{modifiers:b}={},P=function*(){yield Q(a),yield ht(a,b)}();for(const{result:d,additionalCss:F=[]}of P)a=d,F.forEach(u=>{const m=M(u,"");h(m,"")});return j(a)},"");return i?e?[`${e} { ${i} }`,...n].join(`
|
6
6
|
`):i:n.join(`
|
7
|
-
`)},v=(e
|
8
|
-
`)}
|
7
|
+
`)},v=(t,e=[])=>{if(!t)return"";const s=[],n={};if(Object.entries(t).forEach(([i,o])=>{if(typeof o=="object"){if(!o)return;const f=i.trim(),g=v(o,[...e,f]);s.push(g)}else n[i]=o}),Object.keys(n).length){const i=e.map(V).join("-"),o=M(n,`.${i}`);s.push(o)}return s.join(`
|
8
|
+
`)},$t=t=>Object.entries(t).reduce((e,[s,n])=>(typeof n=="object"&&(e[s]=tt(n).map(i=>`"${i}"`).join(" | ")),e),{}),tt=(t,e="",s=new Set)=>t?(Object.entries(t).forEach(([n,i])=>{const o=e?`${e}.${n}`:n;return typeof i=="object"?tt(i,o,s):s.add(e)}),[...s]):[],et=t=>{if(!t||t==="/")throw new Error("Could not find package.json file");const e=c.join(t,"package.json");return l.existsSync(e)?e:et(c.join(t,".."))},St=async t=>{const e=et(t);return await X.readFile(e,"utf-8").then(JSON.parse).catch(()=>{})},bt=async t=>{const e=await St(t);if(e)return e.type};let A;const st=async t=>{if(A)return A;const e=await bt(t);return e==="module"?A="esm":(e==="commonjs"||(typeof document>"u"?require("url").pathToFileURL(__filename).href:I&&I.tagName.toUpperCase()==="SCRIPT"&&I.src||new URL("index.cjs",document.baseURI).href).endsWith(".cjs"))&&(A="cjs"),A||"esm"},Z=W.createLogger({level:"debug",format:W.format.combine(W.format.colorize(),W.format.cli()),transports:[new W.transports.Console({})]});function nt(t){return t?typeof t!="string"?nt(String(t)):t.replace(/[\s-]/g,".").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g,(e,s)=>(s>0?".":"")+e.toLowerCase()):""}const jt={"*, *::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"},a:{color:"currentColor"},button:{lineHeight:"1em",color:"currentColor"},"input, optgroup, select, textarea":{fontFamily:"inherit",fontSize:"100%",lineHeight:"1.15em"}},q={externalModules:[]},ot=t=>{if(q.externalModules.length>0)return q.externalModules;const e=c.join(t,"salty.config.ts"),n=l.readFileSync(e,"utf8").match(/externalModules:\s?\[(.*)\]/);if(!n)return[];const i=n[1].split(",").map(o=>o.replace(/['"`]/g,"").trim());return q.externalModules=i,i},H=t=>c.join(t,"./saltygen"),rt=["salty","css","styles","styled"],wt=(t=[])=>new RegExp(`\\.(${[...rt,...t].join("|")})\\.`),z=(t,e=[])=>wt(e).test(t),Ft=async t=>{const e=H(t),s=c.join(t,"salty.config.ts"),n=c.join(e,"salty.config.js"),i=await st(t),o=ot(t);await Y.build({entryPoints:[s],minify:!0,treeShaking:!0,bundle:!0,outfile:n,format:i,external:o});const f=Date.now(),{config:g}=await import(`${n}?t=${f}`);return g},Ct=async t=>{const e=await Ft(t),s=new Set,n=(y,$=[])=>y?Object.entries(y).flatMap(([x,S])=>{if(!S)return;if(typeof S=="object")return n(S,[...$,x]);const E=nt(x),R=V(x),_=[...$,E].join(".");s.add(`"${_}"`);const O=[...$.map(V),R].join("-"),{result:D}=Q(S);return`--${O}: ${D};`}):[],i=y=>y?Object.entries(y).flatMap(([$,x])=>{const S=n(x);return $==="base"?S.join(""):`${$} { ${S.join("")} }`}):[],o=y=>y?Object.entries(y).flatMap(([$,x])=>Object.entries(x).flatMap(([S,E])=>{const R=n(E,[$]),_=`.${$}-${S}, [data-${$}="${S}"]`,O=R.join("");return`${_} { ${O} }`})):[],f=n(e.variables),g=i(e.responsiveVariables),a=o(e.conditionalVariables),r=H(t),p=c.join(r,"css/_variables.css"),h=`:root { ${f.join("")} ${g.join("")} } ${a.join("")}`;l.writeFileSync(p,h);const j=c.join(r,"css/_global.css"),b=M(e.global,"");l.writeFileSync(j,`@layer global { ${b} }`);const k=c.join(r,"css/_reset.css"),d=e.reset==="none"?{}:typeof e.reset=="object"?e.reset:jt,F=M(d,"");l.writeFileSync(k,`@layer reset { ${F} }`);const u=c.join(r,"css/_templates.css"),m=v(e.templates),C=$t(e.templates);l.writeFileSync(u,m);const w=c.join(r,"types/css-tokens.d.ts"),N=`
|
9
9
|
// Variable types
|
10
10
|
type VariableTokens = ${[...s].join("|")};
|
11
11
|
type PropertyValueToken = \`{\${VariableTokens}}\`;
|
12
12
|
|
13
13
|
// Template types
|
14
14
|
type TemplateTokens = {
|
15
|
-
${Object.entries(
|
15
|
+
${Object.entries(C).map(([y,$])=>`${y}?: ${$}`).join(`
|
16
16
|
`)}
|
17
17
|
}
|
18
|
-
`;
|
19
|
-
`),
|
20
|
-
`);let
|
18
|
+
`;l.writeFileSync(w,N)},G=t=>t.replace(/styled\(([^"'`{,]+),/g,(e,s)=>{if(/^['"`]/.test(s))return e;const i=new RegExp(`import[^;]*${s}[,\\s{][^;]*from\\s?([^{};]+);`);if(!i.test(t))return e;const f=i.exec(t);if(f){const g=f.at(1);if(rt.some(r=>g==null?void 0:g.includes(r)))return e}return"styled('div',"}),L=async(t,e,s)=>{const n=J(e),i=c.join(s,"./temp");l.existsSync(i)||l.mkdirSync(i);const o=c.parse(e);let f=l.readFileSync(e,"utf8");f=G(f);const g=c.join(s,"js",n+".js"),a=ot(t),r=await st(t);await Y.build({stdin:{contents:f,sourcefile:o.base,resolveDir:o.dir,loader:"tsx"},minify:!1,treeShaking:!0,bundle:!0,outfile:g,format:r,target:["node20"],keepNames:!0,external:a,packages:"external",plugins:[{name:"test",setup:j=>{j.onLoad({filter:/.*\.css|salty|styles|styled\.ts/},b=>{const k=l.readFileSync(b.path,"utf8");return{contents:G(k),loader:"ts"}})}}]});const p=Date.now();return await import(`${g}?t=${p}`)},B=async t=>{const e=H(t),s=c.join(e,"salty.config.js"),n=Date.now(),{config:i}=await import(`${s}?t=${n}`);return i},it=()=>{try{return process.env.NODE_ENV==="production"}catch{return!1}},xt=async(t,e=it())=>{try{const s=Date.now();e?Z.info("Generating CSS in production mode! 🔥"):Z.info("Generating CSS in development mode! 🚀");const n=[],i=[],o=H(t),f=c.join(o,"index.css");(()=>{l.existsSync(o)&&dt.execSync("rm -rf "+o),l.mkdirSync(o),l.mkdirSync(c.join(o,"css")),l.mkdirSync(c.join(o,"types"))})(),await Ct(t);const a=await B(t);async function r(u,m){const C=["node_modules","saltygen"],w=l.statSync(u);if(w.isDirectory()){const T=l.readdirSync(u);if(C.some(y=>u.includes(y)))return;await Promise.all(T.map(y=>r(c.join(u,y),c.join(m,y))))}else if(w.isFile()&&z(u)){const N=await L(t,u,o),y=[];Object.entries(N).forEach(([_,O])=>{if(O.isKeyframes&&O.css){const K=`a_${O.animationName}.css`,ft=`css/${K}`,ut=c.join(o,ft);n.push(K),l.writeFileSync(ut,O.css);return}if(!O.generator)return;const D=O.generator._withBuildContext({name:_,config:a,prod:e});i[D.priority]||(i[D.priority]=[]),i[D.priority].push(D.cssFileName),y.push(D.cssFileName);const at=`css/${D.cssFileName}`,lt=c.join(o,at);l.writeFileSync(lt,D.css)});const $=y.map(_=>`@import url('./${_}');`).join(`
|
19
|
+
`),x=J(u,6),S=c.parse(u),E=V(S.name),R=c.join(o,`css/f_${E}-${x}.css`);l.writeFileSync(R,$)}}await r(t,o);const p=n.map(u=>`@import url('./css/${u}');`).join(`
|
20
|
+
`);let k=`@layer reset, global, l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
21
21
|
|
22
|
-
${["_variables.css","_reset.css","_global.css","_templates.css"].filter(
|
22
|
+
${["_variables.css","_reset.css","_global.css","_templates.css"].filter(u=>{try{return l.readFileSync(c.join(o,"css",u),"utf8").length>0}catch{return!1}}).map(u=>`@import url('./css/${u}');`).join(`
|
23
23
|
`)}
|
24
|
-
${
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
`
|
29
|
-
|
24
|
+
${p}`;if(a.importStrategy!=="component"){const u=i.reduce((m,C,w)=>{const T=C.reduce((x,S)=>{const E=c.join(o,"css",S),R=l.readFileSync(E,"utf8"),_=J(E,6);return`${x}
|
25
|
+
/*start:${_}*/
|
26
|
+
${R}
|
27
|
+
/*end:${_}*/
|
28
|
+
`},""),N=`l_${w}.css`,y=c.join(o,"css",N),$=`@layer l${w} { ${T}
|
29
|
+
}`;return l.writeFileSync(y,$),`${m}
|
30
|
+
@import url('./css/${N}');`},"");k+=u}l.writeFileSync(f,k);const d=Date.now()-s,F=d<200?"🔥":d<500?"🚀":d<1e3?"🎉":d<2e3?"🚗":d<5e3?"🤔":"🥴";Z.info(`Generated CSS in ${d}ms! ${F}`)}catch(s){console.error(s)}},kt=async(t,e)=>{try{const s=c.join(t,"./saltygen"),n=c.join(s,"index.css");if(z(e)){const o=[],f=await B(t),g=await L(t,e,s);Object.entries(g).forEach(([r,p])=>{if(p.isKeyframes&&p.css){const P=`css/${`a_${p.animationName}.css`}`,d=c.join(s,P);l.writeFileSync(d,p.css);return}if(!p.generator)return;const h=p.generator._withBuildContext({name:r,config:f}),j=`css/${h.cssFileName}`,b=c.join(s,j);l.writeFileSync(b,h.css),o[h.priority]||(o[h.priority]=[]),o[h.priority].push(h.cssFileName)});const a=l.readFileSync(n,"utf8").split(`
|
31
|
+
`);f.importStrategy!=="component"&&o.forEach((r,p)=>{const h=`l_${p}.css`,j=c.join(s,"css",h);let b=l.readFileSync(j,"utf8");r.forEach(k=>{const P=c.join(s,"css",k),d=J(P,6);if(!b.includes(d)){const u=l.readFileSync(P,"utf8"),m=J(P,6),C=`/*start:${m}*/
|
32
|
+
${u}
|
33
|
+
/*end:${m}*/
|
34
|
+
`;b=`${b.replace(/\}$/,"")}
|
35
|
+
${C}
|
36
|
+
}`}}),l.writeFileSync(j,b)})}}catch(s){console.error(s)}},Pt=async(t,e,s=it())=>{try{const n=c.join(t,"./saltygen");if(z(e)){const o=l.readFileSync(e,"utf8");o.replace(/^(?!export\s)const\s.*/gm,p=>`export ${p}`)!==o&&await X.writeFile(e,o);const g=await B(t),a=await L(t,e,n);let r=o;if(Object.entries(a).forEach(([p,h])=>{var x;if(h.isKeyframes||!h.generator)return;const j=h.generator._withBuildContext({name:p,config:g,prod:s}),b=new RegExp(`\\s${p}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(o);if(!b)return console.error("Could not find the original declaration");const k=(x=b.at(1))==null?void 0:x.trim(),P=new RegExp(`\\s${p}[=\\s]+styled\\(`,"g").exec(r);if(!P)return console.error("Could not find the original declaration");const{index:d}=P;let F=!1;const u=setTimeout(()=>F=!0,5e3);let m=0,C=!1,w=0;for(;!C&&!F;){const S=r[d+m];S==="("&&w++,S===")"&&w--,w===0&&S===")"&&(C=!0),m>r.length&&(F=!0),m++}if(!F)clearTimeout(u);else throw new Error("Failed to find the end of the styled call and timed out");const T=d+m,N=r.slice(d,T),y=r,$=` ${p} = styled(${k}, "${j.classNames}", ${JSON.stringify(j.props)});`;r=r.replace(N,$),y===r&&console.error("Minimize file failed to change content",{name:p,tagName:k})}),g.importStrategy==="component"){const p=J(e,6),h=c.parse(e);r=`import '../../saltygen/css/${`f_${V(h.name)}-${p}.css`}';
|
37
|
+
${r}`}return 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)}},ct=t=>({name:"stylegen",buildStart:()=>xt(t),load:async e=>{if(z(e))return await Pt(t,e)},handleHotUpdate:async({file:e,server:s})=>{e.includes("salty.config")&&await s.restart()},watchChange:{handler:async e=>{z(e)&&await kt(t,e)}}});exports.default=ct;exports.saltyPlugin=ct;
|
package/index.js
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import * as v from "esbuild";
|
2
2
|
import { execSync as dt } from "child_process";
|
3
|
-
import { join as
|
4
|
-
import { existsSync as
|
3
|
+
import { join as a, parse as K } from "path";
|
4
|
+
import { existsSync as G, mkdirSync as H, statSync as gt, readdirSync as yt, writeFileSync as P, readFileSync as V } from "fs";
|
5
5
|
import { readFile as mt, writeFile as ht } from "fs/promises";
|
6
6
|
import { createLogger as $t, format as I, transports as bt } from "winston";
|
7
7
|
const Y = (t) => String.fromCharCode(t + (t > 25 ? 39 : 97)), St = (t, e) => {
|
@@ -12,12 +12,12 @@ const Y = (t) => String.fromCharCode(t + (t > 25 ? 39 : 97)), St = (t, e) => {
|
|
12
12
|
let s = e.length;
|
13
13
|
for (; s; ) t = t * 33 ^ e.charCodeAt(--s);
|
14
14
|
return t;
|
15
|
-
},
|
15
|
+
}, W = (t, e = 5) => {
|
16
16
|
const s = wt(5381, JSON.stringify(t)) >>> 0;
|
17
17
|
return St(s, e);
|
18
18
|
};
|
19
|
-
function
|
20
|
-
return t ? typeof t != "string" ?
|
19
|
+
function A(t) {
|
20
|
+
return t ? typeof t != "string" ? A(String(t)) : t.replace(/[\s.]/g, "-").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g, (e, s) => (s > 0 ? "-" : "") + e.toLowerCase()) : "";
|
21
21
|
}
|
22
22
|
const jt = (t, e) => {
|
23
23
|
if (typeof t != "string") return { result: t };
|
@@ -25,55 +25,55 @@ const jt = (t, e) => {
|
|
25
25
|
const s = [];
|
26
26
|
return Object.values(e).forEach((n) => {
|
27
27
|
const { pattern: i, transform: o } = n;
|
28
|
-
t = t.replace(i, (
|
29
|
-
const { value:
|
30
|
-
return c && s.push(c),
|
28
|
+
t = t.replace(i, (l) => {
|
29
|
+
const { value: g, css: c } = o(l);
|
30
|
+
return c && s.push(c), g;
|
31
31
|
});
|
32
32
|
}), { result: t, additionalCss: s };
|
33
|
-
}, tt = (t) => typeof t != "string" ? { result: t } : /\{[^{}]+\}/g.test(t) ? { result: t.replace(/\{([^{}]+)\}/g, (...n) => `var(--${
|
33
|
+
}, tt = (t) => typeof t != "string" ? { result: t } : /\{[^{}]+\}/g.test(t) ? { result: t.replace(/\{([^{}]+)\}/g, (...n) => `var(--${A(n[1].replaceAll(".", "-"))})`) } : { result: t }, M = (t, e, s) => {
|
34
34
|
if (!t) return "";
|
35
|
-
const n = [], i = Object.entries(t).reduce((
|
36
|
-
const r =
|
35
|
+
const n = [], i = Object.entries(t).reduce((l, [g, c]) => {
|
36
|
+
const r = g.trim();
|
37
37
|
if (typeof c == "function" && (c = c()), typeof c == "object") {
|
38
|
-
if (!c) return
|
38
|
+
if (!c) return l;
|
39
39
|
if (r === "variants")
|
40
|
-
return Object.entries(c).forEach(([
|
41
|
-
|
42
|
-
if (!
|
43
|
-
const
|
44
|
-
n.push(
|
40
|
+
return Object.entries(c).forEach(([f, y]) => {
|
41
|
+
y && Object.entries(y).forEach(([F, w]) => {
|
42
|
+
if (!w) return;
|
43
|
+
const T = `${e}.${f}-${F}`, N = M(w, T);
|
44
|
+
n.push(N);
|
45
45
|
});
|
46
|
-
}),
|
46
|
+
}), l;
|
47
47
|
if (r === "defaultVariants")
|
48
|
-
return
|
48
|
+
return l;
|
49
49
|
if (r === "compoundVariants")
|
50
|
-
return c.forEach((
|
51
|
-
const { css:
|
52
|
-
n.push(
|
53
|
-
}),
|
50
|
+
return c.forEach((f) => {
|
51
|
+
const { css: y, ...F } = f, w = Object.entries(F).reduce((N, [d, h]) => `${N}.${d}-${h}`, e), T = M(y, w);
|
52
|
+
n.push(T);
|
53
|
+
}), l;
|
54
54
|
if (r.startsWith("@")) {
|
55
|
-
const
|
56
|
-
${
|
55
|
+
const f = M(c, e), y = `${r} {
|
56
|
+
${f.replace(`
|
57
57
|
`, `
|
58
58
|
`)}
|
59
59
|
}`;
|
60
|
-
return n.push(
|
60
|
+
return n.push(y), l;
|
61
61
|
}
|
62
|
-
const
|
63
|
-
return n.push(
|
62
|
+
const u = g.includes("&") ? r.replace("&", e) : r.startsWith(":") ? `${e}${r}` : `${e} ${r}`, j = M(c, u);
|
63
|
+
return n.push(j), l;
|
64
64
|
}
|
65
|
-
const
|
65
|
+
const p = r.startsWith("-") ? r : A(r), m = (u, j = ";") => l = `${l}${u}${j}`, S = (u) => m(`${p}:${u}`);
|
66
66
|
if (typeof c == "number") return S(c);
|
67
67
|
if (typeof c != "string")
|
68
68
|
if ("toString" in c) c = c.toString();
|
69
|
-
else return
|
70
|
-
const { modifiers:
|
71
|
-
yield tt(c), yield jt(c,
|
69
|
+
else return l;
|
70
|
+
const { modifiers: b } = {}, k = function* () {
|
71
|
+
yield tt(c), yield jt(c, b);
|
72
72
|
}();
|
73
|
-
for (const { result:
|
74
|
-
c =
|
75
|
-
const
|
76
|
-
|
73
|
+
for (const { result: u, additionalCss: j = [] } of k)
|
74
|
+
c = u, j.forEach((f) => {
|
75
|
+
const y = M(f, "");
|
76
|
+
m(y, "");
|
77
77
|
});
|
78
78
|
return S(c);
|
79
79
|
}, "");
|
@@ -86,12 +86,12 @@ const jt = (t, e) => {
|
|
86
86
|
if (Object.entries(t).forEach(([i, o]) => {
|
87
87
|
if (typeof o == "object") {
|
88
88
|
if (!o) return;
|
89
|
-
const
|
90
|
-
s.push(
|
89
|
+
const l = i.trim(), g = et(o, [...e, l]);
|
90
|
+
s.push(g);
|
91
91
|
} else
|
92
92
|
n[i] = o;
|
93
93
|
}), Object.keys(n).length) {
|
94
|
-
const i = e.map(
|
94
|
+
const i = e.map(A).join("-"), o = M(n, `.${i}`);
|
95
95
|
s.push(o);
|
96
96
|
}
|
97
97
|
return s.join(`
|
@@ -101,23 +101,23 @@ const jt = (t, e) => {
|
|
101
101
|
return typeof i == "object" ? st(i, o, s) : s.add(e);
|
102
102
|
}), [...s]) : [], nt = (t) => {
|
103
103
|
if (!t || t === "/") throw new Error("Could not find package.json file");
|
104
|
-
const e =
|
105
|
-
return
|
106
|
-
},
|
104
|
+
const e = a(t, "package.json");
|
105
|
+
return G(e) ? e : nt(a(t, ".."));
|
106
|
+
}, Ct = async (t) => {
|
107
107
|
const e = nt(t);
|
108
108
|
return await mt(e, "utf-8").then(JSON.parse).catch(() => {
|
109
109
|
});
|
110
|
-
},
|
111
|
-
const e = await
|
110
|
+
}, xt = async (t) => {
|
111
|
+
const e = await Ct(t);
|
112
112
|
if (e)
|
113
113
|
return e.type;
|
114
114
|
};
|
115
|
-
let
|
115
|
+
let J;
|
116
116
|
const ot = async (t) => {
|
117
|
-
if (
|
118
|
-
const e = await
|
119
|
-
return e === "module" ?
|
120
|
-
},
|
117
|
+
if (J) return J;
|
118
|
+
const e = await xt(t);
|
119
|
+
return e === "module" ? J = "esm" : (e === "commonjs" || import.meta.url.endsWith(".cjs")) && (J = "cjs"), J || "esm";
|
120
|
+
}, L = $t({
|
121
121
|
level: "debug",
|
122
122
|
format: I.combine(I.colorize(), I.cli()),
|
123
123
|
transports: [new bt.Console({})]
|
@@ -175,12 +175,12 @@ const kt = {
|
|
175
175
|
externalModules: []
|
176
176
|
}, it = (t) => {
|
177
177
|
if (B.externalModules.length > 0) return B.externalModules;
|
178
|
-
const e =
|
178
|
+
const e = a(t, "salty.config.ts"), n = V(e, "utf8").match(/externalModules:\s?\[(.*)\]/);
|
179
179
|
if (!n) return [];
|
180
180
|
const i = n[1].split(",").map((o) => o.replace(/['"`]/g, "").trim());
|
181
181
|
return B.externalModules = i, i;
|
182
|
-
}, Z = (t) =>
|
183
|
-
const e = Z(t), s =
|
182
|
+
}, Z = (t) => a(t, "./saltygen"), ct = ["salty", "css", "styles", "styled"], Nt = (t = []) => new RegExp(`\\.(${[...ct, ...t].join("|")})\\.`), z = (t, e = []) => Nt(e).test(t), Pt = async (t) => {
|
183
|
+
const e = Z(t), s = a(t, "salty.config.ts"), n = a(e, "salty.config.js"), i = await ot(t), o = it(t);
|
184
184
|
await v.build({
|
185
185
|
entryPoints: [s],
|
186
186
|
minify: !0,
|
@@ -190,62 +190,62 @@ const kt = {
|
|
190
190
|
format: i,
|
191
191
|
external: o
|
192
192
|
});
|
193
|
-
const
|
194
|
-
return
|
193
|
+
const l = Date.now(), { config: g } = await import(`${n}?t=${l}`);
|
194
|
+
return g;
|
195
195
|
}, Tt = async (t) => {
|
196
|
-
const e = await Pt(t), s = /* @__PURE__ */ new Set(), n = (
|
197
|
-
if (
|
198
|
-
if (typeof
|
199
|
-
const
|
200
|
-
s.add(`"${
|
201
|
-
const
|
202
|
-
return `--${
|
203
|
-
}) : [], i = (
|
204
|
-
const
|
205
|
-
return
|
206
|
-
}) : [], o = (
|
207
|
-
const
|
208
|
-
return `${
|
209
|
-
})) : [],
|
210
|
-
|
211
|
-
const S =
|
212
|
-
|
213
|
-
const
|
214
|
-
|
215
|
-
const
|
216
|
-
|
217
|
-
const
|
196
|
+
const e = await Pt(t), s = /* @__PURE__ */ new Set(), n = (d, h = []) => d ? Object.entries(d).flatMap(([C, $]) => {
|
197
|
+
if (!$) return;
|
198
|
+
if (typeof $ == "object") return n($, [...h, C]);
|
199
|
+
const _ = rt(C), R = A(C), E = [...h, _].join(".");
|
200
|
+
s.add(`"${E}"`);
|
201
|
+
const D = [...h.map(A), R].join("-"), { result: O } = tt($);
|
202
|
+
return `--${D}: ${O};`;
|
203
|
+
}) : [], i = (d) => d ? Object.entries(d).flatMap(([h, C]) => {
|
204
|
+
const $ = n(C);
|
205
|
+
return h === "base" ? $.join("") : `${h} { ${$.join("")} }`;
|
206
|
+
}) : [], o = (d) => d ? Object.entries(d).flatMap(([h, C]) => Object.entries(C).flatMap(([$, _]) => {
|
207
|
+
const R = n(_, [h]), E = `.${h}-${$}, [data-${h}="${$}"]`, D = R.join("");
|
208
|
+
return `${E} { ${D} }`;
|
209
|
+
})) : [], l = n(e.variables), g = i(e.responsiveVariables), c = o(e.conditionalVariables), r = Z(t), p = a(r, "css/_variables.css"), m = `:root { ${l.join("")} ${g.join("")} } ${c.join("")}`;
|
210
|
+
P(p, m);
|
211
|
+
const S = a(r, "css/_global.css"), b = M(e.global, "");
|
212
|
+
P(S, `@layer global { ${b} }`);
|
213
|
+
const x = a(r, "css/_reset.css"), u = e.reset === "none" ? {} : typeof e.reset == "object" ? e.reset : kt, j = M(u, "");
|
214
|
+
P(x, `@layer reset { ${j} }`);
|
215
|
+
const f = a(r, "css/_templates.css"), y = et(e.templates), F = Ft(e.templates);
|
216
|
+
P(f, y);
|
217
|
+
const w = a(r, "types/css-tokens.d.ts"), N = `
|
218
218
|
// Variable types
|
219
219
|
type VariableTokens = ${[...s].join("|")};
|
220
220
|
type PropertyValueToken = \`{\${VariableTokens}}\`;
|
221
221
|
|
222
222
|
// Template types
|
223
223
|
type TemplateTokens = {
|
224
|
-
${Object.entries(
|
224
|
+
${Object.entries(F).map(([d, h]) => `${d}?: ${h}`).join(`
|
225
225
|
`)}
|
226
226
|
}
|
227
227
|
`;
|
228
|
-
|
228
|
+
P(w, N);
|
229
229
|
}, Q = (t) => t.replace(/styled\(([^"'`{,]+),/g, (e, s) => {
|
230
230
|
if (/^['"`]/.test(s)) return e;
|
231
231
|
const i = new RegExp(`import[^;]*${s}[,\\s{][^;]*from\\s?([^{};]+);`);
|
232
232
|
if (!i.test(t)) return e;
|
233
|
-
const
|
234
|
-
if (
|
235
|
-
const
|
236
|
-
if (ct.some((r) =>
|
233
|
+
const l = i.exec(t);
|
234
|
+
if (l) {
|
235
|
+
const g = l.at(1);
|
236
|
+
if (ct.some((r) => g == null ? void 0 : g.includes(r))) return e;
|
237
237
|
}
|
238
238
|
return "styled('div',";
|
239
239
|
}), q = async (t, e, s) => {
|
240
|
-
const n =
|
241
|
-
|
240
|
+
const n = W(e), i = a(s, "./temp");
|
241
|
+
G(i) || H(i);
|
242
242
|
const o = K(e);
|
243
|
-
let
|
244
|
-
|
245
|
-
const
|
243
|
+
let l = V(e, "utf8");
|
244
|
+
l = Q(l);
|
245
|
+
const g = a(s, "js", n + ".js"), c = it(t), r = await ot(t);
|
246
246
|
await v.build({
|
247
247
|
stdin: {
|
248
|
-
contents:
|
248
|
+
contents: l,
|
249
249
|
sourcefile: o.base,
|
250
250
|
resolveDir: o.dir,
|
251
251
|
loader: "tsx"
|
@@ -253,7 +253,7 @@ const kt = {
|
|
253
253
|
minify: !1,
|
254
254
|
treeShaking: !0,
|
255
255
|
bundle: !0,
|
256
|
-
outfile:
|
256
|
+
outfile: g,
|
257
257
|
format: r,
|
258
258
|
target: ["node20"],
|
259
259
|
keepNames: !0,
|
@@ -263,18 +263,18 @@ const kt = {
|
|
263
263
|
{
|
264
264
|
name: "test",
|
265
265
|
setup: (S) => {
|
266
|
-
S.onLoad({ filter: /.*\.css|salty|styles|styled\.ts/ }, (
|
267
|
-
const
|
268
|
-
return { contents: Q(
|
266
|
+
S.onLoad({ filter: /.*\.css|salty|styles|styled\.ts/ }, (b) => {
|
267
|
+
const x = V(b.path, "utf8");
|
268
|
+
return { contents: Q(x), loader: "ts" };
|
269
269
|
});
|
270
270
|
}
|
271
271
|
}
|
272
272
|
]
|
273
273
|
});
|
274
|
-
const
|
275
|
-
return await import(`${
|
274
|
+
const p = Date.now();
|
275
|
+
return await import(`${g}?t=${p}`);
|
276
276
|
}, U = async (t) => {
|
277
|
-
const e = Z(t), s =
|
277
|
+
const e = Z(t), s = a(e, "salty.config.js"), n = Date.now(), { config: i } = await import(`${s}?t=${n}`);
|
278
278
|
return i;
|
279
279
|
}, at = () => {
|
280
280
|
try {
|
@@ -282,136 +282,154 @@ const kt = {
|
|
282
282
|
} catch {
|
283
283
|
return !1;
|
284
284
|
}
|
285
|
-
},
|
285
|
+
}, Et = async (t, e = at()) => {
|
286
286
|
try {
|
287
287
|
const s = Date.now();
|
288
|
-
e ?
|
289
|
-
const n = [], i = [], o = Z(t),
|
288
|
+
e ? L.info("Generating CSS in production mode! 🔥") : L.info("Generating CSS in development mode! 🚀");
|
289
|
+
const n = [], i = [], o = Z(t), l = a(o, "index.css");
|
290
290
|
(() => {
|
291
|
-
|
291
|
+
G(o) && dt("rm -rf " + o), H(o), H(a(o, "css")), H(a(o, "types"));
|
292
292
|
})(), await Tt(t);
|
293
293
|
const c = await U(t);
|
294
|
-
async function r(
|
295
|
-
const
|
296
|
-
if (
|
297
|
-
const
|
298
|
-
if (
|
299
|
-
await Promise.all(
|
300
|
-
} else if (
|
301
|
-
const
|
302
|
-
Object.entries(
|
303
|
-
if (
|
304
|
-
const X = `a_${
|
305
|
-
n.push(X),
|
294
|
+
async function r(f, y) {
|
295
|
+
const F = ["node_modules", "saltygen"], w = gt(f);
|
296
|
+
if (w.isDirectory()) {
|
297
|
+
const T = yt(f);
|
298
|
+
if (F.some((d) => f.includes(d))) return;
|
299
|
+
await Promise.all(T.map((d) => r(a(f, d), a(y, d))));
|
300
|
+
} else if (w.isFile() && z(f)) {
|
301
|
+
const N = await q(t, f, o), d = [];
|
302
|
+
Object.entries(N).forEach(([E, D]) => {
|
303
|
+
if (D.isKeyframes && D.css) {
|
304
|
+
const X = `a_${D.animationName}.css`, pt = `css/${X}`, ut = a(o, pt);
|
305
|
+
n.push(X), P(ut, D.css);
|
306
306
|
return;
|
307
307
|
}
|
308
|
-
if (!
|
309
|
-
const
|
310
|
-
name:
|
308
|
+
if (!D.generator) return;
|
309
|
+
const O = D.generator._withBuildContext({
|
310
|
+
name: E,
|
311
311
|
config: c,
|
312
312
|
prod: e
|
313
313
|
});
|
314
|
-
i[
|
315
|
-
const lt = `css/${
|
316
|
-
|
314
|
+
i[O.priority] || (i[O.priority] = []), i[O.priority].push(O.cssFileName), d.push(O.cssFileName);
|
315
|
+
const lt = `css/${O.cssFileName}`, ft = a(o, lt);
|
316
|
+
P(ft, O.css);
|
317
317
|
});
|
318
|
-
const
|
319
|
-
`),
|
320
|
-
|
318
|
+
const h = d.map((E) => `@import url('./${E}');`).join(`
|
319
|
+
`), C = W(f, 6), $ = K(f), _ = A($.name), R = a(o, `css/f_${_}-${C}.css`);
|
320
|
+
P(R, h);
|
321
321
|
}
|
322
322
|
}
|
323
323
|
await r(t, o);
|
324
|
-
const
|
324
|
+
const p = n.map((f) => `@import url('./css/${f}');`).join(`
|
325
325
|
`);
|
326
|
-
let
|
326
|
+
let x = `@layer reset, global, l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
327
327
|
|
328
|
-
${["_variables.css", "_reset.css", "_global.css", "_templates.css"].filter((
|
328
|
+
${["_variables.css", "_reset.css", "_global.css", "_templates.css"].filter((f) => {
|
329
329
|
try {
|
330
|
-
return
|
330
|
+
return V(a(o, "css", f), "utf8").length > 0;
|
331
331
|
} catch {
|
332
332
|
return !1;
|
333
333
|
}
|
334
|
-
}).map((
|
334
|
+
}).map((f) => `@import url('./css/${f}');`).join(`
|
335
335
|
`)}
|
336
|
-
${
|
336
|
+
${p}`;
|
337
337
|
if (c.importStrategy !== "component") {
|
338
|
-
const
|
339
|
-
const
|
340
|
-
const
|
341
|
-
return `${
|
342
|
-
|
343
|
-
|
344
|
-
|
345
|
-
|
338
|
+
const f = i.reduce((y, F, w) => {
|
339
|
+
const T = F.reduce((C, $) => {
|
340
|
+
const _ = a(o, "css", $), R = V(_, "utf8"), E = W(_, 6);
|
341
|
+
return `${C}
|
342
|
+
/*start:${E}*/
|
343
|
+
${R}
|
344
|
+
/*end:${E}*/
|
345
|
+
`;
|
346
|
+
}, ""), N = `l_${w}.css`, d = a(o, "css", N), h = `@layer l${w} { ${T}
|
347
|
+
}`;
|
348
|
+
return P(d, h), `${y}
|
349
|
+
@import url('./css/${N}');`;
|
346
350
|
}, "");
|
347
|
-
|
351
|
+
x += f;
|
348
352
|
}
|
349
|
-
|
350
|
-
const
|
351
|
-
|
353
|
+
P(l, x);
|
354
|
+
const u = Date.now() - s, j = u < 200 ? "🔥" : u < 500 ? "🚀" : u < 1e3 ? "🎉" : u < 2e3 ? "🚗" : u < 5e3 ? "🤔" : "🥴";
|
355
|
+
L.info(`Generated CSS in ${u}ms! ${j}`);
|
352
356
|
} catch (s) {
|
353
357
|
console.error(s);
|
354
358
|
}
|
355
|
-
},
|
359
|
+
}, Dt = async (t, e) => {
|
356
360
|
try {
|
357
|
-
const s =
|
358
|
-
if (
|
359
|
-
const
|
360
|
-
Object.entries(
|
361
|
-
if (
|
362
|
-
const
|
363
|
-
|
361
|
+
const s = a(t, "./saltygen"), n = a(s, "index.css");
|
362
|
+
if (z(e)) {
|
363
|
+
const o = [], l = await U(t), g = await q(t, e, s);
|
364
|
+
Object.entries(g).forEach(([r, p]) => {
|
365
|
+
if (p.isKeyframes && p.css) {
|
366
|
+
const k = `css/${`a_${p.animationName}.css`}`, u = a(s, k);
|
367
|
+
P(u, p.css);
|
364
368
|
return;
|
365
369
|
}
|
366
|
-
if (
|
367
|
-
const
|
368
|
-
name:
|
369
|
-
config:
|
370
|
-
}),
|
371
|
-
|
370
|
+
if (!p.generator) return;
|
371
|
+
const m = p.generator._withBuildContext({
|
372
|
+
name: r,
|
373
|
+
config: l
|
374
|
+
}), S = `css/${m.cssFileName}`, b = a(s, S);
|
375
|
+
P(b, m.css), o[m.priority] || (o[m.priority] = []), o[m.priority].push(m.cssFileName);
|
372
376
|
});
|
373
|
-
const c =
|
374
|
-
`), r = s.map((S) => `@import url('../saltygen/css/${S}');`), j = [.../* @__PURE__ */ new Set([...c, ...r])].join(`
|
377
|
+
const c = V(n, "utf8").split(`
|
375
378
|
`);
|
376
|
-
|
379
|
+
l.importStrategy !== "component" && o.forEach((r, p) => {
|
380
|
+
const m = `l_${p}.css`, S = a(s, "css", m);
|
381
|
+
let b = V(S, "utf8");
|
382
|
+
r.forEach((x) => {
|
383
|
+
const k = a(s, "css", x), u = W(k, 6);
|
384
|
+
if (!b.includes(u)) {
|
385
|
+
const f = V(k, "utf8"), y = W(k, 6), F = `/*start:${y}*/
|
386
|
+
${f}
|
387
|
+
/*end:${y}*/
|
388
|
+
`;
|
389
|
+
b = `${b.replace(/\}$/, "")}
|
390
|
+
${F}
|
391
|
+
}`;
|
392
|
+
}
|
393
|
+
}), P(S, b);
|
394
|
+
});
|
377
395
|
}
|
378
396
|
} catch (s) {
|
379
397
|
console.error(s);
|
380
398
|
}
|
381
399
|
}, Ot = async (t, e, s = at()) => {
|
382
400
|
try {
|
383
|
-
const n =
|
384
|
-
if (
|
385
|
-
const o =
|
386
|
-
o.replace(/^(?!export\s)const\s.*/gm, (
|
387
|
-
const
|
401
|
+
const n = a(t, "./saltygen");
|
402
|
+
if (z(e)) {
|
403
|
+
const o = V(e, "utf8");
|
404
|
+
o.replace(/^(?!export\s)const\s.*/gm, (p) => `export ${p}`) !== o && await ht(e, o);
|
405
|
+
const g = await U(t), c = await q(t, e, n);
|
388
406
|
let r = o;
|
389
|
-
if (Object.entries(c).forEach(([
|
390
|
-
var
|
391
|
-
if (
|
392
|
-
const S =
|
393
|
-
name:
|
394
|
-
config:
|
407
|
+
if (Object.entries(c).forEach(([p, m]) => {
|
408
|
+
var C;
|
409
|
+
if (m.isKeyframes || !m.generator) return;
|
410
|
+
const S = m.generator._withBuildContext({
|
411
|
+
name: p,
|
412
|
+
config: g,
|
395
413
|
prod: s
|
396
|
-
}),
|
397
|
-
if (
|
398
|
-
const
|
399
|
-
if (!
|
400
|
-
const { index:
|
401
|
-
let
|
402
|
-
const
|
403
|
-
let
|
404
|
-
for (; !
|
405
|
-
const
|
406
|
-
|
414
|
+
}), b = new RegExp(`\\s${p}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(o);
|
415
|
+
if (!b) return console.error("Could not find the original declaration");
|
416
|
+
const x = (C = b.at(1)) == null ? void 0 : C.trim(), k = new RegExp(`\\s${p}[=\\s]+styled\\(`, "g").exec(r);
|
417
|
+
if (!k) return console.error("Could not find the original declaration");
|
418
|
+
const { index: u } = k;
|
419
|
+
let j = !1;
|
420
|
+
const f = setTimeout(() => j = !0, 5e3);
|
421
|
+
let y = 0, F = !1, w = 0;
|
422
|
+
for (; !F && !j; ) {
|
423
|
+
const $ = r[u + y];
|
424
|
+
$ === "(" && w++, $ === ")" && w--, w === 0 && $ === ")" && (F = !0), y > r.length && (j = !0), y++;
|
407
425
|
}
|
408
|
-
if (!
|
426
|
+
if (!j) clearTimeout(f);
|
409
427
|
else throw new Error("Failed to find the end of the styled call and timed out");
|
410
|
-
const
|
411
|
-
r = r.replace(
|
412
|
-
}),
|
413
|
-
const
|
414
|
-
r = `import '../../saltygen/css/${`f_${
|
428
|
+
const T = u + y, N = r.slice(u, T), d = r, h = ` ${p} = styled(${x}, "${S.classNames}", ${JSON.stringify(S.props)});`;
|
429
|
+
r = r.replace(N, h), d === r && console.error("Minimize file failed to change content", { name: p, tagName: x });
|
430
|
+
}), g.importStrategy === "component") {
|
431
|
+
const p = W(e, 6), m = K(e);
|
432
|
+
r = `import '../../saltygen/css/${`f_${A(m.name)}-${p}.css`}';
|
415
433
|
${r}`;
|
416
434
|
}
|
417
435
|
return r = r.replace("{ styled }", "{ styledClient as styled }"), r = r.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), r;
|
@@ -421,9 +439,9 @@ ${r}`;
|
|
421
439
|
}
|
422
440
|
}, Jt = (t) => ({
|
423
441
|
name: "stylegen",
|
424
|
-
buildStart: () =>
|
442
|
+
buildStart: () => Et(t),
|
425
443
|
load: async (e) => {
|
426
|
-
if (
|
444
|
+
if (z(e))
|
427
445
|
return await Ot(t, e);
|
428
446
|
},
|
429
447
|
handleHotUpdate: async ({ file: e, server: s }) => {
|
@@ -431,7 +449,7 @@ ${r}`;
|
|
431
449
|
},
|
432
450
|
watchChange: {
|
433
451
|
handler: async (e) => {
|
434
|
-
|
452
|
+
z(e) && await Dt(t, e);
|
435
453
|
}
|
436
454
|
}
|
437
455
|
});
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@salty-css/vite",
|
3
|
-
"version": "0.0.1-alpha.
|
3
|
+
"version": "0.0.1-alpha.144",
|
4
4
|
"main": "./dist/index.js",
|
5
5
|
"module": "./dist/index.mjs",
|
6
6
|
"typings": "./dist/index.d.ts",
|
@@ -34,6 +34,6 @@
|
|
34
34
|
}
|
35
35
|
},
|
36
36
|
"dependencies": {
|
37
|
-
"@salty-css/core": "^0.0.1-alpha.
|
37
|
+
"@salty-css/core": "^0.0.1-alpha.144"
|
38
38
|
}
|
39
39
|
}
|