@salty-css/vite 0.0.1-alpha.2 → 0.0.1-alpha.21
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +23 -19
- package/index.cjs +18 -0
- package/index.d.ts +8 -0
- package/index.js +272 -0
- package/package.json +6 -2
package/README.md
CHANGED
@@ -5,7 +5,7 @@
|
|
5
5
|
### Initial requirements
|
6
6
|
|
7
7
|
1. Add `saltyPlugin` to vite or webpack config from `@salty-css/vite` or `@salty-css/webpack`
|
8
|
-
2. Create `salty
|
8
|
+
2. Create `salty.config.ts` to the root of your project
|
9
9
|
3. Import global styles to any regular .css file from `saltygen/index.css` (does not exist during first run, cli command coming later)
|
10
10
|
4. Create salty components with styled only inside files that end with `.css.ts`, `.salty.ts` `.styled.ts` or `.styles.ts`
|
11
11
|
|
@@ -54,8 +54,10 @@ export const IndexPage = () => {
|
|
54
54
|
import { styled } from '@salty-css/react/styled';
|
55
55
|
|
56
56
|
export const Wrapper = styled('div', {
|
57
|
-
|
58
|
-
|
57
|
+
base: {
|
58
|
+
display: 'block',
|
59
|
+
padding: '2vw',
|
60
|
+
},
|
59
61
|
});
|
60
62
|
```
|
61
63
|
|
@@ -65,22 +67,24 @@ export const Wrapper = styled('div', {
|
|
65
67
|
import { styled } from '@salty-css/react/styled';
|
66
68
|
|
67
69
|
export const Button = styled('button', {
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
70
|
+
base: {
|
71
|
+
display: 'block',
|
72
|
+
padding: `0.6em 1.2em`,
|
73
|
+
border: '1px solid currentColor',
|
74
|
+
background: 'transparent',
|
75
|
+
color: 'currentColor/40',
|
76
|
+
cursor: 'pointer',
|
77
|
+
transition: '200ms',
|
78
|
+
textDecoration: 'none',
|
79
|
+
'&:hover': {
|
80
|
+
background: 'black',
|
81
|
+
borderColor: 'black',
|
82
|
+
color: 'white',
|
83
|
+
},
|
84
|
+
'&:disabled': {
|
85
|
+
opacity: 0.25,
|
86
|
+
pointerEvents: 'none',
|
87
|
+
},
|
84
88
|
},
|
85
89
|
variants: {
|
86
90
|
variant: {
|
package/index.cjs
ADDED
@@ -0,0 +1,18 @@
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const W=require("esbuild"),z=require("child_process"),u=require("path"),m=require("fs"),J=require("fs/promises");function K(t){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const n=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(s,e,n.get?n:{enumerable:!0,get:()=>t[e]})}}return s.default=t,Object.freeze(s)}const R=K(W),M=t=>String.fromCharCode(t+(t>25?39:97)),G=(t,s)=>{let e="",n;for(n=Math.abs(t);n>52;n=n/52|0)e=M(n%52)+e;return e=M(n%52)+e,e.length<s?e=e.padStart(s,"a"):e.length>s&&(e=e.slice(-s)),e},L=(t,s)=>{let e=s.length;for(;e;)t=t*33^s.charCodeAt(--e);return t},E=(t,s=3)=>{const e=L(5381,JSON.stringify(t))>>>0;return G(e,s)};function N(t){return t?typeof t!="string"?N(String(t)):t.replace(/\s/g,"-").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g,(s,e)=>(e>0?"-":"")+s.toLowerCase()):""}const U=(t,s)=>{if(typeof t!="string")return{result:t};if(!s)return{result:t};const e=[];return Object.values(s).forEach(n=>{const{pattern:r,transform:y}=n;t=t.replace(r,$=>{const{value:a,css:f}=y($);return f&&e.push(f),a})}),{result:t,additionalCss:e}},q=t=>typeof t!="string"?{result:t}:/\{[^{}]+\}/g.test(t)?{result:t.replace(/\{([^{}]+)\}/g,(...n)=>`var(--${N(n[1].replaceAll(".","-"))})`)}:{result:t},D=(t,s,e,n)=>{if(!t)return"";const r=[],y=Object.entries(t).reduce((a,[f,o])=>{const i=f.trim();if(typeof o=="function"&&(o=o()),typeof o=="object"){if(!o)return a;if(i==="variants")return Object.entries(o).forEach(([g,c])=>{c&&Object.entries(c).forEach(([d,l])=>{if(!l)return;const F=`${s}.${g}-${d}`,P=D(l,F);r.push(P)})}),a;if(i==="defaultVariants")return a;if(i==="compoundVariants")return o.forEach(g=>{const{css:c,...d}=g,l=Object.entries(d).reduce((P,[x,k])=>`${P}.${x}-${k}`,s),F=D(c,l);r.push(F)}),a;if(i.startsWith("@")){const g=D(o,s),c=`${i} {
|
2
|
+
${g.replace(`
|
3
|
+
`,`
|
4
|
+
`)}
|
5
|
+
}`;return r.push(c),a}const b=f.includes("&")?i.replace("&",s):i.startsWith(":")?`${s}${i}`:`${s} ${i}`,C=D(o,b);return r.push(C),a}const p=i.startsWith("-")?i:N(i),h=(b,C=";")=>a=`${a}${b}${C}`,j=b=>h(`${p}:${b}`);if(typeof o=="number")return j(o);if(typeof o!="string")if("toString"in o)o=o.toString();else return a;const{modifiers:S}={},O=function*(){yield q(o),yield U(o,S)}();for(const{result:b,additionalCss:C=[]}of O)o=b,C.forEach(g=>{const c=D(g,"");h(c,"")});return j(o)},"");if(!y)return r.join(`
|
6
|
+
`);if(!s)return y;let $="";return $=`${s} { ${y} }`,[$,...r].join(`
|
7
|
+
`)},Z=(t,s=[])=>{if(!t)return"";const e=[],n={};if(Object.entries(t).forEach(([r,y])=>{if(typeof y=="object"){if(!y)return;const $=r.trim(),a=Z(y,[...s,$]);e.push(a)}else n[r]=y}),Object.keys(n).length){const r=s.map(N).join("-"),y=D(n,`.${r}`);e.push(y)}return e.join(`
|
8
|
+
`)},T=t=>u.join(t,"./saltygen"),X=["salty","css","styles","styled"],Y=(t=[])=>new RegExp(`\\.(${[...X,...t].join("|")})\\.`),V=(t,s=[])=>Y(s).test(t),Q=async t=>{const s=T(t),e=u.join(t,"salty.config.ts"),n=u.join(s,"salty.config.js");await R.build({entryPoints:[e],minify:!0,treeShaking:!0,bundle:!0,outfile:n,format:"esm",external:["react"]});const r=Date.now(),{config:y}=await import(`${n}?t=${r}`);return y},I=async t=>{const s=await Q(t),e=new Set,n=(g,c=[])=>g?Object.entries(g).flatMap(([d,l])=>{if(!l)return;if(typeof l=="object")return n(l,[...c,d]);const F=[...c,d].join(".");e.add(`"${F}"`);const P=[...c.map(N),N(d)].join("-"),{result:x}=q(l);return`--${P}: ${x};`}):[],r=g=>g?Object.entries(g).flatMap(([c,d])=>{const l=n(d);return c==="base"?l.join(""):`${c} { ${l.join("")} }`}):[],y=g=>g?Object.entries(g).flatMap(([c,d])=>Object.entries(d).flatMap(([l,F])=>{const P=n(F,[c]),x=`.${c}-${l}, [data-${c}="${l}"]`,k=P.join("");return`${x} { ${k} }`})):[],$=n(s.variables),a=r(s.responsiveVariables),f=y(s.conditionalVariables),o=T(t),i=u.join(o,"css/variables.css"),p=`:root { ${$.join("")} ${a.join("")} } ${f.join("")}`;m.writeFileSync(i,p);const h=u.join(o,"types/css-tokens.d.ts"),S=`type VariableTokens = ${[...e].join("|")}; type PropertyValueToken = \`{\${VariableTokens}}\``;m.writeFileSync(h,S);const w=u.join(o,"css/global.css"),O=D(s.global,"");m.writeFileSync(w,O);const b=u.join(o,"css/templates.css"),C=Z(s.templates);m.writeFileSync(b,C)},_=async(t,s)=>{const e=E(t),n=u.join(s,"js",e+".js");await R.build({entryPoints:[t],minify:!0,treeShaking:!0,bundle:!0,outfile:n,format:"esm",target:["es2022"],keepNames:!0,external:["react"]});const r=Date.now();return await import(`${n}?t=${r}`)},A=async t=>{const s=T(t),e=u.join(s,"salty.config.js"),{config:n}=await import(e);return n},v=async t=>{try{const s=[],e=[],n=T(t),r=u.join(n,"index.css");(()=>{m.existsSync(n)&&z.execSync("rm -rf "+n),m.mkdirSync(n),m.mkdirSync(u.join(n,"css")),m.mkdirSync(u.join(n,"types"))})(),await I(t);const $=await A(t);async function a(p,h){const j=m.statSync(p);if(j.isDirectory()){const S=m.readdirSync(p);await Promise.all(S.map(w=>a(u.join(p,w),u.join(h,w))))}else if(j.isFile()&&V(p)){const w=await _(p,n),O=[];Object.entries(w).forEach(([c,d])=>{if(d.isKeyframes&&d.css){const k=`${d.animationName}.css`,B=`css/${k}`,H=u.join(n,B);s.push(k),m.writeFileSync(H,d.css);return}if(!d.generator)return;const l=d.generator._withBuildContext({name:c,config:$}),F=`${l.hash}-${l.priority}.css`;e[l.priority]||(e[l.priority]=[]),e[l.priority].push(F),O.push(F);const P=`css/${F}`,x=u.join(n,P);m.writeFileSync(x,l.css)});const b=O.map(c=>`@import url('./${c}');`).join(`
|
9
|
+
`),C=E(p,6),g=u.join(n,`css/${C}.css`);m.writeFileSync(g,b)}}await a(t,n);const f=s.map(p=>`@import url('./css/${p}');`).join(`
|
10
|
+
`);let i=`@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
11
|
+
|
12
|
+
${["@import url('./css/variables.css');","@import url('./css/global.css');","@import url('./css/templates.css');"].join(`
|
13
|
+
`)}
|
14
|
+
${f}`;if($.importStrategy!=="component"){const p=e.flat().map(h=>`@import url('./css/${h}');`).join(`
|
15
|
+
`);i+=p}m.writeFileSync(r,i)}catch(s){console.error(s)}},tt=async(t,s)=>{try{const e=[],n=u.join(t,"./saltygen"),r=u.join(n,"index.css");if(V(s)){const $=await A(t),a=await _(s,n);Object.entries(a).forEach(([h,j])=>{if(!j.generator)return;const S=j.generator._withBuildContext({name:h,config:$}),w=`${S.hash}-${S.priority}.css`,O=`css/${w}`,b=u.join(n,O);e.push(w),m.writeFileSync(b,S.css)});const f=m.readFileSync(r,"utf8").split(`
|
16
|
+
`),o=e.map(h=>`@import url('../saltygen/css/${h}');`),p=[...new Set([...f,...o])].join(`
|
17
|
+
`);m.writeFileSync(r,p)}}catch(e){console.error(e)}},st=async(t,s)=>{try{const e=u.join(t,"./saltygen");if(V(s)){const r=m.readFileSync(s,"utf8");r.replace(/^(?!export\s)const\s.*/gm,i=>`export ${i}`)!==r&&await J.writeFile(s,r);const $=await A(t),a=await _(s,e);let f=r;Object.entries(a).forEach(([i,p])=>{var b;if(p.isKeyframes){console.log("value",p);return}if(!p.generator)return;const h=p.generator._withBuildContext({name:i,config:$}),j=new RegExp(`${i}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(r);if(!j)return console.error("Could not find the original declaration");const S=(b=j.at(1))==null?void 0:b.trim(),w=`${i} = styled(${S}, "${h.classNames}", "${h._callerName}", ${JSON.stringify(h.props)});`,O=new RegExp(`${i}[=\\s]+[^()]+styled\\(([^,]+),[^;]+;`,"g");f=f.replace(O,w)});const o=E(s,6);return $.importStrategy==="component"&&(f=`import '../../saltygen/css/${o}.css';
|
18
|
+
${f}`),f=f.replace("{ styled }","{ styledClient as styled }"),f=f.replace("@salty-css/react/styled","@salty-css/react/styled-client"),f}}catch(e){console.error(e)}},et=t=>({name:"stylegen",buildStart:()=>v(t),load:async s=>{if(V(s))return await st(t,s)},watchChange:{handler:async s=>{V(s)&&await tt(t,s),s.includes("salty.config")&&await I(t)}}});exports.saltyPlugin=et;
|
package/index.d.ts
ADDED
package/index.js
ADDED
@@ -0,0 +1,272 @@
|
|
1
|
+
import * as Z from "esbuild";
|
2
|
+
import { execSync as q } from "child_process";
|
3
|
+
import { join as u } from "path";
|
4
|
+
import { writeFileSync as C, existsSync as z, mkdirSync as T, statSync as G, readdirSync as L, readFileSync as I } from "fs";
|
5
|
+
import { writeFile as U } from "fs/promises";
|
6
|
+
const _ = (t) => String.fromCharCode(t + (t > 25 ? 39 : 97)), X = (t, s) => {
|
7
|
+
let e = "", n;
|
8
|
+
for (n = Math.abs(t); n > 52; n = n / 52 | 0) e = _(n % 52) + e;
|
9
|
+
return e = _(n % 52) + e, e.length < s ? e = e.padStart(s, "a") : e.length > s && (e = e.slice(-s)), e;
|
10
|
+
}, Y = (t, s) => {
|
11
|
+
let e = s.length;
|
12
|
+
for (; e; ) t = t * 33 ^ s.charCodeAt(--e);
|
13
|
+
return t;
|
14
|
+
}, A = (t, s = 3) => {
|
15
|
+
const e = Y(5381, JSON.stringify(t)) >>> 0;
|
16
|
+
return X(e, s);
|
17
|
+
};
|
18
|
+
function V(t) {
|
19
|
+
return t ? typeof t != "string" ? V(String(t)) : t.replace(/\s/g, "-").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g, (s, e) => (e > 0 ? "-" : "") + s.toLowerCase()) : "";
|
20
|
+
}
|
21
|
+
const Q = (t, s) => {
|
22
|
+
if (typeof t != "string") return { result: t };
|
23
|
+
if (!s) return { result: t };
|
24
|
+
const e = [];
|
25
|
+
return Object.values(s).forEach((n) => {
|
26
|
+
const { pattern: r, transform: y } = n;
|
27
|
+
t = t.replace(r, ($) => {
|
28
|
+
const { value: a, css: f } = y($);
|
29
|
+
return f && e.push(f), a;
|
30
|
+
});
|
31
|
+
}), { result: t, additionalCss: e };
|
32
|
+
}, B = (t) => typeof t != "string" ? { result: t } : /\{[^{}]+\}/g.test(t) ? { result: t.replace(/\{([^{}]+)\}/g, (...n) => `var(--${V(n[1].replaceAll(".", "-"))})`) } : { result: t }, O = (t, s, e, n) => {
|
33
|
+
if (!t) return "";
|
34
|
+
const r = [], y = Object.entries(t).reduce((a, [f, o]) => {
|
35
|
+
const i = f.trim();
|
36
|
+
if (typeof o == "function" && (o = o()), typeof o == "object") {
|
37
|
+
if (!o) return a;
|
38
|
+
if (i === "variants")
|
39
|
+
return Object.entries(o).forEach(([g, c]) => {
|
40
|
+
c && Object.entries(c).forEach(([m, l]) => {
|
41
|
+
if (!l) return;
|
42
|
+
const S = `${s}.${g}-${m}`, D = O(l, S);
|
43
|
+
r.push(D);
|
44
|
+
});
|
45
|
+
}), a;
|
46
|
+
if (i === "defaultVariants")
|
47
|
+
return a;
|
48
|
+
if (i === "compoundVariants")
|
49
|
+
return o.forEach((g) => {
|
50
|
+
const { css: c, ...m } = g, l = Object.entries(m).reduce((D, [N, P]) => `${D}.${N}-${P}`, s), S = O(c, l);
|
51
|
+
r.push(S);
|
52
|
+
}), a;
|
53
|
+
if (i.startsWith("@")) {
|
54
|
+
const g = O(o, s), c = `${i} {
|
55
|
+
${g.replace(`
|
56
|
+
`, `
|
57
|
+
`)}
|
58
|
+
}`;
|
59
|
+
return r.push(c), a;
|
60
|
+
}
|
61
|
+
const d = f.includes("&") ? i.replace("&", s) : i.startsWith(":") ? `${s}${i}` : `${s} ${i}`, x = O(o, d);
|
62
|
+
return r.push(x), a;
|
63
|
+
}
|
64
|
+
const p = i.startsWith("-") ? i : V(i), h = (d, x = ";") => a = `${a}${d}${x}`, b = (d) => h(`${p}:${d}`);
|
65
|
+
if (typeof o == "number") return b(o);
|
66
|
+
if (typeof o != "string")
|
67
|
+
if ("toString" in o) o = o.toString();
|
68
|
+
else return a;
|
69
|
+
const { modifiers: j } = {}, F = function* () {
|
70
|
+
yield B(o), yield Q(o, j);
|
71
|
+
}();
|
72
|
+
for (const { result: d, additionalCss: x = [] } of F)
|
73
|
+
o = d, x.forEach((g) => {
|
74
|
+
const c = O(g, "");
|
75
|
+
h(c, "");
|
76
|
+
});
|
77
|
+
return b(o);
|
78
|
+
}, "");
|
79
|
+
if (!y) return r.join(`
|
80
|
+
`);
|
81
|
+
if (!s) return y;
|
82
|
+
let $ = "";
|
83
|
+
return $ = `${s} { ${y} }`, [$, ...r].join(`
|
84
|
+
`);
|
85
|
+
}, H = (t, s = []) => {
|
86
|
+
if (!t) return "";
|
87
|
+
const e = [], n = {};
|
88
|
+
if (Object.entries(t).forEach(([r, y]) => {
|
89
|
+
if (typeof y == "object") {
|
90
|
+
if (!y) return;
|
91
|
+
const $ = r.trim(), a = H(y, [...s, $]);
|
92
|
+
e.push(a);
|
93
|
+
} else
|
94
|
+
n[r] = y;
|
95
|
+
}), Object.keys(n).length) {
|
96
|
+
const r = s.map(V).join("-"), y = O(n, `.${r}`);
|
97
|
+
e.push(y);
|
98
|
+
}
|
99
|
+
return e.join(`
|
100
|
+
`);
|
101
|
+
}, E = (t) => u(t, "./saltygen"), v = ["salty", "css", "styles", "styled"], tt = (t = []) => new RegExp(`\\.(${[...v, ...t].join("|")})\\.`), k = (t, s = []) => tt(s).test(t), st = async (t) => {
|
102
|
+
const s = E(t), e = u(t, "salty.config.ts"), n = u(s, "salty.config.js");
|
103
|
+
await Z.build({
|
104
|
+
entryPoints: [e],
|
105
|
+
minify: !0,
|
106
|
+
treeShaking: !0,
|
107
|
+
bundle: !0,
|
108
|
+
outfile: n,
|
109
|
+
format: "esm",
|
110
|
+
external: ["react"]
|
111
|
+
});
|
112
|
+
const r = Date.now(), { config: y } = await import(`${n}?t=${r}`);
|
113
|
+
return y;
|
114
|
+
}, W = async (t) => {
|
115
|
+
const s = await st(t), e = /* @__PURE__ */ new Set(), n = (g, c = []) => g ? Object.entries(g).flatMap(([m, l]) => {
|
116
|
+
if (!l) return;
|
117
|
+
if (typeof l == "object") return n(l, [...c, m]);
|
118
|
+
const S = [...c, m].join(".");
|
119
|
+
e.add(`"${S}"`);
|
120
|
+
const D = [...c.map(V), V(m)].join("-"), { result: N } = B(l);
|
121
|
+
return `--${D}: ${N};`;
|
122
|
+
}) : [], r = (g) => g ? Object.entries(g).flatMap(([c, m]) => {
|
123
|
+
const l = n(m);
|
124
|
+
return c === "base" ? l.join("") : `${c} { ${l.join("")} }`;
|
125
|
+
}) : [], y = (g) => g ? Object.entries(g).flatMap(([c, m]) => Object.entries(m).flatMap(([l, S]) => {
|
126
|
+
const D = n(S, [c]), N = `.${c}-${l}, [data-${c}="${l}"]`, P = D.join("");
|
127
|
+
return `${N} { ${P} }`;
|
128
|
+
})) : [], $ = n(s.variables), a = r(s.responsiveVariables), f = y(s.conditionalVariables), o = E(t), i = u(o, "css/variables.css"), p = `:root { ${$.join("")} ${a.join("")} } ${f.join("")}`;
|
129
|
+
C(i, p);
|
130
|
+
const h = u(o, "types/css-tokens.d.ts"), j = `type VariableTokens = ${[...e].join("|")}; type PropertyValueToken = \`{\${VariableTokens}}\``;
|
131
|
+
C(h, j);
|
132
|
+
const w = u(o, "css/global.css"), F = O(s.global, "");
|
133
|
+
C(w, F);
|
134
|
+
const d = u(o, "css/templates.css"), x = H(s.templates);
|
135
|
+
C(d, x);
|
136
|
+
}, R = async (t, s) => {
|
137
|
+
const e = A(t), n = u(s, "js", e + ".js");
|
138
|
+
await Z.build({
|
139
|
+
entryPoints: [t],
|
140
|
+
minify: !0,
|
141
|
+
treeShaking: !0,
|
142
|
+
bundle: !0,
|
143
|
+
outfile: n,
|
144
|
+
format: "esm",
|
145
|
+
target: ["es2022"],
|
146
|
+
keepNames: !0,
|
147
|
+
external: ["react"]
|
148
|
+
});
|
149
|
+
const r = Date.now();
|
150
|
+
return await import(`${n}?t=${r}`);
|
151
|
+
}, M = async (t) => {
|
152
|
+
const s = E(t), e = u(s, "salty.config.js"), { config: n } = await import(e);
|
153
|
+
return n;
|
154
|
+
}, et = async (t) => {
|
155
|
+
try {
|
156
|
+
const s = [], e = [], n = E(t), r = u(n, "index.css");
|
157
|
+
(() => {
|
158
|
+
z(n) && q("rm -rf " + n), T(n), T(u(n, "css")), T(u(n, "types"));
|
159
|
+
})(), await W(t);
|
160
|
+
const $ = await M(t);
|
161
|
+
async function a(p, h) {
|
162
|
+
const b = G(p);
|
163
|
+
if (b.isDirectory()) {
|
164
|
+
const j = L(p);
|
165
|
+
await Promise.all(j.map((w) => a(u(p, w), u(h, w))));
|
166
|
+
} else if (b.isFile() && k(p)) {
|
167
|
+
const w = await R(p, n), F = [];
|
168
|
+
Object.entries(w).forEach(([c, m]) => {
|
169
|
+
if (m.isKeyframes && m.css) {
|
170
|
+
const P = `${m.animationName}.css`, J = `css/${P}`, K = u(n, J);
|
171
|
+
s.push(P), C(K, m.css);
|
172
|
+
return;
|
173
|
+
}
|
174
|
+
if (!m.generator) return;
|
175
|
+
const l = m.generator._withBuildContext({
|
176
|
+
name: c,
|
177
|
+
config: $
|
178
|
+
}), S = `${l.hash}-${l.priority}.css`;
|
179
|
+
e[l.priority] || (e[l.priority] = []), e[l.priority].push(S), F.push(S);
|
180
|
+
const D = `css/${S}`, N = u(n, D);
|
181
|
+
C(N, l.css);
|
182
|
+
});
|
183
|
+
const d = F.map((c) => `@import url('./${c}');`).join(`
|
184
|
+
`), x = A(p, 6), g = u(n, `css/${x}.css`);
|
185
|
+
C(g, d);
|
186
|
+
}
|
187
|
+
}
|
188
|
+
await a(t, n);
|
189
|
+
const f = s.map((p) => `@import url('./css/${p}');`).join(`
|
190
|
+
`);
|
191
|
+
let i = `@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
192
|
+
|
193
|
+
${["@import url('./css/variables.css');", "@import url('./css/global.css');", "@import url('./css/templates.css');"].join(`
|
194
|
+
`)}
|
195
|
+
${f}`;
|
196
|
+
if ($.importStrategy !== "component") {
|
197
|
+
const p = e.flat().map((h) => `@import url('./css/${h}');`).join(`
|
198
|
+
`);
|
199
|
+
i += p;
|
200
|
+
}
|
201
|
+
C(r, i);
|
202
|
+
} catch (s) {
|
203
|
+
console.error(s);
|
204
|
+
}
|
205
|
+
}, nt = async (t, s) => {
|
206
|
+
try {
|
207
|
+
const e = [], n = u(t, "./saltygen"), r = u(n, "index.css");
|
208
|
+
if (k(s)) {
|
209
|
+
const $ = await M(t), a = await R(s, n);
|
210
|
+
Object.entries(a).forEach(([h, b]) => {
|
211
|
+
if (!b.generator) return;
|
212
|
+
const j = b.generator._withBuildContext({
|
213
|
+
name: h,
|
214
|
+
config: $
|
215
|
+
}), w = `${j.hash}-${j.priority}.css`, F = `css/${w}`, d = u(n, F);
|
216
|
+
e.push(w), C(d, j.css);
|
217
|
+
});
|
218
|
+
const f = I(r, "utf8").split(`
|
219
|
+
`), o = e.map((h) => `@import url('../saltygen/css/${h}');`), p = [.../* @__PURE__ */ new Set([...f, ...o])].join(`
|
220
|
+
`);
|
221
|
+
C(r, p);
|
222
|
+
}
|
223
|
+
} catch (e) {
|
224
|
+
console.error(e);
|
225
|
+
}
|
226
|
+
}, rt = async (t, s) => {
|
227
|
+
try {
|
228
|
+
const e = u(t, "./saltygen");
|
229
|
+
if (k(s)) {
|
230
|
+
const r = I(s, "utf8");
|
231
|
+
r.replace(/^(?!export\s)const\s.*/gm, (i) => `export ${i}`) !== r && await U(s, r);
|
232
|
+
const $ = await M(t), a = await R(s, e);
|
233
|
+
let f = r;
|
234
|
+
Object.entries(a).forEach(([i, p]) => {
|
235
|
+
var d;
|
236
|
+
if (p.isKeyframes) {
|
237
|
+
console.log("value", p);
|
238
|
+
return;
|
239
|
+
}
|
240
|
+
if (!p.generator) return;
|
241
|
+
const h = p.generator._withBuildContext({
|
242
|
+
name: i,
|
243
|
+
config: $
|
244
|
+
}), b = new RegExp(`${i}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(r);
|
245
|
+
if (!b)
|
246
|
+
return console.error("Could not find the original declaration");
|
247
|
+
const j = (d = b.at(1)) == null ? void 0 : d.trim(), w = `${i} = styled(${j}, "${h.classNames}", "${h._callerName}", ${JSON.stringify(h.props)});`, F = new RegExp(`${i}[=\\s]+[^()]+styled\\(([^,]+),[^;]+;`, "g");
|
248
|
+
f = f.replace(F, w);
|
249
|
+
});
|
250
|
+
const o = A(s, 6);
|
251
|
+
return $.importStrategy === "component" && (f = `import '../../saltygen/css/${o}.css';
|
252
|
+
${f}`), f = f.replace("{ styled }", "{ styledClient as styled }"), f = f.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), f;
|
253
|
+
}
|
254
|
+
} catch (e) {
|
255
|
+
console.error(e);
|
256
|
+
}
|
257
|
+
}, lt = (t) => ({
|
258
|
+
name: "stylegen",
|
259
|
+
buildStart: () => et(t),
|
260
|
+
load: async (s) => {
|
261
|
+
if (k(s))
|
262
|
+
return await rt(t, s);
|
263
|
+
},
|
264
|
+
watchChange: {
|
265
|
+
handler: async (s) => {
|
266
|
+
k(s) && await nt(t, s), s.includes("salty.config") && await W(t);
|
267
|
+
}
|
268
|
+
}
|
269
|
+
});
|
270
|
+
export {
|
271
|
+
lt as saltyPlugin
|
272
|
+
};
|
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.21",
|
4
4
|
"main": "./dist/index.js",
|
5
5
|
"module": "./dist/index.mjs",
|
6
6
|
"typings": "./dist/index.d.ts",
|
@@ -15,10 +15,11 @@
|
|
15
15
|
"url": "https://github.com/margarita-form/salty-css/issues"
|
16
16
|
},
|
17
17
|
"files": [
|
18
|
-
"
|
18
|
+
"**/*",
|
19
19
|
"!**/*.tsbuildinfo"
|
20
20
|
],
|
21
21
|
"nx": {
|
22
|
+
"sourceRoot": "libs/vite/src",
|
22
23
|
"name": "vite"
|
23
24
|
},
|
24
25
|
"exports": {
|
@@ -26,5 +27,8 @@
|
|
26
27
|
"import": "./index.js",
|
27
28
|
"require": "./index.cjs"
|
28
29
|
}
|
30
|
+
},
|
31
|
+
"peerDependencies": {
|
32
|
+
"@salty-css/core": "^0.0.1-alpha.15"
|
29
33
|
}
|
30
34
|
}
|