@salty-css/vite 0.0.1-alpha.132 → 0.0.1-alpha.134
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 +16 -16
- package/index.js +150 -145
- package/package.json +2 -2
package/index.cjs
CHANGED
@@ -1,28 +1,28 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const fe=require("esbuild"),ue=require("child_process"),
|
2
|
-
${
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const fe=require("esbuild"),ue=require("child_process"),a=require("path"),u=require("fs"),G=require("fs/promises"),J=require("winston");var Z=typeof document<"u"?document.currentScript:null;function pe(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 X=pe(fe),U=e=>String.fromCharCode(e+(e>25?39:97)),de=(e,t)=>{let s="",n;for(n=Math.abs(e);n>52;n=n/52|0)s=U(n%52)+s;return s=U(n%52)+s,s.length<t?s=s.padStart(t,"a"):s.length>t&&(s=s.slice(-t)),s},ye=(e,t)=>{let s=t.length;for(;s;)e=e*33^t.charCodeAt(--s);return e},I=(e,t=5)=>{const s=ye(5381,JSON.stringify(e))>>>0;return de(s,t)};function M(e){return e?typeof e!="string"?M(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 ge=(e,t)=>{if(typeof e!="string")return{result:e};if(!t)return{result:e};const s=[];return Object.values(t).forEach(n=>{const{pattern:i,transform:r}=n;e=e.replace(i,f=>{const{value:g,css:c}=r(f);return c&&s.push(c),g})}),{result:e,additionalCss:s}},Y=e=>typeof e!="string"?{result:e}:/\{[^{}]+\}/g.test(e)?{result:e.replace(/\{([^{}]+)\}/g,(...n)=>`var(--${M(n[1].replaceAll(".","-"))})`)}:{result:e},D=(e,t,s)=>{if(!e)return"";const n=[],i=Object.entries(e).reduce((f,[g,c])=>{const o=g.trim();if(typeof c=="function"&&(c=c()),typeof c=="object"){if(!c)return f;if(o==="variants")return Object.entries(c).forEach(([l,y])=>{y&&Object.entries(y).forEach(([C,$])=>{if(!$)return;const T=`${t}.${l}-${C}`,k=D($,T);n.push(k)})}),f;if(o==="defaultVariants")return f;if(o==="compoundVariants")return c.forEach(l=>{const{css:y,...C}=l,$=Object.entries(C).reduce((k,[p,h])=>`${k}.${p}-${h}`,t),T=D(y,$);n.push(T)}),f;if(o.startsWith("@")){const l=D(c,t),y=`${o} {
|
2
|
+
${l.replace(`
|
3
3
|
`,`
|
4
4
|
`)}
|
5
|
-
}`;return
|
6
|
-
`)
|
7
|
-
`)},Q=(e,t=[])=>{if(!e)return"";const s=[],n={};if(Object.entries(e).forEach(([i,r])=>{if(typeof r=="object"){if(!r)return;const
|
8
|
-
`)},me=e=>Object.entries(e).reduce((t,[s,n])=>(typeof n=="object"&&(t[s]=v(n).map(i=>`"${i}"`).join(" | ")),t),{}),v=(e,t="",s=new Set)=>e?(Object.entries(e).forEach(([n,i])=>{const r=t?`${t}.${n}`:n;return typeof i=="object"?v(i,r,s):s.add(t)}),[...s]):[],ee=e=>{if(!e||e==="/")throw new Error("Could not find package.json file");const t=
|
5
|
+
}`;return n.push(y),f}const d=g.includes("&")?o.replace("&",t):o.startsWith(":")?`${t}${o}`:`${t} ${o}`,S=D(c,d);return n.push(S),f}const m=o.startsWith("-")?o:M(o),w=(d,S=";")=>f=`${f}${d}${S}`,F=d=>w(`${m}:${d}`);if(typeof c=="number")return F(c);if(typeof c!="string")if("toString"in c)c=c.toString();else return f;const{modifiers:j}={},O=function*(){yield Y(c),yield ge(c,j)}();for(const{result:d,additionalCss:S=[]}of O)c=d,S.forEach(l=>{const y=D(l,"");w(y,"")});return F(c)},"");return i?t?[`${t} { ${i} }`,...n].join(`
|
6
|
+
`):i:n.join(`
|
7
|
+
`)},Q=(e,t=[])=>{if(!e)return"";const s=[],n={};if(Object.entries(e).forEach(([i,r])=>{if(typeof r=="object"){if(!r)return;const f=i.trim(),g=Q(r,[...t,f]);s.push(g)}else n[i]=r}),Object.keys(n).length){const i=t.map(M).join("-"),r=D(n,`.${i}`);s.push(r)}return s.join(`
|
8
|
+
`)},me=e=>Object.entries(e).reduce((t,[s,n])=>(typeof n=="object"&&(t[s]=v(n).map(i=>`"${i}"`).join(" | ")),t),{}),v=(e,t="",s=new Set)=>e?(Object.entries(e).forEach(([n,i])=>{const r=t?`${t}.${n}`:n;return typeof i=="object"?v(i,r,s):s.add(t)}),[...s]):[],ee=e=>{if(!e||e==="/")throw new Error("Could not find package.json file");const t=a.join(e,"package.json");return u.existsSync(t)?t:ee(a.join(e,".."))},he=async e=>{const t=ee(e);return await G.readFile(t,"utf-8").then(JSON.parse).catch(()=>{})},be=async e=>{const t=await he(e);if(t)return t.type};let V;const te=async e=>{if(V)return V;const t=await be(e);return t==="module"?V="esm":(t==="commonjs"||(typeof document>"u"?require("url").pathToFileURL(__filename).href:Z&&Z.tagName.toUpperCase()==="SCRIPT"&&Z.src||new URL("index.cjs",document.baseURI).href).endsWith(".cjs"))&&(V="cjs"),V||"esm"},q=J.createLogger({level:"debug",format:J.format.combine(J.format.colorize(),J.format.cli()),transports:[new J.transports.Console({})]});function se(e){return e?typeof e!="string"?se(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 je={"*, *::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"}},H={externalModules:[]},ne=e=>{if(H.externalModules.length>0)return H.externalModules;const t=a.join(e,"salty.config.ts"),n=u.readFileSync(t,"utf8").match(/externalModules:\s?\[(.*)\]/);if(!n)return[];const i=n[1].split(",").map(r=>r.replace(/['"`]/g,"").trim());return H.externalModules=i,i},W=e=>a.join(e,"./saltygen"),Se=["salty","css","styles","styled"],$e=(e=[])=>new RegExp(`\\.(${[...Se,...e].join("|")})\\.`),z=(e,t=[])=>$e(t).test(e),we=async e=>{const t=W(e),s=a.join(e,"salty.config.ts"),n=a.join(t,"salty.config.js"),i=await te(e),r=ne(e);await X.build({entryPoints:[s],minify:!0,treeShaking:!0,bundle:!0,outfile:n,format:i,external:r});const f=Date.now(),{config:g}=await import(`${n}?t=${f}`);return g},Fe=async e=>{const t=await we(e),s=new Set,n=(p,h=[])=>p?Object.entries(p).flatMap(([P,b])=>{if(!b)return;if(typeof b=="object")return n(b,[...h,P]);const A=se(P),R=M(P),E=[...h,A].join(".");s.add(`"${E}"`);const N=[...h.map(M),R].join("-"),{result:_}=Y(b);return`--${N}: ${_};`}):[],i=p=>p?Object.entries(p).flatMap(([h,P])=>{const b=n(P);return h==="base"?b.join(""):`${h} { ${b.join("")} }`}):[],r=p=>p?Object.entries(p).flatMap(([h,P])=>Object.entries(P).flatMap(([b,A])=>{const R=n(A,[h]),E=`.${h}-${b}, [data-${h}="${b}"]`,N=R.join("");return`${E} { ${N} }`})):[],f=n(t.variables),g=i(t.responsiveVariables),c=r(t.conditionalVariables),o=W(e),m=a.join(o,"css/_variables.css"),w=`:root { ${f.join("")} ${g.join("")} } ${c.join("")}`;u.writeFileSync(m,w);const F=a.join(o,"css/_global.css"),j=D(t.global,"");u.writeFileSync(F,`@layer global { ${j} }`);const x=a.join(o,"css/_reset.css"),d=t.reset==="none"?{}:typeof t.reset=="object"?t.reset:je,S=D(d,"");u.writeFileSync(x,`@layer reset { ${S} }`);const l=a.join(o,"css/_templates.css"),y=Q(t.templates),C=me(t.templates);u.writeFileSync(l,y);const $=a.join(o,"types/css-tokens.d.ts"),k=`
|
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(([p,h])=>`${p}?: ${h}`).join(`
|
16
16
|
`)}
|
17
17
|
}
|
18
|
-
`;u.writeFileSync(
|
19
|
-
`),
|
20
|
-
`);let
|
18
|
+
`;u.writeFileSync($,k)},B=async(e,t,s)=>{const n=I(t),i=a.join(s,"./temp");u.existsSync(i)||u.mkdirSync(i);const r=a.parse(t);let f=u.readFileSync(t,"utf8");f=f.replace(/styled\([^"'`{,]+,/g,"styled('div',");const g=a.join(s,"js",n+".js"),c=ne(e),o=await te(e);await X.build({stdin:{contents:f,sourcefile:r.base,resolveDir:r.dir,loader:"tsx"},minify:!1,treeShaking:!0,bundle:!0,outfile:g,format:o,target:["node20"],keepNames:!0,external:c,packages:"external"});const m=Date.now();return await import(`${g}?t=${m}`)},K=async e=>{const t=W(e),s=a.join(t,"salty.config.js"),n=Date.now(),{config:i}=await import(`${s}?t=${n}`);return i},oe=()=>{try{return process.env.NODE_ENV==="production"}catch{return!1}},xe=async(e,t=oe())=>{try{const s=Date.now();t?q.info("Generating CSS in production mode! 🔥"):q.info("Generating CSS in development mode! 🚀");const n=[],i=[],r=W(e),f=a.join(r,"index.css");(()=>{u.existsSync(r)&&ue.execSync("rm -rf "+r),u.mkdirSync(r),u.mkdirSync(a.join(r,"css")),u.mkdirSync(a.join(r,"types"))})(),await Fe(e);const c=await K(e);async function o(l,y){const C=["node_modules","saltygen"],$=u.statSync(l);if($.isDirectory()){const T=u.readdirSync(l);if(C.some(p=>l.includes(p)))return;await Promise.all(T.map(p=>o(a.join(l,p),a.join(y,p))))}else if($.isFile()&&z(l)){const k=await B(e,l,r),p=[];Object.entries(k).forEach(([E,N])=>{if(N.isKeyframes&&N.css){const L=`a_${N.animationName}.css`,ae=`css/${L}`,le=a.join(r,ae);n.push(L),u.writeFileSync(le,N.css);return}if(!N.generator)return;const _=N.generator._withBuildContext({name:E,config:c,prod:t});i[_.priority]||(i[_.priority]=[]),i[_.priority].push(_.cssFileName),p.push(_.cssFileName);const ie=`css/${_.cssFileName}`,ce=a.join(r,ie);u.writeFileSync(ce,_.css)});const h=p.map(E=>`@import url('./${E}');`).join(`
|
19
|
+
`),P=I(l,6),b=a.parse(l),A=M(b.name),R=a.join(r,`css/f_${A}-${P}.css`);u.writeFileSync(R,h)}}await o(e,r);const m=n.map(l=>`@import url('./css/${l}');`).join(`
|
20
|
+
`);let x=`@layer reset, global, l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
21
21
|
|
22
|
-
${["_variables.css","_reset.css","_global.css","_templates.css"].filter(l=>{try{return u.readFileSync(
|
22
|
+
${["_variables.css","_reset.css","_global.css","_templates.css"].filter(l=>{try{return u.readFileSync(a.join(r,"css",l),"utf8").length>0}catch{return!1}}).map(l=>`@import url('./css/${l}');`).join(`
|
23
23
|
`)}
|
24
|
-
${
|
25
|
-
`);
|
26
|
-
`),o=s.map(
|
27
|
-
`);u.writeFileSync(i,
|
28
|
-
${o}`}return o=o.replace("{ styled }","{ styledClient as styled }"),o=o.replace("@salty-css/react/styled","@salty-css/react/styled-client"),o}}catch(n){console.error("Error in minimizeFile:",n)}},re=e=>({name:"stylegen",buildStart:()=>xe(e),load:async t=>{if(z(t))return await
|
24
|
+
${m}`;if(c.importStrategy!=="component"){const l=i.reduce((y,C,$)=>{const T=C.reduce((k,p)=>k+`@import url('./css/${p}') layer(l${$});`,"");return`${y}
|
25
|
+
${T}`},"");x+=l}u.writeFileSync(f,x);const d=Date.now()-s,S=d<200?"🔥":d<500?"🚀":d<1e3?"🎉":d<2e3?"🚗":d<5e3?"🤔":"🥴";q.info(`Generated CSS in ${d}ms! ${S}`)}catch(s){console.error(s)}},Ce=async(e,t)=>{try{const s=[],n=a.join(e,"./saltygen"),i=a.join(n,"index.css");if(z(t)){const f=await K(e),g=await B(e,t,n);Object.entries(g).forEach(([F,j])=>{if(j.isKeyframes&&j.css){const l=`css/${`a_${j.animationName}.css`}`,y=a.join(n,l);u.writeFileSync(y,j.css);return}if(!j.generator)return;const x=j.generator._withBuildContext({name:F,config:f}),O=`css/${x.cssFileName}`,d=a.join(n,O);s.push(x.cssFileName),u.writeFileSync(d,x.css)});const c=u.readFileSync(i,"utf8").split(`
|
26
|
+
`),o=s.map(F=>`@import url('../saltygen/css/${F}');`),w=[...new Set([...c,...o])].join(`
|
27
|
+
`);u.writeFileSync(i,w)}}catch(s){console.error(s)}},ke=async(e,t,s=oe())=>{try{const n=a.join(e,"./saltygen");if(z(t)){const r=u.readFileSync(t,"utf8");r.replace(/^(?!export\s)const\s.*/gm,m=>`export ${m}`)!==r&&await G.writeFile(t,r);const g=await K(e),c=await B(e,t,n);let o=r;if(Object.entries(c).forEach(([m,w])=>{var P;if(w.isKeyframes||!w.generator)return;const F=w.generator._withBuildContext({name:m,config:g,prod:s}),j=new RegExp(`\\s${m}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(r);if(!j)return console.error("Could not find the original declaration");const x=(P=j.at(1))==null?void 0:P.trim(),O=new RegExp(`\\s${m}[=\\s]+styled\\(`,"g").exec(o);if(!O)return console.error("Could not find the original declaration");const{index:d}=O;let S=!1;const l=setTimeout(()=>S=!0,5e3);let y=0,C=!1,$=0;for(;!C&&!S;){const b=o[d+y];b==="("&&$++,b===")"&&$--,$===0&&b===")"&&(C=!0),y>o.length&&(S=!0),y++}if(!S)clearTimeout(l);else throw new Error("Failed to find the end of the styled call and timed out");const T=d+y,k=o.slice(d,T),p=o,h=` ${m} = styled(${x}, "${F.classNames}", ${JSON.stringify(F.props)});`;o=o.replace(k,h),p===o&&console.error("Minimize file failed to change content",{name:m,tagName:x})}),g.importStrategy==="component"){const m=I(t,6),w=a.parse(t);o=`import '../../saltygen/css/${`f_${M(w.name)}-${m}.css`}';
|
28
|
+
${o}`}return o=o.replace("{ styled }","{ styledClient as styled }"),o=o.replace("@salty-css/react/styled","@salty-css/react/styled-client"),o}}catch(n){console.error("Error in minimizeFile:",n)}},re=e=>({name:"stylegen",buildStart:()=>xe(e),load:async t=>{if(z(t))return await ke(e,t)},handleHotUpdate:async({file:t,server:s})=>{t.includes("salty.config")&&await s.restart()},watchChange:{handler:async t=>{z(t)&&await Ce(e,t)}}});exports.default=re;exports.saltyPlugin=re;
|
package/index.js
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import * as Q from "esbuild";
|
2
2
|
import { execSync as pt } from "child_process";
|
3
3
|
import { join as l, parse as K } from "path";
|
4
|
-
import { existsSync as G, mkdirSync as R, statSync as ut, readdirSync as dt, writeFileSync as
|
4
|
+
import { existsSync as G, mkdirSync as R, statSync as ut, readdirSync as dt, writeFileSync as N, readFileSync as z } from "fs";
|
5
5
|
import { readFile as gt, writeFile as yt } from "fs/promises";
|
6
6
|
import { createLogger as mt, format as H, transports as ht } from "winston";
|
7
7
|
const Y = (t) => String.fromCharCode(t + (t > 25 ? 39 : 97)), $t = (t, e) => {
|
@@ -16,8 +16,8 @@ const Y = (t) => String.fromCharCode(t + (t > 25 ? 39 : 97)), $t = (t, e) => {
|
|
16
16
|
const s = bt(5381, JSON.stringify(t)) >>> 0;
|
17
17
|
return $t(s, e);
|
18
18
|
};
|
19
|
-
function
|
20
|
-
return t ? typeof t != "string" ?
|
19
|
+
function V(t) {
|
20
|
+
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()) : "";
|
21
21
|
}
|
22
22
|
const St = (t, e) => {
|
23
23
|
if (typeof t != "string") return { result: t };
|
@@ -25,63 +25,60 @@ const St = (t, e) => {
|
|
25
25
|
const s = [];
|
26
26
|
return Object.values(e).forEach((n) => {
|
27
27
|
const { pattern: i, transform: r } = n;
|
28
|
-
t = t.replace(i, (
|
29
|
-
const { value:
|
30
|
-
return
|
28
|
+
t = t.replace(i, (f) => {
|
29
|
+
const { value: g, css: c } = r(f);
|
30
|
+
return c && s.push(c), g;
|
31
31
|
});
|
32
32
|
}), { result: t, additionalCss: s };
|
33
|
-
}, v = (t) => typeof t != "string" ? { result: t } : /\{[^{}]+\}/g.test(t) ? { result: t.replace(/\{([^{}]+)\}/g, (...n) => `var(--${
|
33
|
+
}, v = (t) => typeof t != "string" ? { result: t } : /\{[^{}]+\}/g.test(t) ? { result: t.replace(/\{([^{}]+)\}/g, (...n) => `var(--${V(n[1].replaceAll(".", "-"))})`) } : { result: t }, O = (t, e, s) => {
|
34
34
|
if (!t) return "";
|
35
|
-
const
|
36
|
-
const
|
37
|
-
if (typeof
|
38
|
-
if (!
|
39
|
-
if (
|
40
|
-
return Object.entries(
|
41
|
-
|
42
|
-
if (!
|
43
|
-
const P = `${e}.${
|
44
|
-
|
35
|
+
const n = [], i = Object.entries(t).reduce((f, [g, c]) => {
|
36
|
+
const o = g.trim();
|
37
|
+
if (typeof c == "function" && (c = c()), typeof c == "object") {
|
38
|
+
if (!c) return f;
|
39
|
+
if (o === "variants")
|
40
|
+
return Object.entries(c).forEach(([a, d]) => {
|
41
|
+
d && Object.entries(d).forEach(([x, S]) => {
|
42
|
+
if (!S) return;
|
43
|
+
const P = `${e}.${a}-${x}`, C = O(S, P);
|
44
|
+
n.push(C);
|
45
45
|
});
|
46
46
|
}), f;
|
47
|
-
if (
|
47
|
+
if (o === "defaultVariants")
|
48
48
|
return f;
|
49
|
-
if (
|
50
|
-
return
|
51
|
-
const { css:
|
52
|
-
|
49
|
+
if (o === "compoundVariants")
|
50
|
+
return c.forEach((a) => {
|
51
|
+
const { css: d, ...x } = a, S = Object.entries(x).reduce((C, [p, m]) => `${C}.${p}-${m}`, e), P = O(d, S);
|
52
|
+
n.push(P);
|
53
53
|
}), f;
|
54
|
-
if (
|
55
|
-
const
|
56
|
-
${
|
54
|
+
if (o.startsWith("@")) {
|
55
|
+
const a = O(c, e), d = `${o} {
|
56
|
+
${a.replace(`
|
57
57
|
`, `
|
58
58
|
`)}
|
59
59
|
}`;
|
60
|
-
return
|
60
|
+
return n.push(d), f;
|
61
61
|
}
|
62
|
-
const
|
63
|
-
return
|
62
|
+
const u = g.includes("&") ? o.replace("&", e) : o.startsWith(":") ? `${e}${o}` : `${e} ${o}`, b = O(c, u);
|
63
|
+
return n.push(b), f;
|
64
64
|
}
|
65
|
-
const
|
66
|
-
if (typeof
|
67
|
-
if (typeof
|
68
|
-
if ("toString" in
|
65
|
+
const y = o.startsWith("-") ? o : V(o), w = (u, b = ";") => f = `${f}${u}${b}`, j = (u) => w(`${y}:${u}`);
|
66
|
+
if (typeof c == "number") return j(c);
|
67
|
+
if (typeof c != "string")
|
68
|
+
if ("toString" in c) c = c.toString();
|
69
69
|
else return f;
|
70
|
-
const { modifiers:
|
71
|
-
yield v(
|
70
|
+
const { modifiers: $ } = {}, E = function* () {
|
71
|
+
yield v(c), yield St(c, $);
|
72
72
|
}();
|
73
|
-
for (const { result:
|
74
|
-
|
75
|
-
const
|
76
|
-
|
73
|
+
for (const { result: u, additionalCss: b = [] } of E)
|
74
|
+
c = u, b.forEach((a) => {
|
75
|
+
const d = O(a, "");
|
76
|
+
w(d, "");
|
77
77
|
});
|
78
|
-
return
|
78
|
+
return j(c);
|
79
79
|
}, "");
|
80
|
-
|
81
|
-
`)
|
82
|
-
if (!e) return r;
|
83
|
-
let d = "";
|
84
|
-
return d = `${e} { ${r} }`, [d, ...i].join(`
|
80
|
+
return i ? e ? [`${e} { ${i} }`, ...n].join(`
|
81
|
+
`) : i : n.join(`
|
85
82
|
`);
|
86
83
|
}, tt = (t, e = []) => {
|
87
84
|
if (!t) return "";
|
@@ -89,12 +86,12 @@ const St = (t, e) => {
|
|
89
86
|
if (Object.entries(t).forEach(([i, r]) => {
|
90
87
|
if (typeof r == "object") {
|
91
88
|
if (!r) return;
|
92
|
-
const
|
93
|
-
s.push(
|
89
|
+
const f = i.trim(), g = tt(r, [...e, f]);
|
90
|
+
s.push(g);
|
94
91
|
} else
|
95
92
|
n[i] = r;
|
96
93
|
}), Object.keys(n).length) {
|
97
|
-
const i = e.map(
|
94
|
+
const i = e.map(V).join("-"), r = O(n, `.${i}`);
|
98
95
|
s.push(r);
|
99
96
|
}
|
100
97
|
return s.join(`
|
@@ -159,9 +156,14 @@ const xt = {
|
|
159
156
|
"h1, h2, h3, h4, h5, h6": {
|
160
157
|
textWrap: "balance"
|
161
158
|
},
|
159
|
+
/** Improve link color */
|
160
|
+
a: {
|
161
|
+
color: "currentColor"
|
162
|
+
},
|
162
163
|
/** Improve button line height */
|
163
164
|
button: {
|
164
|
-
lineHeight: "1em"
|
165
|
+
lineHeight: "1em",
|
166
|
+
color: "currentColor"
|
165
167
|
},
|
166
168
|
/** Improve form elements */
|
167
169
|
"input, optgroup, select, textarea": {
|
@@ -188,52 +190,52 @@ const xt = {
|
|
188
190
|
format: i,
|
189
191
|
external: r
|
190
192
|
});
|
191
|
-
const
|
192
|
-
return
|
193
|
+
const f = Date.now(), { config: g } = await import(`${n}?t=${f}`);
|
194
|
+
return g;
|
193
195
|
}, Pt = async (t) => {
|
194
|
-
const e = await Nt(t), s = /* @__PURE__ */ new Set(), n = (p,
|
195
|
-
if (!
|
196
|
-
if (typeof
|
197
|
-
const A = ot(
|
196
|
+
const e = await Nt(t), s = /* @__PURE__ */ new Set(), n = (p, m = []) => p ? Object.entries(p).flatMap(([k, h]) => {
|
197
|
+
if (!h) return;
|
198
|
+
if (typeof h == "object") return n(h, [...m, k]);
|
199
|
+
const A = ot(k), J = V(k), M = [...m, A].join(".");
|
198
200
|
s.add(`"${M}"`);
|
199
|
-
const T = [...
|
201
|
+
const T = [...m.map(V), J].join("-"), { result: D } = v(h);
|
200
202
|
return `--${T}: ${D};`;
|
201
|
-
}) : [], i = (p) => p ? Object.entries(p).flatMap(([
|
202
|
-
const
|
203
|
-
return
|
204
|
-
}) : [], r = (p) => p ? Object.entries(p).flatMap(([
|
205
|
-
const J = n(A, [
|
203
|
+
}) : [], i = (p) => p ? Object.entries(p).flatMap(([m, k]) => {
|
204
|
+
const h = n(k);
|
205
|
+
return m === "base" ? h.join("") : `${m} { ${h.join("")} }`;
|
206
|
+
}) : [], r = (p) => p ? Object.entries(p).flatMap(([m, k]) => Object.entries(k).flatMap(([h, A]) => {
|
207
|
+
const J = n(A, [m]), M = `.${m}-${h}, [data-${m}="${h}"]`, T = J.join("");
|
206
208
|
return `${M} { ${T} }`;
|
207
|
-
})) : [],
|
208
|
-
|
209
|
-
const
|
210
|
-
|
211
|
-
const
|
212
|
-
|
213
|
-
const a = l(o, "css/_templates.css"),
|
214
|
-
|
215
|
-
const
|
209
|
+
})) : [], f = n(e.variables), g = i(e.responsiveVariables), c = r(e.conditionalVariables), o = Z(t), y = l(o, "css/_variables.css"), w = `:root { ${f.join("")} ${g.join("")} } ${c.join("")}`;
|
210
|
+
N(y, w);
|
211
|
+
const j = l(o, "css/_global.css"), $ = O(e.global, "");
|
212
|
+
N(j, `@layer global { ${$} }`);
|
213
|
+
const F = l(o, "css/_reset.css"), u = e.reset === "none" ? {} : typeof e.reset == "object" ? e.reset : xt, b = O(u, "");
|
214
|
+
N(F, `@layer reset { ${b} }`);
|
215
|
+
const a = l(o, "css/_templates.css"), d = tt(e.templates), x = wt(e.templates);
|
216
|
+
N(a, d);
|
217
|
+
const S = l(o, "types/css-tokens.d.ts"), C = `
|
216
218
|
// Variable types
|
217
219
|
type VariableTokens = ${[...s].join("|")};
|
218
220
|
type PropertyValueToken = \`{\${VariableTokens}}\`;
|
219
221
|
|
220
222
|
// Template types
|
221
223
|
type TemplateTokens = {
|
222
|
-
${Object.entries(
|
224
|
+
${Object.entries(x).map(([p, m]) => `${p}?: ${m}`).join(`
|
223
225
|
`)}
|
224
226
|
}
|
225
227
|
`;
|
226
|
-
|
228
|
+
N(S, C);
|
227
229
|
}, q = async (t, e, s) => {
|
228
230
|
const n = L(e), i = l(s, "./temp");
|
229
231
|
G(i) || R(i);
|
230
232
|
const r = K(e);
|
231
|
-
let
|
232
|
-
|
233
|
-
const
|
233
|
+
let f = z(e, "utf8");
|
234
|
+
f = f.replace(/styled\([^"'`{,]+,/g, "styled('div',");
|
235
|
+
const g = l(s, "js", n + ".js"), c = rt(t), o = await nt(t);
|
234
236
|
await Q.build({
|
235
237
|
stdin: {
|
236
|
-
contents:
|
238
|
+
contents: f,
|
237
239
|
sourcefile: r.base,
|
238
240
|
resolveDir: r.dir,
|
239
241
|
loader: "tsx"
|
@@ -241,15 +243,15 @@ const xt = {
|
|
241
243
|
minify: !1,
|
242
244
|
treeShaking: !0,
|
243
245
|
bundle: !0,
|
244
|
-
outfile:
|
246
|
+
outfile: g,
|
245
247
|
format: o,
|
246
248
|
target: ["node20"],
|
247
249
|
keepNames: !0,
|
248
|
-
external:
|
250
|
+
external: c,
|
249
251
|
packages: "external"
|
250
252
|
});
|
251
|
-
const
|
252
|
-
return await import(`${
|
253
|
+
const y = Date.now();
|
254
|
+
return await import(`${g}?t=${y}`);
|
253
255
|
}, U = async (t) => {
|
254
256
|
const e = Z(t), s = l(e, "salty.config.js"), n = Date.now(), { config: i } = await import(`${s}?t=${n}`);
|
255
257
|
return i;
|
@@ -263,44 +265,44 @@ const xt = {
|
|
263
265
|
try {
|
264
266
|
const s = Date.now();
|
265
267
|
e ? B.info("Generating CSS in production mode! 🔥") : B.info("Generating CSS in development mode! 🚀");
|
266
|
-
const n = [], i = [], r = Z(t),
|
268
|
+
const n = [], i = [], r = Z(t), f = l(r, "index.css");
|
267
269
|
(() => {
|
268
270
|
G(r) && pt("rm -rf " + r), R(r), R(l(r, "css")), R(l(r, "types"));
|
269
271
|
})(), await Pt(t);
|
270
|
-
const
|
271
|
-
async function o(a,
|
272
|
-
const
|
273
|
-
if (
|
274
|
-
const
|
275
|
-
if (
|
276
|
-
await Promise.all(
|
277
|
-
} else if (
|
278
|
-
const
|
279
|
-
Object.entries(
|
272
|
+
const c = await U(t);
|
273
|
+
async function o(a, d) {
|
274
|
+
const x = ["node_modules", "saltygen"], S = ut(a);
|
275
|
+
if (S.isDirectory()) {
|
276
|
+
const P = dt(a);
|
277
|
+
if (x.some((p) => a.includes(p))) return;
|
278
|
+
await Promise.all(P.map((p) => o(l(a, p), l(d, p))));
|
279
|
+
} else if (S.isFile() && W(a)) {
|
280
|
+
const C = await q(t, a, r), p = [];
|
281
|
+
Object.entries(C).forEach(([M, T]) => {
|
280
282
|
if (T.isKeyframes && T.css) {
|
281
283
|
const X = `a_${T.animationName}.css`, lt = `css/${X}`, ft = l(r, lt);
|
282
|
-
n.push(X),
|
284
|
+
n.push(X), N(ft, T.css);
|
283
285
|
return;
|
284
286
|
}
|
285
287
|
if (!T.generator) return;
|
286
288
|
const D = T.generator._withBuildContext({
|
287
289
|
name: M,
|
288
|
-
config:
|
290
|
+
config: c,
|
289
291
|
prod: e
|
290
292
|
});
|
291
293
|
i[D.priority] || (i[D.priority] = []), i[D.priority].push(D.cssFileName), p.push(D.cssFileName);
|
292
294
|
const ct = `css/${D.cssFileName}`, at = l(r, ct);
|
293
|
-
|
295
|
+
N(at, D.css);
|
294
296
|
});
|
295
|
-
const
|
296
|
-
`),
|
297
|
-
|
297
|
+
const m = p.map((M) => `@import url('./${M}');`).join(`
|
298
|
+
`), k = L(a, 6), h = K(a), A = V(h.name), J = l(r, `css/f_${A}-${k}.css`);
|
299
|
+
N(J, m);
|
298
300
|
}
|
299
301
|
}
|
300
302
|
await o(t, r);
|
301
|
-
const
|
303
|
+
const y = n.map((a) => `@import url('./css/${a}');`).join(`
|
302
304
|
`);
|
303
|
-
let
|
305
|
+
let F = `@layer reset, global, l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
304
306
|
|
305
307
|
${["_variables.css", "_reset.css", "_global.css", "_templates.css"].filter((a) => {
|
306
308
|
try {
|
@@ -310,15 +312,18 @@ ${["_variables.css", "_reset.css", "_global.css", "_templates.css"].filter((a) =
|
|
310
312
|
}
|
311
313
|
}).map((a) => `@import url('./css/${a}');`).join(`
|
312
314
|
`)}
|
313
|
-
${
|
314
|
-
if (
|
315
|
-
const a = i.
|
316
|
-
|
317
|
-
|
315
|
+
${y}`;
|
316
|
+
if (c.importStrategy !== "component") {
|
317
|
+
const a = i.reduce((d, x, S) => {
|
318
|
+
const P = x.reduce((C, p) => C + `@import url('./css/${p}') layer(l${S});`, "");
|
319
|
+
return `${d}
|
320
|
+
${P}`;
|
321
|
+
}, "");
|
322
|
+
F += a;
|
318
323
|
}
|
319
|
-
|
320
|
-
const
|
321
|
-
B.info(`Generated CSS in ${
|
324
|
+
N(f, F);
|
325
|
+
const u = Date.now() - s, b = u < 200 ? "🔥" : u < 500 ? "🚀" : u < 1e3 ? "🎉" : u < 2e3 ? "🚗" : u < 5e3 ? "🤔" : "🥴";
|
326
|
+
B.info(`Generated CSS in ${u}ms! ${b}`);
|
322
327
|
} catch (s) {
|
323
328
|
console.error(s);
|
324
329
|
}
|
@@ -326,24 +331,24 @@ ${c}`;
|
|
326
331
|
try {
|
327
332
|
const s = [], n = l(t, "./saltygen"), i = l(n, "index.css");
|
328
333
|
if (W(e)) {
|
329
|
-
const
|
330
|
-
Object.entries(
|
331
|
-
if (
|
332
|
-
const a = `css/${`a_${
|
333
|
-
|
334
|
+
const f = await U(t), g = await q(t, e, n);
|
335
|
+
Object.entries(g).forEach(([j, $]) => {
|
336
|
+
if ($.isKeyframes && $.css) {
|
337
|
+
const a = `css/${`a_${$.animationName}.css`}`, d = l(n, a);
|
338
|
+
N(d, $.css);
|
334
339
|
return;
|
335
340
|
}
|
336
|
-
if (
|
337
|
-
const
|
338
|
-
name:
|
339
|
-
config:
|
340
|
-
}),
|
341
|
-
s.push(
|
341
|
+
if (!$.generator) return;
|
342
|
+
const F = $.generator._withBuildContext({
|
343
|
+
name: j,
|
344
|
+
config: f
|
345
|
+
}), E = `css/${F.cssFileName}`, u = l(n, E);
|
346
|
+
s.push(F.cssFileName), N(u, F.css);
|
342
347
|
});
|
343
|
-
const
|
344
|
-
`), o = s.map((
|
348
|
+
const c = z(i, "utf8").split(`
|
349
|
+
`), o = s.map((j) => `@import url('../saltygen/css/${j}');`), w = [.../* @__PURE__ */ new Set([...c, ...o])].join(`
|
345
350
|
`);
|
346
|
-
|
351
|
+
N(i, w);
|
347
352
|
}
|
348
353
|
} catch (s) {
|
349
354
|
console.error(s);
|
@@ -353,35 +358,35 @@ ${c}`;
|
|
353
358
|
const n = l(t, "./saltygen");
|
354
359
|
if (W(e)) {
|
355
360
|
const r = z(e, "utf8");
|
356
|
-
r.replace(/^(?!export\s)const\s.*/gm, (
|
357
|
-
const
|
361
|
+
r.replace(/^(?!export\s)const\s.*/gm, (y) => `export ${y}`) !== r && await yt(e, r);
|
362
|
+
const g = await U(t), c = await q(t, e, n);
|
358
363
|
let o = r;
|
359
|
-
if (Object.entries(
|
360
|
-
var
|
361
|
-
if (
|
362
|
-
const
|
363
|
-
name:
|
364
|
-
config:
|
364
|
+
if (Object.entries(c).forEach(([y, w]) => {
|
365
|
+
var k;
|
366
|
+
if (w.isKeyframes || !w.generator) return;
|
367
|
+
const j = w.generator._withBuildContext({
|
368
|
+
name: y,
|
369
|
+
config: g,
|
365
370
|
prod: s
|
366
|
-
}),
|
367
|
-
if (
|
368
|
-
const
|
369
|
-
if (!
|
370
|
-
const { index:
|
371
|
-
let
|
372
|
-
const a = setTimeout(() =>
|
373
|
-
let
|
374
|
-
for (; !
|
375
|
-
const
|
376
|
-
|
371
|
+
}), $ = new RegExp(`\\s${y}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(r);
|
372
|
+
if (!$) return console.error("Could not find the original declaration");
|
373
|
+
const F = (k = $.at(1)) == null ? void 0 : k.trim(), E = new RegExp(`\\s${y}[=\\s]+styled\\(`, "g").exec(o);
|
374
|
+
if (!E) return console.error("Could not find the original declaration");
|
375
|
+
const { index: u } = E;
|
376
|
+
let b = !1;
|
377
|
+
const a = setTimeout(() => b = !0, 5e3);
|
378
|
+
let d = 0, x = !1, S = 0;
|
379
|
+
for (; !x && !b; ) {
|
380
|
+
const h = o[u + d];
|
381
|
+
h === "(" && S++, h === ")" && S--, S === 0 && h === ")" && (x = !0), d > o.length && (b = !0), d++;
|
377
382
|
}
|
378
|
-
if (!
|
383
|
+
if (!b) clearTimeout(a);
|
379
384
|
else throw new Error("Failed to find the end of the styled call and timed out");
|
380
|
-
const
|
381
|
-
o = o.replace(
|
382
|
-
}),
|
383
|
-
const
|
384
|
-
o = `import '../../saltygen/css/${`f_${
|
385
|
+
const P = u + d, C = o.slice(u, P), p = o, m = ` ${y} = styled(${F}, "${j.classNames}", ${JSON.stringify(j.props)});`;
|
386
|
+
o = o.replace(C, m), p === o && console.error("Minimize file failed to change content", { name: y, tagName: F });
|
387
|
+
}), g.importStrategy === "component") {
|
388
|
+
const y = L(e, 6), w = K(e);
|
389
|
+
o = `import '../../saltygen/css/${`f_${V(w.name)}-${y}.css`}';
|
385
390
|
${o}`;
|
386
391
|
}
|
387
392
|
return o = o.replace("{ styled }", "{ styledClient as styled }"), o = o.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), o;
|
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.134",
|
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.134"
|
38
38
|
}
|
39
39
|
}
|