@salty-css/vite 0.0.1-alpha.247 → 0.0.1-alpha.249
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -8
- package/index.cjs +28 -24
- package/index.js +312 -306
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -64,6 +64,14 @@ To get help with problems, [Join Salty CSS Discord server](https://discord.gg/R6
|
|
|
64
64
|
- [defineViewportClamp](#viewport-clamp) - create CSS clamp functions that are based on user's viewport and can calculate relative values easily
|
|
65
65
|
- [color](#color-function) - transform any valid color code or variable to be darker, lighter etc. easily (uses [color library by Qix-](https://github.com/Qix-/color))
|
|
66
66
|
|
|
67
|
+
### Salty CSS CLI
|
|
68
|
+
|
|
69
|
+
In your existing repository you can use `npx salty-css [command]` to initialize a project, generate components, update related packages and build required files.
|
|
70
|
+
|
|
71
|
+
- Initialize project → `npx salty-css init [directory]` - Installs required packages, detects framework in use and creates project files to the provided directory. Directory can be left blank if you want files to be created to the current directory.
|
|
72
|
+
- Generate component → `npx salty-css update [version]` - Update @salty-css packages in your repository. Default version is "latest". Additional options like `--dir`, `--tag`, `--name` and `--className` are also supported.
|
|
73
|
+
- Build files → `npx salty-css build [directory/filename]` - Compile Salty CSS related files in your project. This should not be needed if you are using tools like Next.js or Vite
|
|
74
|
+
|
|
67
75
|
## Styled function
|
|
68
76
|
|
|
69
77
|
Styled function is the main way to use Salty CSS within React. Styled function creates a React component that then can be used anywhere in your app. All styled functions must be created in `.css.ts` or `.css.tsx` files
|
|
@@ -375,14 +383,6 @@ import { color } from '@salty-css/core/helpers';
|
|
|
375
383
|
export const Wrapper = styled('span', { base: { backgroundColor: color('#000').alpha(0.5) } });
|
|
376
384
|
```
|
|
377
385
|
|
|
378
|
-
## Salty CSS CLI
|
|
379
|
-
|
|
380
|
-
In your existing repository you can use `npx salty-css [command]` to initialize a project, generate components, update related packages and build required files.
|
|
381
|
-
|
|
382
|
-
- Initialize project → `npx salty-css init [directory]` - Installs required packages, detects framework in use and creates project files to the provided directory. Directory can be left blank if you want files to be created to the current directory.
|
|
383
|
-
- Generate component → `npx salty-css update [version]` - Update @salty-css packages in your repository. Default version is "latest". Additional options like `--dir`, `--tag`, `--name` and `--className` are also supported.
|
|
384
|
-
- Build files → `npx salty-css build [directory]` - Compile Salty CSS related files in your project. This should not be needed if you are using tools like Next.js or Vite
|
|
385
|
-
|
|
386
386
|
## Usage
|
|
387
387
|
|
|
388
388
|
### Next.js
|
package/index.cjs
CHANGED
|
@@ -1,42 +1,46 @@
|
|
|
1
|
-
"use strict";var Rt=Object.defineProperty;var
|
|
2
|
-
`);if(!
|
|
3
|
-
${
|
|
4
|
-
}`:
|
|
5
|
-
`),
|
|
6
|
-
`)},
|
|
1
|
+
"use strict";var Rt=Object.defineProperty;var Mt=(t,e,s)=>e in t?Rt(t,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[e]=s;var st=(t,e,s)=>Mt(t,typeof e!="symbol"?e+"":e,s);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const zt=require("esbuild"),Jt=require("child_process"),c=require("path"),d=require("fs"),pt=require("fs/promises"),X=require("winston"),ft=require("typescript");var ut=typeof document<"u"?document.currentScript:null;function Wt(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 Ft=Wt(zt),bt=t=>String.fromCharCode(t+(t>25?39:97)),At=(t,e)=>{let s="",n;for(n=Math.abs(t);n>52;n=n/52|0)s=bt(n%52)+s;return s=bt(n%52)+s,s.length<e?s=s.padStart(e,"a"):s.length>e&&(s=s.slice(-e)),s},qt=(t,e)=>{let s=e.length;for(;s;)t=t*33^e.charCodeAt(--s);return t},q=(t,e=5)=>{const s=qt(5381,JSON.stringify(t))>>>0;return At(s,e)};function M(t){return t?typeof t!="string"?M(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 It=t=>e=>{if(typeof e!="string"||!t)return;let s=e;const n=[];return Object.values(t).forEach(o=>{const{pattern:r,transform:i}=o;s=s.replace(r,y=>{const{value:$,css:m}=i(y);return m&&n.push(m),$})}),{transformed:s,additionalCss:n}},Ct=t=>e=>typeof e!="string"||!/\{[^{}]+\}/g.test(e)?void 0:{transformed:e.replace(/\{([^{}]+)\}/g,(...o)=>`var(--${M(o[1].replaceAll(".","-"))})`)},Ht=Ct(),Gt=["top","right","bottom","left","min-width",/.*width.*/,/^[^line]*height.*/,/padding.*/,/margin.*/,/border.*/,/inset.*/,/.*radius.*/,/.*spacing.*/,/.*gap.*/,/.*indent.*/,/.*offset.*/,/.*size.*/,/.*thickness.*/,/.*font-size.*/],Lt=(t,e,s)=>Gt.some(o=>typeof o=="string"?o===t:o.test(t))?`${e}px`:`${e}`,Qt=["Webkit","Moz","ms","O"],Kt=t=>t.startsWith("-")?t:Qt.some(e=>t.startsWith(e))?`-${M(t)}`:M(t),nt=async(t,e="",s,n=!1)=>{if(!t)throw new Error("No styles provided to parseStyles function!");const o=new Set,r=Object.entries(t),i=async([p,u])=>{const w=p.trim(),P=Kt(w),T=(D,J=";")=>`${P}:${D}${J}`,V={scope:e,config:s};if(typeof u=="function")return i([p,u(V)]);if(u instanceof Promise)return i([p,await u]);if(typeof u=="object"){if(!u)return;if(u.isColor)return T(u.toString());if(w==="defaultVariants")return;if(w==="variants"){const N=Object.entries(u);for(const[v,f]of N){if(!f)continue;const b=Object.entries(f);for(const[F,a]of b){if(!a)continue;const C=`${e}.${v}-${F}`;(await nt(a,C,s)).forEach(R=>o.add(R))}}return}if(w==="compoundVariants"){for(const N of u){const{css:v,...f}=N,b=Object.entries(f).reduce((a,[C,_])=>`${a}.${C}-${_}`,e);(await nt(v,b,s)).forEach(a=>o.add(a))}return}if(w.startsWith("@")){const N=w,v=await Y(u,e,s),f=`${N} { ${v} }`;o.add(f);return}const D=p.includes("&")?w.replace("&",e):w.startsWith(":")?`${e}${w}`:`${e} ${w}`;(await nt(u,D,s)).forEach(N=>o.add(N));return}if(typeof u=="number"){const D=Lt(P,u);return T(D)}if(typeof u!="string")if("toString"in u)u=u.toString();else throw new Error(`Invalid value type for property ${P}`);return T(u)},y=r.map(i),{modifiers:$}={},m=[Ct(),It($)],g=(await Promise.all(y).then(p=>Promise.all(p.map(u=>m.reduce(async(w,P)=>{const T=await w;if(!T)return T;const V=await P(T);if(!V)return T;const{transformed:D,additionalCss:J}=V;let N="";if(J)for(const v of J)N+=await Y(v,"");return`${N}${D}`},Promise.resolve(u)))))).filter(p=>p!==void 0).join(`
|
|
2
|
+
`);if(!g.trim())return Array.from(o);const h=e?`${e} {
|
|
3
|
+
${g}
|
|
4
|
+
}`:g;return o.has(h)?Array.from(o):[h,...o]},Y=async(t,e,s,n=!1)=>(await nt(t,e,s,n)).join(`
|
|
5
|
+
`),Pt=async(t,e=[])=>{if(!t)return"";const s=[],n={};for(const[o,r]of Object.entries(t))if(typeof r!="function")if(r&&typeof r=="object"){const i=o.trim(),y=await Pt(r,[...e,i]);s.push(y)}else n[o]=r;if(Object.keys(n).length){const o=e.map(M).join("-"),r="t_"+q(o,4),i=await Y(n,`.${o}, .${r}`);s.push(i)}return s.join(`
|
|
6
|
+
`)},Ut=t=>t?Object.entries(t).reduce((e,[s,n])=>(typeof n=="function"?e[s]="any":typeof n=="object"&&(e[s]=Nt(n).map(o=>`"${o}"`).join(" | ")),e),{}):{},Nt=(t,e="",s=new Set)=>t?(Object.entries(t).forEach(([n,o])=>{const r=e?`${e}.${n}`:n;return typeof o=="object"?Nt(o,r,s):s.add(e)}),[...s]):[],_t=t=>{if(!t||t==="/")throw new Error("Could not find package.json file");const e=c.join(t,"package.json");return d.existsSync(e)?e:_t(c.join(t,".."))},Zt=async t=>{const e=_t(t);return await pt.readFile(e,"utf-8").then(JSON.parse).catch(()=>{})},Bt=async t=>{const e=await Zt(t);if(e)return e.type};let H;const xt=async t=>{if(H)return H;const e=await Bt(t);return e==="module"?H="esm":(e==="commonjs"||(typeof document>"u"?require("url").pathToFileURL(__filename).href:ut&&ut.tagName.toUpperCase()==="SCRIPT"&&ut.src||new URL("index.cjs",document.baseURI).href).endsWith(".cjs"))&&(H="cjs"),H||"esm"},dt=X.createLogger({level:"debug",format:X.format.combine(X.format.colorize(),X.format.cli()),transports:[new X.transports.Console({})]});function Tt(t){return t?typeof t!="string"?Tt(String(t)):t.replace(/[^\d\w]/g,"."):""}const Xt={"*, *::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"}},G=(...t)=>t.flat().reduce((e,s)=>s!=null&&s._current?{...e,...s._current}:{...e,...s},{}),Yt=(...t)=>t.flat().reduce((e,s)=>({...e,...s._children}),{});class te{constructor(e){st(this,"_path");this.params=e}get _current(){return this.params.template}get isDefineTemplate(){return!0}_setPath(e){return this._path=e,this}}class ee{constructor(e){st(this,"_path");st(this,"templates",[]);this.params=e,Object.entries(e).forEach(([s,n])=>{this.templates.push(new te({name:s,template:n}))})}get _current(){return this.params}get _children(){return Object.fromEntries(this.templates.map(e=>[e.params.name,e]))}get isDefineTemplates(){return!0}_setPath(e){return this._path=e,this.templates.forEach(s=>s._setPath(e)),this}}const se=t=>new ee(t),ne=(t,e)=>new Promise((s,n)=>{const o=setTimeout(()=>{n(new Error("Timeout"))},100),r=ft.createSourceFile("temp.ts",t,ft.ScriptTarget.Latest,!0);function i(y){if(ft.isVariableDeclaration(y)&&y.name.getText()===e){const $=y.getStart(),m=y.getEnd();clearTimeout(o),s([$,m])}y.forEachChild(i)}i(r)}),z={externalModules:[],rcFile:void 0,destDir:void 0},kt=t=>{if(z.externalModules.length>0)return z.externalModules;const s=d.readFileSync(t,"utf8").match(/externalModules:\s?\[(.*)\]/);if(!s)return[];const n=s[1].split(",").map(o=>o.replace(/['"`]/g,"").trim());return z.externalModules=n,n},I=async t=>{if(z.destDir)return z.destDir;const e=await mt(t),s=c.join(t,(e==null?void 0:e.saltygenDir)||"saltygen");return z.destDir=s,s},Dt=["salty","css","styles","styled"],oe=(t=[])=>new RegExp(`\\.(${[...Dt,...t].join("|")})\\.`),L=(t,e=[])=>oe(e).test(t),Ot=async t=>{if(z.rcFile)return z.rcFile;if(t==="/")throw new Error("Could not find .saltyrc.json file");const e=c.join(t,".saltyrc.json"),s=await pt.readFile(e,"utf-8").then(JSON.parse).catch(()=>{});return s?(z.rcFile=s,s):Ot(c.join(t,".."))},mt=async t=>{var n,o;const e=await Ot(t),s=(n=e.projects)==null?void 0:n.find(r=>t.endsWith(r.dir||""));return s||((o=e.projects)==null?void 0:o.find(r=>r.dir===e.defaultProject))},ie=async t=>{const e=await mt(t),s=await I(t),n=c.join(t,(e==null?void 0:e.configDir)||"","salty.config.ts"),o=c.join(s,"salty.config.js"),r=await xt(t),i=kt(n);await Ft.build({entryPoints:[n],minify:!0,treeShaking:!0,bundle:!0,outfile:o,format:r,external:i});const y=Date.now(),{config:$}=await import(`${o}?t=${y}`);return{config:$,path:o}},re=async(t,e)=>{var gt,wt;const s=await I(t),n={mediaQueries:[],globalStyles:[],variables:[],templates:[]};await Promise.all([...e].map(async j=>{const{contents:x,outputFilePath:Z}=await ot(t,j,s);Object.entries(x).forEach(([O,k])=>{k.isMedia?n.mediaQueries.push([O,k]):k.isGlobalDefine?n.globalStyles.push(k):k.isDefineVariables?n.variables.push(k):k.isDefineTemplates&&n.templates.push(k._setPath(`${O};;${Z}`))})}));const{config:o,path:r}=await ie(t),i={...o},{mediaQueries:y}=n;i.mediaQueries=Object.fromEntries(y.map(([j,x])=>[`@${j}`,x]));const $=y.map(([j])=>`'@${j}'`).join(" | "),m=new Set,l=async(j,x=[])=>{if(!j)return[];const Z=Object.entries(j).map(async([k,A])=>{const B=async E=>{if(!E)return;if(E instanceof Promise)return await B(await E);if(typeof E=="function")return await B(await E());if(typeof E=="object")return await l(E,[...x,k]);const at=Tt(k),ct=M(k),lt=[...x,at].join(".");m.add(`"${lt}"`);const et=[...x.map(M),ct].join("-"),$t=Ht(E);return $t?`--${et}: ${$t.transformed};`:`--${et}: ${E};`};return await B(A)});return(await Promise.all(Z)).flat()},g=async j=>{if(!j)return[];const x=Object.entries(j).map(async([O,k])=>{const A=await l(k);return O==="base"?A.join(""):i.mediaQueries[O]?`${i.mediaQueries[O]} { ${A.join("")} }`:`${O} { ${A.join("")} }`});return(await Promise.all(x)).flat()},h=async j=>{if(!j)return[];const x=Object.entries(j).map(async([O,k])=>{const A=Object.entries(k).map(async([E,at])=>{const ct=await l(at,[O]),lt=`.${O}-${E}, [data-${O}="${E}"]`,et=ct.join("");return`${lt} { ${et} }`});return(await Promise.all(A)).flat()});return(await Promise.all(x)).flat()},S=j=>({...j,responsive:void 0,conditional:void 0}),p=j=>n.variables.map(x=>j==="static"?S(x._current):x._current[j]),u=G(S(o.variables),p("static")),w=await l(u),P=G((gt=o.variables)==null?void 0:gt.responsive,p("responsive")),T=await g(P),V=G((wt=o.variables)==null?void 0:wt.conditional,p("conditional")),D=await h(V),J=c.join(s,"css/_variables.css"),N=`:root { ${w.join("")} ${T.join("")} } ${D.join("")}`;d.writeFileSync(J,N),i.staticVariables=u;const v=c.join(s,"css/_global.css"),f=G(o.global,n.globalStyles),b=await Y(f,"");d.writeFileSync(v,`@layer global { ${b} }`);const F=c.join(s,"css/_reset.css"),C=o.reset==="none"?{}:typeof o.reset=="object"?o.reset:Xt,_=await Y(C,"");d.writeFileSync(F,`@layer reset { ${_} }`);const R=c.join(s,"css/_templates.css"),W=G(o.templates,n.templates),Q=await Pt(W),K=Ut(W);d.writeFileSync(R,`@layer templates { ${Q} }`),i.templates=W;const tt=o.templates?[se(o.templates)._setPath(`config;;${r}`)]:[],it=Yt(n.templates,tt);i.templatePaths=Object.fromEntries(Object.entries(it).map(([j,x])=>[j,x._path]));const U=c.join(s,"types/css-tokens.d.ts"),Vt=`
|
|
7
7
|
// Variable types
|
|
8
8
|
type VariableTokens = ${[...m].join("|")};
|
|
9
9
|
type PropertyValueToken = \`{\${VariableTokens}}\`;
|
|
10
10
|
|
|
11
11
|
// Template types
|
|
12
12
|
type TemplateTokens = {
|
|
13
|
-
${Object.entries(
|
|
13
|
+
${Object.entries(K).map(([j,x])=>`${j}?: ${x}`).join(`
|
|
14
14
|
`)}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
// Media query types
|
|
18
|
-
type MediaQueryKeys = ${
|
|
19
|
-
`;d.writeFileSync(
|
|
18
|
+
type MediaQueryKeys = ${$||"''"};
|
|
19
|
+
`;d.writeFileSync(U,Vt);const vt=c.join(s,"cache/config-cache.json");d.writeFileSync(vt,JSON.stringify(i,null,2))},St=t=>t.replace(/styled\(([^"'`{,]+),/g,(e,s)=>{if(/^['"`]/.test(s))return e;const o=new RegExp(`import[^;]*${s}[,\\s{][^;]*from\\s?([^{};]+);`);if(!o.test(t))return e;const i=o.exec(t);if(i){const y=i.at(1);if(Dt.some(m=>y==null?void 0:y.includes(m)))return e}return"styled('div',"}),ae=(t,e)=>{try{const s=d.readFileSync(c.join(e,"saltygen/cache/config-cache.json"),"utf8");return s?`globalThis.saltyConfig = ${s};
|
|
20
20
|
|
|
21
21
|
${t}`:`globalThis.saltyConfig = {};
|
|
22
22
|
|
|
23
|
-
${t}`}catch{return t}},ot=async(t,e,s)=>{const n=q(e),o=c.join(s,"./temp");d.existsSync(o)||d.mkdirSync(o);const r=c.parse(e);let i=d.readFileSync(e,"utf8");i=
|
|
24
|
-
`),
|
|
25
|
-
`);let
|
|
23
|
+
${t}`}catch{return t}},ot=async(t,e,s)=>{const n=q(e),o=c.join(s,"./temp");d.existsSync(o)||d.mkdirSync(o);const r=c.parse(e);let i=d.readFileSync(e,"utf8");i=St(i),i=ae(i,t);const y=c.join(s,"js",n+".js"),$=await mt(t),m=c.join(t,($==null?void 0:$.configDir)||"","salty.config.ts"),l=kt(m),g=await xt(t);await Ft.build({stdin:{contents:i,sourcefile:r.base,resolveDir:r.dir,loader:"tsx"},minify:!1,treeShaking:!0,bundle:!0,outfile:y,format:g,target:["node20"],keepNames:!0,external:l,packages:"external",plugins:[{name:"test",setup:p=>{p.onLoad({filter:/.*\.css|salty|styles|styled\.ts/},u=>{const w=d.readFileSync(u.path,"utf8");return{contents:St(w),loader:"ts"}})}}]});const h=Date.now();return{contents:await import(`${y}?t=${h}`),outputFilePath:y}},ce=async t=>{const e=await I(t),s=c.join(e,"cache/config-cache.json"),n=d.readFileSync(s,"utf8");if(!n)throw new Error("Could not find config cache file");return JSON.parse(n)},yt=async t=>{const e=await ce(t),s=await I(t),n=c.join(s,"salty.config.js"),o=Date.now(),{config:r}=await import(`${n}?t=${o}`);return G(r,e)},ht=()=>{try{return process.env.NODE_ENV==="production"}catch{return!1}},le=async(t,e=ht(),s=!0)=>{try{const n=Date.now();e?dt.info("Generating CSS in production mode! 🔥"):dt.info("Generating CSS in development mode! 🚀");const o=[],r=[],i=await I(t),y=c.join(i,"index.css");s&&(()=>{d.existsSync(i)&&Jt.execSync("rm -rf "+i),d.mkdirSync(i,{recursive:!0}),d.mkdirSync(c.join(i,"css")),d.mkdirSync(c.join(i,"types")),d.mkdirSync(c.join(i,"js")),d.mkdirSync(c.join(i,"cache"))})();const m=new Set,l=new Set;async function g(f){const b=["node_modules","saltygen"],F=d.statSync(f);if(F.isDirectory()){const a=d.readdirSync(f);if(b.some(_=>f.includes(_)))return;await Promise.all(a.map(_=>g(c.join(f,_))))}else if(F.isFile()&&L(f)){m.add(f);const C=d.readFileSync(f,"utf8");/define[\w\d]+\(/.test(C)&&l.add(f)}}await g(t),await re(t,l);const h={keyframes:[],components:[],classNames:[]};await Promise.all([...m].map(async f=>{const{contents:b}=await ot(t,f,i);for(let[F,a]of Object.entries(b))a instanceof Promise&&(a=await a),a.isKeyframes?h.keyframes.push({value:a,src:f,name:F}):a.isClassName?h.classNames.push({...a,src:f,name:F}):a.generator&&h.components.push({...a,src:f,name:F})}));const S=await yt(t);for(const f of h.keyframes){const{value:b}=f,F=`a_${b.animationName}.css`,a=`css/${F}`,C=c.join(i,a);o.push(F),d.writeFileSync(C,b.css)}const p={};for(const f of h.components){const{src:b,name:F}=f;p[b]||(p[b]=[]);const a=f.generator._withBuildContext({callerName:F,isProduction:e,config:S});r[a.priority]||(r[a.priority]=[]);const C=await a.css;if(!C)continue;r[a.priority].push(a.cssFileName);const _=`css/${a.cssFileName}`,R=c.join(i,_);d.writeFileSync(R,C),S.importStrategy==="component"&&p[b].push(a.cssFileName)}for(const f of h.classNames){const{src:b,name:F}=f;p[b]||(p[b]=[]);const a=f.generator._withBuildContext({callerName:F,isProduction:e,config:S}),C=await a.css;if(!C)continue;r[a.priority]||(r[a.priority]=[]),r[a.priority].push(a.cssFileName);const _=`css/${a.cssFileName}`,R=c.join(i,_);d.writeFileSync(R,C),S.importStrategy==="component"&&p[b].push(a.cssFileName)}S.importStrategy==="component"&&Object.entries(p).forEach(([f,b])=>{const F=b.map(W=>`@import url('./${W}');`).join(`
|
|
24
|
+
`),a=q(f,6),C=c.parse(f),_=M(C.name),R=c.join(i,`css/f_${_}-${a}.css`);d.writeFileSync(R,F||"/* Empty file */")});const u=o.map(f=>`@import url('./css/${f}');`).join(`
|
|
25
|
+
`);let D=`/*!
|
|
26
|
+
* Generated with Salty CSS (https://salty-css.dev)
|
|
27
|
+
* Do not edit this file directly
|
|
28
|
+
*/
|
|
29
|
+
@layer reset, global, templates, l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
|
26
30
|
|
|
27
|
-
${["_variables.css","_reset.css","_global.css","_templates.css"].filter(
|
|
31
|
+
${["_variables.css","_reset.css","_global.css","_templates.css"].filter(f=>{try{return d.readFileSync(c.join(i,"css",f),"utf8").length>0}catch{return!1}}).map(f=>`@import url('./css/${f}');`).join(`
|
|
28
32
|
`)}
|
|
29
|
-
${u}`;if(S.importStrategy!=="component"){const
|
|
30
|
-
/*start:${
|
|
33
|
+
${u}`;if(S.importStrategy!=="component"){const f=r.reduce((b,F,a)=>{const C=F.reduce((Q,K)=>{var rt;const tt=c.join(i,"css",K),it=d.readFileSync(tt,"utf8"),U=((rt=/.*-([^-]+)-\d+.css/.exec(K))==null?void 0:rt.at(1))||q(tt,6);return Q.includes(U)?Q:`${Q}
|
|
34
|
+
/*start:${U}-${K}*/
|
|
31
35
|
${it}
|
|
32
|
-
/*end:${
|
|
33
|
-
`},""),
|
|
34
|
-
}`;return d.writeFileSync(
|
|
35
|
-
@import url('./css/${
|
|
36
|
-
${
|
|
36
|
+
/*end:${U}*/
|
|
37
|
+
`},""),_=`l_${a}.css`,R=c.join(i,"css",_),W=`@layer l${a} { ${C}
|
|
38
|
+
}`;return d.writeFileSync(R,W),`${b}
|
|
39
|
+
@import url('./css/${_}');`},"");D+=f}d.writeFileSync(y,D);const N=Date.now()-n,v=N<200?"🔥":N<500?"🚀":N<1e3?"🎉":N<2e3?"🚗":N<5e3?"🤔":"🥴";dt.info(`Generated CSS in ${N}ms! ${v}`)}catch(n){console.error(n)}},fe=async(t,e,s=ht())=>{try{const n=await I(t);if(L(e)){const r=[],i=await yt(t),{contents:y}=await ot(t,e,n);for(const[$,m]of Object.entries(y)){if(m.isKeyframes&&m.css){const u=`css/${`a_${m.animationName}.css`}`,w=c.join(n,u);d.writeFileSync(w,await m.css);continue}if(m.isClassName){const p=m.generator._withBuildContext({callerName:$,isProduction:s,config:i}),u=await p.css;if(!u)continue;r[p.priority]||(r[p.priority]=[]),r[p.priority].push(p.cssFileName);const w=`css/${p.cssFileName}`,P=c.join(n,w);d.writeFileSync(P,u);continue}if(!m.generator)continue;const l=m.generator._withBuildContext({callerName:$,isProduction:s,config:i}),g=await l.css;if(!g)continue;const h=`css/${l.cssFileName}`,S=c.join(n,h);d.writeFileSync(S,g),r[l.priority]||(r[l.priority]=[]),r[l.priority].push(l.cssFileName)}if(i.importStrategy!=="component")r.forEach(($,m)=>{const l=`l_${m}.css`,g=c.join(n,"css",l);let h=d.readFileSync(g,"utf8");$.forEach(S=>{var P;const p=c.join(n,"css",S),u=((P=/.*-([^-]+)-\d+.css/.exec(S))==null?void 0:P.at(1))||q(p,6);if(!h.includes(u)){const T=d.readFileSync(p,"utf8"),V=`/*start:${u}-${S}*/
|
|
40
|
+
${T}
|
|
37
41
|
/*end:${u}*/
|
|
38
42
|
`;h=`${h.replace(/\}$/,"")}
|
|
39
|
-
${
|
|
40
|
-
}`}}),d.writeFileSync(
|
|
41
|
-
`),m=q(e,6),l=c.parse(e),
|
|
42
|
-
${l}`}return l=l.replace("@salty-css/react/class-name","@salty-css/react/class-name-client"),l=l.replace("{ styled }","{ styledClient as styled }"),l=l.replace("@salty-css/react/styled","@salty-css/react/styled-client"),l}}catch(r){console.error("Error in minimizeFile:",r)}},
|
|
43
|
+
${V}
|
|
44
|
+
}`}}),d.writeFileSync(g,h)});else{const $=r.flat().map(S=>`@import url('./${S}');`).join(`
|
|
45
|
+
`),m=q(e,6),l=c.parse(e),g=M(l.name),h=c.join(n,`css/f_${g}-${m}.css`);d.writeFileSync(h,$||"/* Empty file */")}}}catch(n){console.error(n)}},ue=async(t,e,s=ht())=>{var n,o;try{const r=await I(t);if(L(e)){const y=d.readFileSync(e,"utf8"),$=await yt(t),{contents:m}=await ot(t,e,r);let l=y;for(const[g,h]of Object.entries(m)){if(h.isKeyframes||!h.generator)continue;const S=h.generator._withBuildContext({callerName:g,isProduction:s,config:$}),[p,u]=await ne(l,g),w=l.slice(p,u);if(h.isClassName){const P=l,T=` ${g} = className("${S.classNames}")`;l=l.replace(w,T),P===l&&console.error("Minimize file failed to change content",{name:g})}if(w.includes("styled")){const P=(o=(n=/styled\(([^,]+),/.exec(w))==null?void 0:n.at(1))==null?void 0:o.trim(),T=l,V=` ${g} = styled(${P}, "${S.classNames}", ${JSON.stringify(S.clientProps)})`;l=l.replace(w,V),T===l&&console.error("Minimize file failed to change content",{name:g,tagName:P})}}if($.importStrategy==="component"){const g=q(e,6),h=c.parse(e);l=`import '../../saltygen/css/${`f_${M(h.name)}-${g}.css`}';
|
|
46
|
+
${l}`}return l=l.replace("@salty-css/react/class-name","@salty-css/react/class-name-client"),l=l.replace("{ styled }","{ styledClient as styled }"),l=l.replace("@salty-css/react/styled","@salty-css/react/styled-client"),l}}catch(r){console.error("Error in minimizeFile:",r)}},jt=async t=>{if(!t||t.includes("node_modules")||t.includes("saltygen"))return!1;if(t.includes("salty.config"))return!0;if(!L(t))return!1;const n=await pt.readFile(t,"utf-8");return!!(/.+define[A-Z]\w+/.test(n)||/.+keyframes\(.+/.test(n))},Et=t=>({name:"stylegen",buildStart:()=>le(t),load:async e=>{if(L(e))return await ue(t,e)},handleHotUpdate:async({file:e,server:s})=>{await jt(e)&&s.restart()},watchChange:{handler:async(e,s)=>{L(e)&&s.event!=="delete"&&(await jt(e)||await fe(t,e))}}});exports.default=Et;exports.saltyPlugin=Et;
|
package/index.js
CHANGED
|
@@ -1,40 +1,40 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var nt = (e, t, s) =>
|
|
4
|
-
import * as
|
|
5
|
-
import { execSync as
|
|
1
|
+
var Jt = Object.defineProperty;
|
|
2
|
+
var zt = (e, t, s) => t in e ? Jt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s;
|
|
3
|
+
var nt = (e, t, s) => zt(e, typeof t != "symbol" ? t + "" : t, s);
|
|
4
|
+
import * as Nt from "esbuild";
|
|
5
|
+
import { execSync as Wt } from "child_process";
|
|
6
6
|
import { join as u, parse as rt } from "path";
|
|
7
|
-
import { existsSync as
|
|
8
|
-
import { readFile as
|
|
9
|
-
import { createLogger as
|
|
7
|
+
import { existsSync as yt, mkdirSync as K, statSync as At, readdirSync as Ht, readFileSync as R, writeFileSync as T } from "fs";
|
|
8
|
+
import { readFile as ht } from "fs/promises";
|
|
9
|
+
import { createLogger as Gt, format as dt, transports as It } from "winston";
|
|
10
10
|
import pt from "typescript";
|
|
11
|
-
const
|
|
11
|
+
const jt = (e) => String.fromCharCode(e + (e > 25 ? 39 : 97)), Qt = (e, t) => {
|
|
12
12
|
let s = "", n;
|
|
13
|
-
for (n = Math.abs(e); n > 52; n = n / 52 | 0) s =
|
|
14
|
-
return s =
|
|
15
|
-
},
|
|
13
|
+
for (n = Math.abs(e); n > 52; n = n / 52 | 0) s = jt(n % 52) + s;
|
|
14
|
+
return s = jt(n % 52) + s, s.length < t ? s = s.padStart(t, "a") : s.length > t && (s = s.slice(-t)), s;
|
|
15
|
+
}, Kt = (e, t) => {
|
|
16
16
|
let s = t.length;
|
|
17
17
|
for (; s; ) e = e * 33 ^ t.charCodeAt(--s);
|
|
18
18
|
return e;
|
|
19
|
-
},
|
|
20
|
-
const s =
|
|
19
|
+
}, G = (e, t = 5) => {
|
|
20
|
+
const s = Kt(5381, JSON.stringify(e)) >>> 0;
|
|
21
21
|
return Qt(s, t);
|
|
22
22
|
};
|
|
23
23
|
function J(e) {
|
|
24
24
|
return e ? typeof e != "string" ? J(String(e)) : e.replace(/[\s.]/g, "-").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g, (t, s) => (s > 0 ? "-" : "") + t.toLowerCase()) : "";
|
|
25
25
|
}
|
|
26
|
-
const
|
|
26
|
+
const Lt = (e) => (t) => {
|
|
27
27
|
if (typeof t != "string" || !e) return;
|
|
28
28
|
let s = t;
|
|
29
29
|
const n = [];
|
|
30
30
|
return Object.values(e).forEach((o) => {
|
|
31
31
|
const { pattern: a, transform: r } = o;
|
|
32
32
|
s = s.replace(a, (m) => {
|
|
33
|
-
const { value:
|
|
34
|
-
return
|
|
33
|
+
const { value: w, css: p } = r(m);
|
|
34
|
+
return p && n.push(p), w;
|
|
35
35
|
});
|
|
36
36
|
}), { transformed: s, additionalCss: n };
|
|
37
|
-
},
|
|
37
|
+
}, _t = (e) => (t) => typeof t != "string" || !/\{[^{}]+\}/g.test(t) ? void 0 : { transformed: t.replace(/\{([^{}]+)\}/g, (...o) => `var(--${J(o[1].replaceAll(".", "-"))})`) }, Zt = _t(), Bt = [
|
|
38
38
|
"top",
|
|
39
39
|
"right",
|
|
40
40
|
"bottom",
|
|
@@ -55,119 +55,119 @@ const Kt = (e) => (t) => {
|
|
|
55
55
|
/.*size.*/,
|
|
56
56
|
/.*thickness.*/,
|
|
57
57
|
/.*font-size.*/
|
|
58
|
-
],
|
|
58
|
+
], Ut = (e, t, s) => Bt.some((o) => typeof o == "string" ? o === e : o.test(e)) ? `${t}px` : `${t}`, qt = ["Webkit", "Moz", "ms", "O"], Xt = (e) => e.startsWith("-") ? e : qt.some((t) => e.startsWith(t)) ? `-${J(e)}` : J(e), ot = async (e, t = "", s, n = !1) => {
|
|
59
59
|
if (!e) throw new Error("No styles provided to parseStyles function!");
|
|
60
|
-
const o = /* @__PURE__ */ new Set(), a = Object.entries(e), r = async ([
|
|
61
|
-
const
|
|
62
|
-
if (typeof f == "function") return r([
|
|
63
|
-
if (f instanceof Promise) return r([
|
|
60
|
+
const o = /* @__PURE__ */ new Set(), a = Object.entries(e), r = async ([d, f]) => {
|
|
61
|
+
const g = d.trim(), F = Xt(g), x = (k, W = ";") => `${F}:${k}${W}`, V = { scope: t, config: s };
|
|
62
|
+
if (typeof f == "function") return r([d, f(V)]);
|
|
63
|
+
if (f instanceof Promise) return r([d, await f]);
|
|
64
64
|
if (typeof f == "object") {
|
|
65
65
|
if (!f) return;
|
|
66
|
-
if (f.isColor) return
|
|
67
|
-
if (
|
|
68
|
-
if (
|
|
69
|
-
const
|
|
70
|
-
for (const [
|
|
71
|
-
if (!
|
|
72
|
-
const
|
|
73
|
-
for (const [
|
|
74
|
-
if (!
|
|
75
|
-
const
|
|
76
|
-
(await ot(
|
|
66
|
+
if (f.isColor) return x(f.toString());
|
|
67
|
+
if (g === "defaultVariants") return;
|
|
68
|
+
if (g === "variants") {
|
|
69
|
+
const P = Object.entries(f);
|
|
70
|
+
for (const [v, l] of P) {
|
|
71
|
+
if (!l) continue;
|
|
72
|
+
const $ = Object.entries(l);
|
|
73
|
+
for (const [C, i] of $) {
|
|
74
|
+
if (!i) continue;
|
|
75
|
+
const j = `${t}.${v}-${C}`;
|
|
76
|
+
(await ot(i, j, s)).forEach((M) => o.add(M));
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
79
|
return;
|
|
80
80
|
}
|
|
81
|
-
if (
|
|
82
|
-
for (const
|
|
83
|
-
const { css:
|
|
84
|
-
(await ot(
|
|
81
|
+
if (g === "compoundVariants") {
|
|
82
|
+
for (const P of f) {
|
|
83
|
+
const { css: v, ...l } = P, $ = Object.entries(l).reduce((i, [j, N]) => `${i}.${j}-${N}`, t);
|
|
84
|
+
(await ot(v, $, s)).forEach((i) => o.add(i));
|
|
85
85
|
}
|
|
86
86
|
return;
|
|
87
87
|
}
|
|
88
|
-
if (
|
|
89
|
-
const
|
|
90
|
-
o.add(
|
|
88
|
+
if (g.startsWith("@")) {
|
|
89
|
+
const P = g, v = await tt(f, t, s), l = `${P} { ${v} }`;
|
|
90
|
+
o.add(l);
|
|
91
91
|
return;
|
|
92
92
|
}
|
|
93
|
-
const
|
|
94
|
-
(await ot(f,
|
|
93
|
+
const k = d.includes("&") ? g.replace("&", t) : g.startsWith(":") ? `${t}${g}` : `${t} ${g}`;
|
|
94
|
+
(await ot(f, k, s)).forEach((P) => o.add(P));
|
|
95
95
|
return;
|
|
96
96
|
}
|
|
97
97
|
if (typeof f == "number") {
|
|
98
|
-
const
|
|
99
|
-
return
|
|
98
|
+
const k = Ut(F, f);
|
|
99
|
+
return x(k);
|
|
100
100
|
}
|
|
101
101
|
if (typeof f != "string")
|
|
102
102
|
if ("toString" in f) f = f.toString();
|
|
103
103
|
else throw new Error(`Invalid value type for property ${F}`);
|
|
104
|
-
return
|
|
105
|
-
}, m = a.map(r), { modifiers:
|
|
106
|
-
|
|
107
|
-
const
|
|
108
|
-
if (!
|
|
109
|
-
const
|
|
110
|
-
if (!
|
|
111
|
-
const { transformed:
|
|
112
|
-
let
|
|
113
|
-
if (
|
|
114
|
-
for (const
|
|
115
|
-
|
|
116
|
-
return `${
|
|
104
|
+
return x(f);
|
|
105
|
+
}, m = a.map(r), { modifiers: w } = {}, p = [_t(), Lt(w)], h = (await Promise.all(m).then((d) => Promise.all(
|
|
106
|
+
d.map((f) => p.reduce(async (g, F) => {
|
|
107
|
+
const x = await g;
|
|
108
|
+
if (!x) return x;
|
|
109
|
+
const V = await F(x);
|
|
110
|
+
if (!V) return x;
|
|
111
|
+
const { transformed: k, additionalCss: W } = V;
|
|
112
|
+
let P = "";
|
|
113
|
+
if (W)
|
|
114
|
+
for (const v of W)
|
|
115
|
+
P += await tt(v, "");
|
|
116
|
+
return `${P}${k}`;
|
|
117
117
|
}, Promise.resolve(f)))
|
|
118
|
-
))).filter((
|
|
118
|
+
))).filter((d) => d !== void 0).join(`
|
|
119
119
|
`);
|
|
120
|
-
if (!
|
|
120
|
+
if (!h.trim()) return Array.from(o);
|
|
121
121
|
const y = t ? `${t} {
|
|
122
|
-
${
|
|
123
|
-
}` :
|
|
122
|
+
${h}
|
|
123
|
+
}` : h;
|
|
124
124
|
return o.has(y) ? Array.from(o) : [y, ...o];
|
|
125
|
-
},
|
|
126
|
-
`),
|
|
125
|
+
}, tt = async (e, t, s, n = !1) => (await ot(e, t, s, n)).join(`
|
|
126
|
+
`), xt = async (e, t = []) => {
|
|
127
127
|
if (!e) return "";
|
|
128
128
|
const s = [], n = {};
|
|
129
129
|
for (const [o, a] of Object.entries(e))
|
|
130
130
|
if (typeof a != "function") if (a && typeof a == "object") {
|
|
131
|
-
const r = o.trim(), m = await
|
|
131
|
+
const r = o.trim(), m = await xt(a, [...t, r]);
|
|
132
132
|
s.push(m);
|
|
133
133
|
} else
|
|
134
134
|
n[o] = a;
|
|
135
135
|
if (Object.keys(n).length) {
|
|
136
|
-
const o = t.map(J).join("-"), a = "t_" +
|
|
136
|
+
const o = t.map(J).join("-"), a = "t_" + G(o, 4), r = await tt(n, `.${o}, .${a}`);
|
|
137
137
|
s.push(r);
|
|
138
138
|
}
|
|
139
139
|
return s.join(`
|
|
140
140
|
`);
|
|
141
|
-
},
|
|
141
|
+
}, Yt = (e) => e ? Object.entries(e).reduce((t, [s, n]) => (typeof n == "function" ? t[s] = "any" : typeof n == "object" && (t[s] = Tt(n).map((o) => `"${o}"`).join(" | ")), t), {}) : {}, Tt = (e, t = "", s = /* @__PURE__ */ new Set()) => e ? (Object.entries(e).forEach(([n, o]) => {
|
|
142
142
|
const a = t ? `${t}.${n}` : n;
|
|
143
|
-
return typeof o == "object" ?
|
|
144
|
-
}), [...s]) : [],
|
|
143
|
+
return typeof o == "object" ? Tt(o, a, s) : s.add(t);
|
|
144
|
+
}), [...s]) : [], Dt = (e) => {
|
|
145
145
|
if (!e || e === "/") throw new Error("Could not find package.json file");
|
|
146
146
|
const t = u(e, "package.json");
|
|
147
|
-
return
|
|
148
|
-
}, Yt = async (e) => {
|
|
149
|
-
const t = Tt(e);
|
|
150
|
-
return await yt(t, "utf-8").then(JSON.parse).catch(() => {
|
|
151
|
-
});
|
|
147
|
+
return yt(t) ? t : Dt(u(e, ".."));
|
|
152
148
|
}, te = async (e) => {
|
|
153
|
-
const t =
|
|
149
|
+
const t = Dt(e);
|
|
150
|
+
return await ht(t, "utf-8").then(JSON.parse).catch(() => {
|
|
151
|
+
});
|
|
152
|
+
}, ee = async (e) => {
|
|
153
|
+
const t = await te(e);
|
|
154
154
|
if (t)
|
|
155
155
|
return t.type;
|
|
156
156
|
};
|
|
157
|
-
let
|
|
158
|
-
const
|
|
159
|
-
if (
|
|
160
|
-
const t = await
|
|
161
|
-
return t === "module" ?
|
|
162
|
-
},
|
|
157
|
+
let Q;
|
|
158
|
+
const kt = async (e) => {
|
|
159
|
+
if (Q) return Q;
|
|
160
|
+
const t = await ee(e);
|
|
161
|
+
return t === "module" ? Q = "esm" : (t === "commonjs" || import.meta.url.endsWith(".cjs")) && (Q = "cjs"), Q || "esm";
|
|
162
|
+
}, mt = Gt({
|
|
163
163
|
level: "debug",
|
|
164
|
-
format:
|
|
164
|
+
format: dt.combine(dt.colorize(), dt.cli()),
|
|
165
165
|
transports: [new It.Console({})]
|
|
166
166
|
});
|
|
167
|
-
function
|
|
168
|
-
return e ? typeof e != "string" ?
|
|
167
|
+
function Et(e) {
|
|
168
|
+
return e ? typeof e != "string" ? Et(String(e)) : e.replace(/[^\d\w]/g, ".") : "";
|
|
169
169
|
}
|
|
170
|
-
const
|
|
170
|
+
const se = {
|
|
171
171
|
/** Set box model to border-box */
|
|
172
172
|
"*, *::before, *::after": {
|
|
173
173
|
boxSizing: "border-box"
|
|
@@ -213,8 +213,8 @@ const ee = {
|
|
|
213
213
|
fontSize: "100%",
|
|
214
214
|
lineHeight: "1.15em"
|
|
215
215
|
}
|
|
216
|
-
}, L = (...e) => e.flat().reduce((t, s) => s != null && s._current ? { ...t, ...s._current } : { ...t, ...s }, {}),
|
|
217
|
-
class
|
|
216
|
+
}, L = (...e) => e.flat().reduce((t, s) => s != null && s._current ? { ...t, ...s._current } : { ...t, ...s }, {}), ne = (...e) => e.flat().reduce((t, s) => ({ ...t, ...s._children }), {});
|
|
217
|
+
class oe {
|
|
218
218
|
constructor(t) {
|
|
219
219
|
nt(this, "_path");
|
|
220
220
|
this.params = t;
|
|
@@ -229,13 +229,13 @@ class ne {
|
|
|
229
229
|
return this._path = t, this;
|
|
230
230
|
}
|
|
231
231
|
}
|
|
232
|
-
class
|
|
232
|
+
class re {
|
|
233
233
|
constructor(t) {
|
|
234
234
|
nt(this, "_path");
|
|
235
235
|
nt(this, "templates", []);
|
|
236
236
|
this.params = t, Object.entries(t).forEach(([s, n]) => {
|
|
237
237
|
this.templates.push(
|
|
238
|
-
new
|
|
238
|
+
new oe({
|
|
239
239
|
name: s,
|
|
240
240
|
template: n
|
|
241
241
|
})
|
|
@@ -257,14 +257,14 @@ class oe {
|
|
|
257
257
|
return this._path = t, this.templates.forEach((s) => s._setPath(t)), this;
|
|
258
258
|
}
|
|
259
259
|
}
|
|
260
|
-
const
|
|
260
|
+
const ae = (e) => new re(e), ie = (e, t) => new Promise((s, n) => {
|
|
261
261
|
const o = setTimeout(() => {
|
|
262
262
|
n(new Error("Timeout"));
|
|
263
263
|
}, 100), a = pt.createSourceFile("temp.ts", e, pt.ScriptTarget.Latest, !0);
|
|
264
264
|
function r(m) {
|
|
265
265
|
if (pt.isVariableDeclaration(m) && m.name.getText() === t) {
|
|
266
|
-
const
|
|
267
|
-
clearTimeout(o), s([
|
|
266
|
+
const w = m.getStart(), p = m.getEnd();
|
|
267
|
+
clearTimeout(o), s([w, p]);
|
|
268
268
|
}
|
|
269
269
|
m.forEachChild(r);
|
|
270
270
|
}
|
|
@@ -273,29 +273,29 @@ const re = (e) => new oe(e), ae = (e, t) => new Promise((s, n) => {
|
|
|
273
273
|
externalModules: [],
|
|
274
274
|
rcFile: void 0,
|
|
275
275
|
destDir: void 0
|
|
276
|
-
},
|
|
276
|
+
}, Ot = (e) => {
|
|
277
277
|
if (z.externalModules.length > 0) return z.externalModules;
|
|
278
278
|
const s = R(e, "utf8").match(/externalModules:\s?\[(.*)\]/);
|
|
279
279
|
if (!s) return [];
|
|
280
280
|
const n = s[1].split(",").map((o) => o.replace(/['"`]/g, "").trim());
|
|
281
281
|
return z.externalModules = n, n;
|
|
282
|
-
},
|
|
282
|
+
}, I = async (e) => {
|
|
283
283
|
if (z.destDir) return z.destDir;
|
|
284
|
-
const t = await
|
|
284
|
+
const t = await gt(e), s = u(e, (t == null ? void 0 : t.saltygenDir) || "saltygen");
|
|
285
285
|
return z.destDir = s, s;
|
|
286
|
-
},
|
|
286
|
+
}, Vt = ["salty", "css", "styles", "styled"], ce = (e = []) => new RegExp(`\\.(${[...Vt, ...e].join("|")})\\.`), Z = (e, t = []) => ce(t).test(e), vt = async (e) => {
|
|
287
287
|
if (z.rcFile) return z.rcFile;
|
|
288
288
|
if (e === "/") throw new Error("Could not find .saltyrc.json file");
|
|
289
|
-
const t = u(e, ".saltyrc.json"), s = await
|
|
289
|
+
const t = u(e, ".saltyrc.json"), s = await ht(t, "utf-8").then(JSON.parse).catch(() => {
|
|
290
290
|
});
|
|
291
|
-
return s ? (z.rcFile = s, s) :
|
|
292
|
-
},
|
|
291
|
+
return s ? (z.rcFile = s, s) : vt(u(e, ".."));
|
|
292
|
+
}, gt = async (e) => {
|
|
293
293
|
var n, o;
|
|
294
|
-
const t = await
|
|
294
|
+
const t = await vt(e), s = (n = t.projects) == null ? void 0 : n.find((a) => e.endsWith(a.dir || ""));
|
|
295
295
|
return s || ((o = t.projects) == null ? void 0 : o.find((a) => a.dir === t.defaultProject));
|
|
296
|
-
},
|
|
297
|
-
const t = await
|
|
298
|
-
await
|
|
296
|
+
}, le = async (e) => {
|
|
297
|
+
const t = await gt(e), s = await I(e), n = u(e, (t == null ? void 0 : t.configDir) || "", "salty.config.ts"), o = u(s, "salty.config.js"), a = await kt(e), r = Ot(n);
|
|
298
|
+
await Nt.build({
|
|
299
299
|
entryPoints: [n],
|
|
300
300
|
minify: !0,
|
|
301
301
|
treeShaking: !0,
|
|
@@ -304,97 +304,97 @@ const re = (e) => new oe(e), ae = (e, t) => new Promise((s, n) => {
|
|
|
304
304
|
format: a,
|
|
305
305
|
external: r
|
|
306
306
|
});
|
|
307
|
-
const m = Date.now(), { config:
|
|
308
|
-
return { config:
|
|
309
|
-
},
|
|
310
|
-
var
|
|
311
|
-
const s = await
|
|
307
|
+
const m = Date.now(), { config: w } = await import(`${o}?t=${m}`);
|
|
308
|
+
return { config: w, path: o };
|
|
309
|
+
}, fe = async (e, t) => {
|
|
310
|
+
var bt, St;
|
|
311
|
+
const s = await I(e), n = {
|
|
312
312
|
mediaQueries: [],
|
|
313
313
|
globalStyles: [],
|
|
314
314
|
variables: [],
|
|
315
315
|
templates: []
|
|
316
316
|
};
|
|
317
317
|
await Promise.all(
|
|
318
|
-
[...t].map(async (
|
|
319
|
-
const { contents:
|
|
320
|
-
Object.entries(
|
|
321
|
-
|
|
318
|
+
[...t].map(async (S) => {
|
|
319
|
+
const { contents: _, outputFilePath: X } = await at(e, S, s);
|
|
320
|
+
Object.entries(_).forEach(([E, D]) => {
|
|
321
|
+
D.isMedia ? n.mediaQueries.push([E, D]) : D.isGlobalDefine ? n.globalStyles.push(D) : D.isDefineVariables ? n.variables.push(D) : D.isDefineTemplates && n.templates.push(D._setPath(`${E};;${X}`));
|
|
322
322
|
});
|
|
323
323
|
})
|
|
324
324
|
);
|
|
325
|
-
const { config: o, path: a } = await
|
|
326
|
-
r.mediaQueries = Object.fromEntries(m.map(([
|
|
327
|
-
const
|
|
328
|
-
if (!
|
|
329
|
-
const
|
|
330
|
-
const
|
|
331
|
-
if (!
|
|
332
|
-
if (
|
|
333
|
-
if (typeof
|
|
334
|
-
if (typeof
|
|
335
|
-
const
|
|
336
|
-
|
|
337
|
-
const st = [...
|
|
338
|
-
return
|
|
325
|
+
const { config: o, path: a } = await le(e), r = { ...o }, { mediaQueries: m } = n;
|
|
326
|
+
r.mediaQueries = Object.fromEntries(m.map(([S, _]) => [`@${S}`, _]));
|
|
327
|
+
const w = m.map(([S]) => `'@${S}'`).join(" | "), p = /* @__PURE__ */ new Set(), c = async (S, _ = []) => {
|
|
328
|
+
if (!S) return [];
|
|
329
|
+
const X = Object.entries(S).map(async ([D, H]) => {
|
|
330
|
+
const Y = async (O) => {
|
|
331
|
+
if (!O) return;
|
|
332
|
+
if (O instanceof Promise) return await Y(await O);
|
|
333
|
+
if (typeof O == "function") return await Y(await O());
|
|
334
|
+
if (typeof O == "object") return await c(O, [..._, D]);
|
|
335
|
+
const lt = Et(D), ft = J(D), ut = [..._, lt].join(".");
|
|
336
|
+
p.add(`"${ut}"`);
|
|
337
|
+
const st = [..._.map(J), ft].join("-"), Ct = Zt(O);
|
|
338
|
+
return Ct ? `--${st}: ${Ct.transformed};` : `--${st}: ${O};`;
|
|
339
339
|
};
|
|
340
|
-
return await
|
|
340
|
+
return await Y(H);
|
|
341
341
|
});
|
|
342
|
-
return (await Promise.all(
|
|
343
|
-
},
|
|
344
|
-
if (!
|
|
345
|
-
const
|
|
346
|
-
const H = await c(
|
|
347
|
-
return
|
|
342
|
+
return (await Promise.all(X)).flat();
|
|
343
|
+
}, h = async (S) => {
|
|
344
|
+
if (!S) return [];
|
|
345
|
+
const _ = Object.entries(S).map(async ([E, D]) => {
|
|
346
|
+
const H = await c(D);
|
|
347
|
+
return E === "base" ? H.join("") : r.mediaQueries[E] ? `${r.mediaQueries[E]} { ${H.join("")} }` : `${E} { ${H.join("")} }`;
|
|
348
348
|
});
|
|
349
|
-
return (await Promise.all(
|
|
350
|
-
}, y = async (
|
|
351
|
-
if (!
|
|
352
|
-
const
|
|
353
|
-
const H = Object.entries(
|
|
354
|
-
const
|
|
355
|
-
return `${
|
|
349
|
+
return (await Promise.all(_)).flat();
|
|
350
|
+
}, y = async (S) => {
|
|
351
|
+
if (!S) return [];
|
|
352
|
+
const _ = Object.entries(S).map(async ([E, D]) => {
|
|
353
|
+
const H = Object.entries(D).map(async ([O, lt]) => {
|
|
354
|
+
const ft = await c(lt, [E]), ut = `.${E}-${O}, [data-${E}="${O}"]`, st = ft.join("");
|
|
355
|
+
return `${ut} { ${st} }`;
|
|
356
356
|
});
|
|
357
357
|
return (await Promise.all(H)).flat();
|
|
358
358
|
});
|
|
359
|
-
return (await Promise.all(
|
|
360
|
-
}, b = (
|
|
361
|
-
|
|
362
|
-
const
|
|
363
|
-
|
|
364
|
-
const
|
|
365
|
-
|
|
366
|
-
const
|
|
367
|
-
|
|
368
|
-
const
|
|
369
|
-
r.templatePaths = Object.fromEntries(Object.entries(
|
|
370
|
-
const
|
|
359
|
+
return (await Promise.all(_)).flat();
|
|
360
|
+
}, b = (S) => ({ ...S, responsive: void 0, conditional: void 0 }), d = (S) => n.variables.map((_) => S === "static" ? b(_._current) : _._current[S]), f = L(b(o.variables), d("static")), g = await c(f), F = L((bt = o.variables) == null ? void 0 : bt.responsive, d("responsive")), x = await h(F), V = L((St = o.variables) == null ? void 0 : St.conditional, d("conditional")), k = await y(V), W = u(s, "css/_variables.css"), P = `:root { ${g.join("")} ${x.join("")} } ${k.join("")}`;
|
|
361
|
+
T(W, P), r.staticVariables = f;
|
|
362
|
+
const v = u(s, "css/_global.css"), l = L(o.global, n.globalStyles), $ = await tt(l, "");
|
|
363
|
+
T(v, `@layer global { ${$} }`);
|
|
364
|
+
const C = u(s, "css/_reset.css"), j = o.reset === "none" ? {} : typeof o.reset == "object" ? o.reset : se, N = await tt(j, "");
|
|
365
|
+
T(C, `@layer reset { ${N} }`);
|
|
366
|
+
const M = u(s, "css/_templates.css"), A = L(o.templates, n.templates), B = await xt(A), U = Yt(A);
|
|
367
|
+
T(M, `@layer templates { ${B} }`), r.templates = A;
|
|
368
|
+
const et = o.templates ? [ae(o.templates)._setPath(`config;;${a}`)] : [], it = ne(n.templates, et);
|
|
369
|
+
r.templatePaths = Object.fromEntries(Object.entries(it).map(([S, _]) => [S, _._path]));
|
|
370
|
+
const q = u(s, "types/css-tokens.d.ts"), Mt = `
|
|
371
371
|
// Variable types
|
|
372
|
-
type VariableTokens = ${[...
|
|
372
|
+
type VariableTokens = ${[...p].join("|")};
|
|
373
373
|
type PropertyValueToken = \`{\${VariableTokens}}\`;
|
|
374
374
|
|
|
375
375
|
// Template types
|
|
376
376
|
type TemplateTokens = {
|
|
377
|
-
${Object.entries(
|
|
377
|
+
${Object.entries(U).map(([S, _]) => `${S}?: ${_}`).join(`
|
|
378
378
|
`)}
|
|
379
379
|
}
|
|
380
380
|
|
|
381
381
|
// Media query types
|
|
382
|
-
type MediaQueryKeys = ${
|
|
382
|
+
type MediaQueryKeys = ${w || "''"};
|
|
383
383
|
`;
|
|
384
|
-
|
|
384
|
+
T(q, Mt);
|
|
385
385
|
const Rt = u(s, "cache/config-cache.json");
|
|
386
|
-
|
|
387
|
-
},
|
|
386
|
+
T(Rt, JSON.stringify(r, null, 2));
|
|
387
|
+
}, Ft = (e) => e.replace(/styled\(([^"'`{,]+),/g, (t, s) => {
|
|
388
388
|
if (/^['"`]/.test(s)) return t;
|
|
389
389
|
const o = new RegExp(`import[^;]*${s}[,\\s{][^;]*from\\s?([^{};]+);`);
|
|
390
390
|
if (!o.test(e)) return t;
|
|
391
391
|
const r = o.exec(e);
|
|
392
392
|
if (r) {
|
|
393
393
|
const m = r.at(1);
|
|
394
|
-
if (
|
|
394
|
+
if (Vt.some((p) => m == null ? void 0 : m.includes(p))) return t;
|
|
395
395
|
}
|
|
396
396
|
return "styled('div',";
|
|
397
|
-
}),
|
|
397
|
+
}), ue = (e, t) => {
|
|
398
398
|
try {
|
|
399
399
|
const s = R(u(t, "saltygen/cache/config-cache.json"), "utf8");
|
|
400
400
|
return s ? `globalThis.saltyConfig = ${s};
|
|
@@ -406,13 +406,13 @@ ${e}`;
|
|
|
406
406
|
return e;
|
|
407
407
|
}
|
|
408
408
|
}, at = async (e, t, s) => {
|
|
409
|
-
const n =
|
|
410
|
-
|
|
409
|
+
const n = G(t), o = u(s, "./temp");
|
|
410
|
+
yt(o) || K(o);
|
|
411
411
|
const a = rt(t);
|
|
412
412
|
let r = R(t, "utf8");
|
|
413
|
-
r =
|
|
414
|
-
const m = u(s, "js", n + ".js"),
|
|
415
|
-
await
|
|
413
|
+
r = Ft(r), r = ue(r, e);
|
|
414
|
+
const m = u(s, "js", n + ".js"), w = await gt(e), p = u(e, (w == null ? void 0 : w.configDir) || "", "salty.config.ts"), c = Ot(p), h = await kt(e);
|
|
415
|
+
await Nt.build({
|
|
416
416
|
stdin: {
|
|
417
417
|
contents: r,
|
|
418
418
|
sourcefile: a.base,
|
|
@@ -423,7 +423,7 @@ ${e}`;
|
|
|
423
423
|
treeShaking: !0,
|
|
424
424
|
bundle: !0,
|
|
425
425
|
outfile: m,
|
|
426
|
-
format:
|
|
426
|
+
format: h,
|
|
427
427
|
target: ["node20"],
|
|
428
428
|
keepNames: !0,
|
|
429
429
|
external: c,
|
|
@@ -431,10 +431,10 @@ ${e}`;
|
|
|
431
431
|
plugins: [
|
|
432
432
|
{
|
|
433
433
|
name: "test",
|
|
434
|
-
setup: (
|
|
435
|
-
|
|
436
|
-
const
|
|
437
|
-
return { contents:
|
|
434
|
+
setup: (d) => {
|
|
435
|
+
d.onLoad({ filter: /.*\.css|salty|styles|styled\.ts/ }, (f) => {
|
|
436
|
+
const g = R(f.path, "utf8");
|
|
437
|
+
return { contents: Ft(g), loader: "ts" };
|
|
438
438
|
});
|
|
439
439
|
}
|
|
440
440
|
}
|
|
@@ -442,226 +442,232 @@ ${e}`;
|
|
|
442
442
|
});
|
|
443
443
|
const y = Date.now();
|
|
444
444
|
return { contents: await import(`${m}?t=${y}`), outputFilePath: m };
|
|
445
|
-
},
|
|
446
|
-
const t = await
|
|
445
|
+
}, de = async (e) => {
|
|
446
|
+
const t = await I(e), s = u(t, "cache/config-cache.json"), n = R(s, "utf8");
|
|
447
447
|
if (!n) throw new Error("Could not find config cache file");
|
|
448
448
|
return JSON.parse(n);
|
|
449
|
-
},
|
|
450
|
-
const t = await
|
|
449
|
+
}, wt = async (e) => {
|
|
450
|
+
const t = await de(e), s = await I(e), n = u(s, "salty.config.js"), o = Date.now(), { config: a } = await import(`${n}?t=${o}`);
|
|
451
451
|
return L(a, t);
|
|
452
|
-
},
|
|
452
|
+
}, $t = () => {
|
|
453
453
|
try {
|
|
454
454
|
return process.env.NODE_ENV === "production";
|
|
455
455
|
} catch {
|
|
456
456
|
return !1;
|
|
457
457
|
}
|
|
458
|
-
}, pe = async (e, t =
|
|
458
|
+
}, pe = async (e, t = $t(), s = !0) => {
|
|
459
459
|
try {
|
|
460
460
|
const n = Date.now();
|
|
461
|
-
t ?
|
|
462
|
-
const o = [], a = [], r = await
|
|
461
|
+
t ? mt.info("Generating CSS in production mode! 🔥") : mt.info("Generating CSS in development mode! 🚀");
|
|
462
|
+
const o = [], a = [], r = await I(e), m = u(r, "index.css");
|
|
463
463
|
s && (() => {
|
|
464
|
-
|
|
464
|
+
yt(r) && Wt("rm -rf " + r), K(r, { recursive: !0 }), K(u(r, "css")), K(u(r, "types")), K(u(r, "js")), K(u(r, "cache"));
|
|
465
465
|
})();
|
|
466
|
-
const
|
|
467
|
-
async function
|
|
468
|
-
const
|
|
469
|
-
if (
|
|
470
|
-
const
|
|
471
|
-
if (
|
|
472
|
-
await Promise.all(
|
|
473
|
-
} else if (
|
|
474
|
-
|
|
475
|
-
const j = R(
|
|
476
|
-
/define[\w\d]+\(/.test(j) && c.add(
|
|
466
|
+
const p = /* @__PURE__ */ new Set(), c = /* @__PURE__ */ new Set();
|
|
467
|
+
async function h(l) {
|
|
468
|
+
const $ = ["node_modules", "saltygen"], C = At(l);
|
|
469
|
+
if (C.isDirectory()) {
|
|
470
|
+
const i = Ht(l);
|
|
471
|
+
if ($.some((N) => l.includes(N))) return;
|
|
472
|
+
await Promise.all(i.map((N) => h(u(l, N))));
|
|
473
|
+
} else if (C.isFile() && Z(l)) {
|
|
474
|
+
p.add(l);
|
|
475
|
+
const j = R(l, "utf8");
|
|
476
|
+
/define[\w\d]+\(/.test(j) && c.add(l);
|
|
477
477
|
}
|
|
478
478
|
}
|
|
479
|
-
await
|
|
479
|
+
await h(e), await fe(e, c);
|
|
480
480
|
const y = {
|
|
481
481
|
keyframes: [],
|
|
482
482
|
components: [],
|
|
483
483
|
classNames: []
|
|
484
484
|
};
|
|
485
485
|
await Promise.all(
|
|
486
|
-
[...
|
|
487
|
-
const { contents:
|
|
488
|
-
for (let [
|
|
489
|
-
|
|
490
|
-
value:
|
|
491
|
-
src:
|
|
492
|
-
name:
|
|
493
|
-
}) :
|
|
494
|
-
...
|
|
495
|
-
src:
|
|
496
|
-
name:
|
|
497
|
-
}) :
|
|
498
|
-
...
|
|
499
|
-
src:
|
|
500
|
-
name:
|
|
486
|
+
[...p].map(async (l) => {
|
|
487
|
+
const { contents: $ } = await at(e, l, r);
|
|
488
|
+
for (let [C, i] of Object.entries($))
|
|
489
|
+
i instanceof Promise && (i = await i), i.isKeyframes ? y.keyframes.push({
|
|
490
|
+
value: i,
|
|
491
|
+
src: l,
|
|
492
|
+
name: C
|
|
493
|
+
}) : i.isClassName ? y.classNames.push({
|
|
494
|
+
...i,
|
|
495
|
+
src: l,
|
|
496
|
+
name: C
|
|
497
|
+
}) : i.generator && y.components.push({
|
|
498
|
+
...i,
|
|
499
|
+
src: l,
|
|
500
|
+
name: C
|
|
501
501
|
});
|
|
502
502
|
})
|
|
503
503
|
);
|
|
504
|
-
const b = await
|
|
505
|
-
for (const
|
|
506
|
-
const { value:
|
|
507
|
-
o.push(
|
|
504
|
+
const b = await wt(e);
|
|
505
|
+
for (const l of y.keyframes) {
|
|
506
|
+
const { value: $ } = l, C = `a_${$.animationName}.css`, i = `css/${C}`, j = u(r, i);
|
|
507
|
+
o.push(C), T(j, $.css);
|
|
508
508
|
}
|
|
509
|
-
const
|
|
510
|
-
for (const
|
|
511
|
-
const { src:
|
|
512
|
-
|
|
513
|
-
const
|
|
514
|
-
callerName:
|
|
509
|
+
const d = {};
|
|
510
|
+
for (const l of y.components) {
|
|
511
|
+
const { src: $, name: C } = l;
|
|
512
|
+
d[$] || (d[$] = []);
|
|
513
|
+
const i = l.generator._withBuildContext({
|
|
514
|
+
callerName: C,
|
|
515
515
|
isProduction: t,
|
|
516
516
|
config: b
|
|
517
517
|
});
|
|
518
|
-
a[
|
|
519
|
-
const j = await
|
|
518
|
+
a[i.priority] || (a[i.priority] = []);
|
|
519
|
+
const j = await i.css;
|
|
520
520
|
if (!j) continue;
|
|
521
|
-
a[
|
|
522
|
-
const
|
|
523
|
-
|
|
521
|
+
a[i.priority].push(i.cssFileName);
|
|
522
|
+
const N = `css/${i.cssFileName}`, M = u(r, N);
|
|
523
|
+
T(M, j), b.importStrategy === "component" && d[$].push(i.cssFileName);
|
|
524
524
|
}
|
|
525
|
-
for (const
|
|
526
|
-
const { src:
|
|
527
|
-
|
|
528
|
-
const
|
|
529
|
-
callerName:
|
|
525
|
+
for (const l of y.classNames) {
|
|
526
|
+
const { src: $, name: C } = l;
|
|
527
|
+
d[$] || (d[$] = []);
|
|
528
|
+
const i = l.generator._withBuildContext({
|
|
529
|
+
callerName: C,
|
|
530
530
|
isProduction: t,
|
|
531
531
|
config: b
|
|
532
|
-
}), j = await
|
|
532
|
+
}), j = await i.css;
|
|
533
533
|
if (!j) continue;
|
|
534
|
-
a[
|
|
535
|
-
const
|
|
536
|
-
|
|
534
|
+
a[i.priority] || (a[i.priority] = []), a[i.priority].push(i.cssFileName);
|
|
535
|
+
const N = `css/${i.cssFileName}`, M = u(r, N);
|
|
536
|
+
T(M, j), b.importStrategy === "component" && d[$].push(i.cssFileName);
|
|
537
537
|
}
|
|
538
|
-
b.importStrategy === "component" && Object.entries(
|
|
539
|
-
const
|
|
540
|
-
`),
|
|
541
|
-
|
|
538
|
+
b.importStrategy === "component" && Object.entries(d).forEach(([l, $]) => {
|
|
539
|
+
const C = $.map((A) => `@import url('./${A}');`).join(`
|
|
540
|
+
`), i = G(l, 6), j = rt(l), N = J(j.name), M = u(r, `css/f_${N}-${i}.css`);
|
|
541
|
+
T(M, C || "/* Empty file */");
|
|
542
542
|
});
|
|
543
|
-
const f = o.map((
|
|
543
|
+
const f = o.map((l) => `@import url('./css/${l}');`).join(`
|
|
544
544
|
`);
|
|
545
|
-
let
|
|
545
|
+
let k = `/*!
|
|
546
|
+
* Generated with Salty CSS (https://salty-css.dev)
|
|
547
|
+
* Do not edit this file directly
|
|
548
|
+
*/
|
|
549
|
+
@layer reset, global, templates, l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
|
546
550
|
|
|
547
|
-
${["_variables.css", "_reset.css", "_global.css", "_templates.css"].filter((
|
|
551
|
+
${["_variables.css", "_reset.css", "_global.css", "_templates.css"].filter((l) => {
|
|
548
552
|
try {
|
|
549
|
-
return R(u(r, "css",
|
|
553
|
+
return R(u(r, "css", l), "utf8").length > 0;
|
|
550
554
|
} catch {
|
|
551
555
|
return !1;
|
|
552
556
|
}
|
|
553
|
-
}).map((
|
|
554
|
-
`
|
|
557
|
+
}).map((l) => `@import url('./css/${l}');`).join(
|
|
558
|
+
`
|
|
559
|
+
`
|
|
560
|
+
)}
|
|
555
561
|
${f}`;
|
|
556
562
|
if (b.importStrategy !== "component") {
|
|
557
|
-
const
|
|
558
|
-
const j =
|
|
559
|
-
var
|
|
560
|
-
const
|
|
561
|
-
return
|
|
562
|
-
/*start:${
|
|
563
|
+
const l = a.reduce(($, C, i) => {
|
|
564
|
+
const j = C.reduce((B, U) => {
|
|
565
|
+
var ct;
|
|
566
|
+
const et = u(r, "css", U), it = R(et, "utf8"), q = ((ct = /.*-([^-]+)-\d+.css/.exec(U)) == null ? void 0 : ct.at(1)) || G(et, 6);
|
|
567
|
+
return B.includes(q) ? B : `${B}
|
|
568
|
+
/*start:${q}-${U}*/
|
|
563
569
|
${it}
|
|
564
|
-
/*end:${
|
|
570
|
+
/*end:${q}*/
|
|
565
571
|
`;
|
|
566
|
-
}, ""),
|
|
572
|
+
}, ""), N = `l_${i}.css`, M = u(r, "css", N), A = `@layer l${i} { ${j}
|
|
567
573
|
}`;
|
|
568
|
-
return
|
|
569
|
-
@import url('./css/${
|
|
574
|
+
return T(M, A), `${$}
|
|
575
|
+
@import url('./css/${N}');`;
|
|
570
576
|
}, "");
|
|
571
|
-
|
|
577
|
+
k += l;
|
|
572
578
|
}
|
|
573
|
-
|
|
574
|
-
const
|
|
575
|
-
|
|
579
|
+
T(m, k);
|
|
580
|
+
const P = Date.now() - n, v = P < 200 ? "🔥" : P < 500 ? "🚀" : P < 1e3 ? "🎉" : P < 2e3 ? "🚗" : P < 5e3 ? "🤔" : "🥴";
|
|
581
|
+
mt.info(`Generated CSS in ${P}ms! ${v}`);
|
|
576
582
|
} catch (n) {
|
|
577
583
|
console.error(n);
|
|
578
584
|
}
|
|
579
|
-
},
|
|
585
|
+
}, me = async (e, t, s = $t()) => {
|
|
580
586
|
try {
|
|
581
|
-
const n = await
|
|
587
|
+
const n = await I(e);
|
|
582
588
|
if (Z(t)) {
|
|
583
|
-
const a = [], r = await
|
|
584
|
-
for (const [
|
|
585
|
-
if (
|
|
586
|
-
const f = `css/${`a_${
|
|
587
|
-
|
|
589
|
+
const a = [], r = await wt(e), { contents: m } = await at(e, t, n);
|
|
590
|
+
for (const [w, p] of Object.entries(m)) {
|
|
591
|
+
if (p.isKeyframes && p.css) {
|
|
592
|
+
const f = `css/${`a_${p.animationName}.css`}`, g = u(n, f);
|
|
593
|
+
T(g, await p.css);
|
|
588
594
|
continue;
|
|
589
595
|
}
|
|
590
|
-
if (
|
|
591
|
-
const
|
|
592
|
-
callerName:
|
|
596
|
+
if (p.isClassName) {
|
|
597
|
+
const d = p.generator._withBuildContext({
|
|
598
|
+
callerName: w,
|
|
593
599
|
isProduction: s,
|
|
594
600
|
config: r
|
|
595
|
-
}), f = await
|
|
601
|
+
}), f = await d.css;
|
|
596
602
|
if (!f) continue;
|
|
597
|
-
a[
|
|
598
|
-
const
|
|
599
|
-
|
|
603
|
+
a[d.priority] || (a[d.priority] = []), a[d.priority].push(d.cssFileName);
|
|
604
|
+
const g = `css/${d.cssFileName}`, F = u(n, g);
|
|
605
|
+
T(F, f);
|
|
600
606
|
continue;
|
|
601
607
|
}
|
|
602
|
-
if (!
|
|
603
|
-
const c =
|
|
604
|
-
callerName:
|
|
608
|
+
if (!p.generator) continue;
|
|
609
|
+
const c = p.generator._withBuildContext({
|
|
610
|
+
callerName: w,
|
|
605
611
|
isProduction: s,
|
|
606
612
|
config: r
|
|
607
|
-
}),
|
|
608
|
-
if (!
|
|
613
|
+
}), h = await c.css;
|
|
614
|
+
if (!h) continue;
|
|
609
615
|
const y = `css/${c.cssFileName}`, b = u(n, y);
|
|
610
|
-
|
|
616
|
+
T(b, h), a[c.priority] || (a[c.priority] = []), a[c.priority].push(c.cssFileName);
|
|
611
617
|
}
|
|
612
618
|
if (r.importStrategy !== "component")
|
|
613
|
-
a.forEach((
|
|
614
|
-
const c = `l_${
|
|
615
|
-
let y = R(
|
|
616
|
-
|
|
619
|
+
a.forEach((w, p) => {
|
|
620
|
+
const c = `l_${p}.css`, h = u(n, "css", c);
|
|
621
|
+
let y = R(h, "utf8");
|
|
622
|
+
w.forEach((b) => {
|
|
617
623
|
var F;
|
|
618
|
-
const
|
|
624
|
+
const d = u(n, "css", b), f = ((F = /.*-([^-]+)-\d+.css/.exec(b)) == null ? void 0 : F.at(1)) || G(d, 6);
|
|
619
625
|
if (!y.includes(f)) {
|
|
620
|
-
const
|
|
621
|
-
${
|
|
626
|
+
const x = R(d, "utf8"), V = `/*start:${f}-${b}*/
|
|
627
|
+
${x}
|
|
622
628
|
/*end:${f}*/
|
|
623
629
|
`;
|
|
624
630
|
y = `${y.replace(/\}$/, "")}
|
|
625
|
-
${
|
|
631
|
+
${V}
|
|
626
632
|
}`;
|
|
627
633
|
}
|
|
628
|
-
}),
|
|
634
|
+
}), T(h, y);
|
|
629
635
|
});
|
|
630
636
|
else {
|
|
631
|
-
const
|
|
632
|
-
`),
|
|
633
|
-
|
|
637
|
+
const w = a.flat().map((b) => `@import url('./${b}');`).join(`
|
|
638
|
+
`), p = G(t, 6), c = rt(t), h = J(c.name), y = u(n, `css/f_${h}-${p}.css`);
|
|
639
|
+
T(y, w || "/* Empty file */");
|
|
634
640
|
}
|
|
635
641
|
}
|
|
636
642
|
} catch (n) {
|
|
637
643
|
console.error(n);
|
|
638
644
|
}
|
|
639
|
-
},
|
|
645
|
+
}, ye = async (e, t, s = $t()) => {
|
|
640
646
|
var n, o;
|
|
641
647
|
try {
|
|
642
|
-
const a = await
|
|
648
|
+
const a = await I(e);
|
|
643
649
|
if (Z(t)) {
|
|
644
|
-
const m = R(t, "utf8"),
|
|
650
|
+
const m = R(t, "utf8"), w = await wt(e), { contents: p } = await at(e, t, a);
|
|
645
651
|
let c = m;
|
|
646
|
-
for (const [
|
|
652
|
+
for (const [h, y] of Object.entries(p)) {
|
|
647
653
|
if (y.isKeyframes || !y.generator) continue;
|
|
648
654
|
const b = y.generator._withBuildContext({
|
|
649
|
-
callerName:
|
|
655
|
+
callerName: h,
|
|
650
656
|
isProduction: s,
|
|
651
|
-
config:
|
|
652
|
-
}), [
|
|
657
|
+
config: w
|
|
658
|
+
}), [d, f] = await ie(c, h), g = c.slice(d, f);
|
|
653
659
|
if (y.isClassName) {
|
|
654
|
-
const F = c,
|
|
655
|
-
c = c.replace(
|
|
660
|
+
const F = c, x = ` ${h} = className("${b.classNames}")`;
|
|
661
|
+
c = c.replace(g, x), F === c && console.error("Minimize file failed to change content", { name: h });
|
|
656
662
|
}
|
|
657
|
-
if (
|
|
658
|
-
const F = (o = (n = /styled\(([^,]+),/.exec(
|
|
659
|
-
c = c.replace(
|
|
663
|
+
if (g.includes("styled")) {
|
|
664
|
+
const F = (o = (n = /styled\(([^,]+),/.exec(g)) == null ? void 0 : n.at(1)) == null ? void 0 : o.trim(), x = c, V = ` ${h} = styled(${F}, "${b.classNames}", ${JSON.stringify(b.clientProps)})`;
|
|
665
|
+
c = c.replace(g, V), x === c && console.error("Minimize file failed to change content", { name: h, tagName: F });
|
|
660
666
|
}
|
|
661
667
|
}
|
|
662
|
-
if (
|
|
663
|
-
const
|
|
664
|
-
c = `import '../../saltygen/css/${`f_${J(y.name)}-${
|
|
668
|
+
if (w.importStrategy === "component") {
|
|
669
|
+
const h = G(t, 6), y = rt(t);
|
|
670
|
+
c = `import '../../saltygen/css/${`f_${J(y.name)}-${h}.css`}';
|
|
665
671
|
${c}`;
|
|
666
672
|
}
|
|
667
673
|
return c = c.replace("@salty-css/react/class-name", "@salty-css/react/class-name-client"), c = c.replace("{ styled }", "{ styledClient as styled }"), c = c.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), c;
|
|
@@ -669,25 +675,25 @@ ${c}`;
|
|
|
669
675
|
} catch (a) {
|
|
670
676
|
console.error("Error in minimizeFile:", a);
|
|
671
677
|
}
|
|
672
|
-
},
|
|
678
|
+
}, Pt = async (e) => {
|
|
673
679
|
if (!e || e.includes("node_modules") || e.includes("saltygen")) return !1;
|
|
674
680
|
if (e.includes("salty.config")) return !0;
|
|
675
681
|
if (!Z(e)) return !1;
|
|
676
|
-
const n = await
|
|
682
|
+
const n = await ht(e, "utf-8");
|
|
677
683
|
return !!(/.+define[A-Z]\w+/.test(n) || /.+keyframes\(.+/.test(n));
|
|
678
684
|
}, je = (e) => ({
|
|
679
685
|
name: "stylegen",
|
|
680
686
|
buildStart: () => pe(e),
|
|
681
687
|
load: async (t) => {
|
|
682
688
|
if (Z(t))
|
|
683
|
-
return await
|
|
689
|
+
return await ye(e, t);
|
|
684
690
|
},
|
|
685
691
|
handleHotUpdate: async ({ file: t, server: s }) => {
|
|
686
|
-
await
|
|
692
|
+
await Pt(t) && s.restart();
|
|
687
693
|
},
|
|
688
694
|
watchChange: {
|
|
689
695
|
handler: async (t, s) => {
|
|
690
|
-
Z(t) && s.event !== "delete" && (await
|
|
696
|
+
Z(t) && s.event !== "delete" && (await Pt(t) || await me(e, t));
|
|
691
697
|
}
|
|
692
698
|
}
|
|
693
699
|
});
|
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.249",
|
|
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.249"
|
|
38
38
|
}
|
|
39
39
|
}
|