@salty-css/core 0.0.1-alpha.14 → 0.0.1-alpha.15
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +1 -1
- package/bin/bin-util.d.ts +1 -0
- package/bin/index.cjs +9 -0
- package/bin/index.d.ts +2 -0
- package/bin/index.js +118 -0
- package/bin/logger.d.ts +1 -0
- package/bin/prettier.d.ts +1 -0
- package/compiler/index.cjs +7 -7
- package/compiler/index.d.ts +1 -3
- package/compiler/index.js +97 -103
- package/dash-case-DKzpenwY.cjs +1 -0
- package/dash-case-DMQMcCO6.js +19 -0
- package/generator/index.cjs +1 -1
- package/generator/index.js +22 -17
- package/index-84Wroia-.cjs +1 -0
- package/index-D_732b92.js +4 -0
- package/package.json +7 -1
- package/{parse-templates-BOSK0Tb6.js → parse-templates-D4p3pgQR.js} +26 -24
- package/parse-templates-W0YfTmOT.cjs +8 -0
- package/pascal-case-BQpR5PdN.js +6 -0
- package/pascal-case-iWoaJWwT.cjs +1 -0
- package/react-styled-file-CGVf5n1B.js +11 -0
- package/react-styled-file-Dkubsz-U.cjs +8 -0
- package/salty.config-BupieCfE.cjs +6 -0
- package/salty.config-D9ANEDiH.js +9 -0
- package/util/camel-case.d.ts +1 -0
- package/util/index.cjs +1 -1
- package/util/index.d.ts +2 -0
- package/util/index.js +7 -15
- package/util/pascal-case.d.ts +1 -0
- package/parse-templates-BY1Xai-_.cjs +0 -8
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
|
|
@@ -0,0 +1 @@
|
|
1
|
+
export declare const execAsync: (command: string) => Promise<void>;
|
package/bin/index.cjs
ADDED
@@ -0,0 +1,9 @@
|
|
1
|
+
#!/usr/bin/env node
|
2
|
+
"use strict";const _=require("commander"),n=require("fs/promises"),t=require("path"),$=require("ejs"),D=require("../compiler/index.cjs"),N=require("../pascal-case-iWoaJWwT.cjs"),h=require("winston"),O=require("fs"),z=require("child_process"),o=h.createLogger({level:"debug",format:h.format.combine(h.format.colorize(),h.format.cli()),transports:[new h.transports.Console({})]}),I=a=>new Promise((g,m)=>{z.exec(a,j=>{if(j)return m(j);g()})}),J=()=>O.existsSync(t.join(process.cwd(),"node_modules",".bin","prettier"));async function v(a){try{if(!J())return;await I(`./node_modules/.bin/prettier --write "${a}"`),o.info(`Formatted ${a} with Prettier`)}catch(g){o.error(`Error formatting ${a} with Prettier:`,g)}}async function k(){const a=new _.Command;a.name("salty-css").description("Salty-CSS CLI tool to help with annoying configuration tasks.");const g={"salty.config.ts":Promise.resolve().then(()=>require("../salty.config-BupieCfE.cjs")),"saltygen/index.css":Promise.resolve().then(()=>require("../index-84Wroia-.cjs")),"react/react-styled-file.ts":Promise.resolve().then(()=>require("../react-styled-file-Dkubsz-U.cjs"))},m=async(s,l)=>{const{default:f}=await g[s],c=$.render(f,l);return{fileName:s,content:c}},j=async()=>{const s=t.join(process.cwd(),".saltyrc");return await n.readFile(s,"utf-8").then(JSON.parse).catch(()=>({}))},b=await(async()=>(await j()).defaultProject)();a.command("init").description("Initialize a new Salty-CSS project.").requiredOption("-d, --dir <dir>","Project directory to initialize the project in.").option("--css-file <css-file>","Existing CSS file where to import the generated CSS. Path must be relative to the given project directory.").action(async function(){o.info("Initializing a new Salty-CSS project...");const{dir:s,cssFile:l}=this.opts(),f=process.cwd(),c=t.join(f,s),C=await Promise.all([m("salty.config.ts"),m("saltygen/index.css")]);await n.mkdir(c,{recursive:!0});const F=C.map(async({fileName:e,content:r})=>{const d=t.join(c,e);if(await n.readFile(d,"utf-8").catch(()=>{})!==void 0){o.debug("File already exists: "+d);return}const q=e.split("/").slice(0,-1).join("/");q&&await n.mkdir(t.join(c,q),{recursive:!0}),o.info("Writing file: "+d),await n.writeFile(d,r),await v(d)});await Promise.all(F);const y=t.relative(f,c),i=t.join(f,".saltyrc"),p=await n.readFile(i,"utf-8").catch(()=>{});if(p===void 0){o.info("Creating file: "+i);const r=JSON.stringify({defaultProject:y,projects:[y]},null,2);await n.writeFile(i,r)}else{o.info("Edit file: "+i);const e=JSON.parse(p),r=new Set((e==null?void 0:e.projects)||[]);r.add(y),e.projects=[...r];const d=JSON.stringify(e,null,2);await n.writeFile(i,d)}const S=t.join(f,".gitignore"),w=await n.readFile(S,"utf-8").catch(()=>{});if(w!==void 0&&(w.includes("saltygen")||(o.info("Edit file: "+S),await n.writeFile(S,w+`
|
3
|
+
|
4
|
+
# Salty-CSS
|
5
|
+
saltygen
|
6
|
+
`))),l){const e=t.join(c,l),r=await n.readFile(e,"utf-8").catch(()=>{});if(r!==void 0&&!r.includes("saltygen")){const P=t.join(e,".."),E=`@import '${t.relative(P,t.join(c,"saltygen/index.css"))}';`;o.info("Edit file: "+e),await n.writeFile(e,E+`
|
7
|
+
`+r),await v(e)}}const u=t.join(c,"vite.config.ts"),x=await n.readFile(u,"utf-8").catch(()=>{});if(x!==void 0&&!x.includes("saltyPlugin")){o.info("Edit file: "+u);const r=`import { saltyPlugin } from '@salty-css/vite';
|
8
|
+
`,P=x.replace(/(plugins: \[)/,`$1
|
9
|
+
saltyPlugin(__dirname),`);o.info("Installing @salty-css/vite..."),await I("npm install @salty-css/vite"),o.info("Adding Salty-CSS plugin to Vite config..."),await n.writeFile(u,r+P),await v(u)}}),a.command("build").alias("b").description("Build the Salty-CSS project.").option("-d, --dir <dir>","Project directory to build the project in.",b).action(async function(){o.info("Building the Salty-CSS project...");const{dir:s}=this.opts(),l=t.join(process.cwd(),s);await D.generateCss(l)}),a.command("generate <file>").alias("g").description("Generate a new component file.").option("-d, --dir <dir>","Project directory to generate the file in.",b).option("-t, --tag <tag>","HTML tag of the component.","div").option("-n, --name <name>","Name of the component.").option("-c, --className <className>","CSS class of the component.").action(async function(s){const{dir:l,tag:f,name:c,className:C}=this.opts(),F=t.join(process.cwd(),l),y=t.join(F,s),i=t.parse(y);i.ext||(i.ext=".ts"),i.name.endsWith(".css")||(i.name=i.name+".css"),i.base=i.name+i.ext;const p=t.format(i);if(await n.readFile(p,"utf-8").catch(()=>{})!==void 0){o.error("File already exists:",p);return}o.info("Generating a new file: "+p);const w=N.pascalCase(c||i.base.replace(/\.css\.\w+$/,"")),{content:u}=await m("react/react-styled-file.ts",{tag:f,name:w,className:C});await n.writeFile(p,u),await v(p)}),a.parseAsync(process.argv)}k().catch(a=>console.error(a));
|
package/bin/index.d.ts
ADDED
package/bin/index.js
ADDED
@@ -0,0 +1,118 @@
|
|
1
|
+
#!/usr/bin/env node
|
2
|
+
import { Command as _ } from "commander";
|
3
|
+
import { mkdir as $, readFile as p, writeFile as m } from "fs/promises";
|
4
|
+
import { join as n, relative as D, parse as z, format as J } from "path";
|
5
|
+
import { render as A } from "ejs";
|
6
|
+
import { generateCss as H } from "../compiler/index.js";
|
7
|
+
import { p as L } from "../pascal-case-BQpR5PdN.js";
|
8
|
+
import { createLogger as W, format as I, transports as k } from "winston";
|
9
|
+
import { existsSync as B } from "fs";
|
10
|
+
import { exec as G } from "child_process";
|
11
|
+
const i = W({
|
12
|
+
level: "debug",
|
13
|
+
format: I.combine(I.colorize(), I.cli()),
|
14
|
+
transports: [new k.Console({})]
|
15
|
+
}), N = (o) => new Promise((g, u) => {
|
16
|
+
G(o, (S) => {
|
17
|
+
if (S) return u(S);
|
18
|
+
g();
|
19
|
+
});
|
20
|
+
}), T = () => B(n(process.cwd(), "node_modules", ".bin", "prettier"));
|
21
|
+
async function v(o) {
|
22
|
+
try {
|
23
|
+
if (!T()) return;
|
24
|
+
await N(`./node_modules/.bin/prettier --write "${o}"`), i.info(`Formatted ${o} with Prettier`);
|
25
|
+
} catch (g) {
|
26
|
+
i.error(`Error formatting ${o} with Prettier:`, g);
|
27
|
+
}
|
28
|
+
}
|
29
|
+
async function q() {
|
30
|
+
const o = new _();
|
31
|
+
o.name("salty-css").description("Salty-CSS CLI tool to help with annoying configuration tasks.");
|
32
|
+
const g = {
|
33
|
+
// Core files
|
34
|
+
"salty.config.ts": import("../salty.config-D9ANEDiH.js"),
|
35
|
+
"saltygen/index.css": import("../index-D_732b92.js"),
|
36
|
+
// React
|
37
|
+
"react/react-styled-file.ts": import("../react-styled-file-CGVf5n1B.js")
|
38
|
+
}, u = async (s, c) => {
|
39
|
+
const { default: d } = await g[s], r = A(d, c);
|
40
|
+
return { fileName: s, content: r };
|
41
|
+
}, S = async () => {
|
42
|
+
const s = n(process.cwd(), ".saltyrc");
|
43
|
+
return await p(s, "utf-8").then(JSON.parse).catch(() => ({}));
|
44
|
+
}, E = await (async () => (await S()).defaultProject)();
|
45
|
+
o.command("init").description("Initialize a new Salty-CSS project.").requiredOption("-d, --dir <dir>", "Project directory to initialize the project in.").option("--css-file <css-file>", "Existing CSS file where to import the generated CSS. Path must be relative to the given project directory.").action(async function() {
|
46
|
+
i.info("Initializing a new Salty-CSS project...");
|
47
|
+
const { dir: s, cssFile: c } = this.opts(), d = process.cwd(), r = n(d, s), j = await Promise.all([u("salty.config.ts"), u("saltygen/index.css")]);
|
48
|
+
await $(r, { recursive: !0 });
|
49
|
+
const x = j.map(async ({ fileName: t, content: a }) => {
|
50
|
+
const l = n(r, t);
|
51
|
+
if (await p(l, "utf-8").catch(() => {
|
52
|
+
}) !== void 0) {
|
53
|
+
i.debug("File already exists: " + l);
|
54
|
+
return;
|
55
|
+
}
|
56
|
+
const b = t.split("/").slice(0, -1).join("/");
|
57
|
+
b && await $(n(r, b), { recursive: !0 }), i.info("Writing file: " + l), await m(l, a), await v(l);
|
58
|
+
});
|
59
|
+
await Promise.all(x);
|
60
|
+
const w = D(d, r), e = n(d, ".saltyrc"), f = await p(e, "utf-8").catch(() => {
|
61
|
+
});
|
62
|
+
if (f === void 0) {
|
63
|
+
i.info("Creating file: " + e);
|
64
|
+
const a = JSON.stringify({
|
65
|
+
defaultProject: w,
|
66
|
+
projects: [w]
|
67
|
+
}, null, 2);
|
68
|
+
await m(e, a);
|
69
|
+
} else {
|
70
|
+
i.info("Edit file: " + e);
|
71
|
+
const t = JSON.parse(f), a = new Set((t == null ? void 0 : t.projects) || []);
|
72
|
+
a.add(w), t.projects = [...a];
|
73
|
+
const l = JSON.stringify(t, null, 2);
|
74
|
+
await m(e, l);
|
75
|
+
}
|
76
|
+
const P = n(d, ".gitignore"), h = await p(P, "utf-8").catch(() => {
|
77
|
+
});
|
78
|
+
if (h !== void 0 && (h.includes("saltygen") || (i.info("Edit file: " + P), await m(P, h + `
|
79
|
+
|
80
|
+
# Salty-CSS
|
81
|
+
saltygen
|
82
|
+
`))), c) {
|
83
|
+
const t = n(r, c), a = await p(t, "utf-8").catch(() => {
|
84
|
+
});
|
85
|
+
if (a !== void 0 && !a.includes("saltygen")) {
|
86
|
+
const C = n(t, ".."), O = `@import '${D(C, n(r, "saltygen/index.css"))}';`;
|
87
|
+
i.info("Edit file: " + t), await m(t, O + `
|
88
|
+
` + a), await v(t);
|
89
|
+
}
|
90
|
+
}
|
91
|
+
const y = n(r, "vite.config.ts"), F = await p(y, "utf-8").catch(() => {
|
92
|
+
});
|
93
|
+
if (F !== void 0 && !F.includes("saltyPlugin")) {
|
94
|
+
i.info("Edit file: " + y);
|
95
|
+
const a = `import { saltyPlugin } from '@salty-css/vite';
|
96
|
+
`, C = F.replace(/(plugins: \[)/, `$1
|
97
|
+
saltyPlugin(__dirname),`);
|
98
|
+
i.info("Installing @salty-css/vite..."), await N("npm install @salty-css/vite"), i.info("Adding Salty-CSS plugin to Vite config..."), await m(y, a + C), await v(y);
|
99
|
+
}
|
100
|
+
}), o.command("build").alias("b").description("Build the Salty-CSS project.").option("-d, --dir <dir>", "Project directory to build the project in.", E).action(async function() {
|
101
|
+
i.info("Building the Salty-CSS project...");
|
102
|
+
const { dir: s } = this.opts(), c = n(process.cwd(), s);
|
103
|
+
await H(c);
|
104
|
+
}), o.command("generate <file>").alias("g").description("Generate a new component file.").option("-d, --dir <dir>", "Project directory to generate the file in.", E).option("-t, --tag <tag>", "HTML tag of the component.", "div").option("-n, --name <name>", "Name of the component.").option("-c, --className <className>", "CSS class of the component.").action(async function(s) {
|
105
|
+
const { dir: c, tag: d, name: r, className: j } = this.opts(), x = n(process.cwd(), c), w = n(x, s), e = z(w);
|
106
|
+
e.ext || (e.ext = ".ts"), e.name.endsWith(".css") || (e.name = e.name + ".css"), e.base = e.name + e.ext;
|
107
|
+
const f = J(e);
|
108
|
+
if (await p(f, "utf-8").catch(() => {
|
109
|
+
}) !== void 0) {
|
110
|
+
i.error("File already exists:", f);
|
111
|
+
return;
|
112
|
+
}
|
113
|
+
i.info("Generating a new file: " + f);
|
114
|
+
const h = L(r || e.base.replace(/\.css\.\w+$/, "")), { content: y } = await u("react/react-styled-file.ts", { tag: d, name: h, className: j });
|
115
|
+
await m(f, y), await v(f);
|
116
|
+
}), o.parseAsync(process.argv);
|
117
|
+
}
|
118
|
+
q().catch((o) => console.error(o));
|
package/bin/logger.d.ts
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
export declare const logger: import('winston').Logger;
|
@@ -0,0 +1 @@
|
|
1
|
+
export declare function formatWithPrettier(filePath: string): Promise<void>;
|
package/compiler/index.cjs
CHANGED
@@ -1,11 +1,11 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
2
|
-
`),v=
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const z=require("esbuild"),B=require("child_process"),P=require("../dash-case-DKzpenwY.cjs"),o=require("path"),r=require("fs"),K=require("fs/promises"),V=require("../parse-templates-W0YfTmOT.cjs");function G(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,s.get?s:{enumerable:!0,get:()=>t[n]})}}return e.default=t,Object.freeze(e)}const R=G(z),N=t=>o.join(t,"./saltygen"),_=["salty","css","styles","styled"],q=(t=[])=>new RegExp(`\\.(${[..._,...t].join("|")})\\.`),O=(t,e=[])=>q(e).test(t),J=async t=>{const e=N(t),n=o.join(t,"salty.config.ts"),s=o.join(e,"salty.config.js");await R.build({entryPoints:[n],minify:!0,treeShaking:!0,bundle:!0,outfile:s,format:"esm",external:["react"]});const a=Date.now(),{config:w}=await import(`${s}?t=${a}`);return w},M=async t=>{const e=await J(t),n=new Set,s=(d,y=[])=>d?Object.entries(d).flatMap(([p,c])=>{if(!c)return;if(typeof c=="object")return s(c,[...y,p]);const C=[...y,p].join(".");n.add(`"${C}"`);const x=[...y.map(P.dashCase),P.dashCase(p)].join("-"),{result:D}=V.parseValueTokens(c);return`--${x}: ${D};`}):[],a=d=>d?Object.entries(d).flatMap(([y,p])=>{const c=s(p);return y==="base"?c.join(""):`${y} { ${c.join("")} }`}):[],w=d=>d?Object.entries(d).flatMap(([y,p])=>Object.entries(p).flatMap(([c,C])=>{const x=s(C,[y]),D=`.${y}-${c}, [data-${y}="${c}"]`,k=x.join("");return`${D} { ${k} }`})):[],j=s(e.variables),S=a(e.responsiveVariables),l=w(e.conditionalVariables),b=N(t),f=o.join(b,"css/variables.css"),i=`:root { ${j.join("")} ${S.join("")} } ${l.join("")}`;r.writeFileSync(f,i);const g=o.join(b,"types/css-tokens.d.ts"),m=`type VariableTokens = ${[...n].join("|")}; type PropertyValueToken = \`{\${VariableTokens}}\``;r.writeFileSync(g,m);const u=o.join(b,"css/global.css"),h=V.parseStyles(e.global,"");r.writeFileSync(u,h);const F=o.join(b,"css/templates.css"),v=V.parseTemplates(e.templates);r.writeFileSync(F,v)},T=async(t,e)=>{const n=P.toHash(t),s=o.join(e,"js",n+".js");await R.build({entryPoints:[t],minify:!0,treeShaking:!0,bundle:!0,outfile:s,format:"esm",target:["es2022"],keepNames:!0,external:["react"]});const a=Date.now();return await import(`${s}?t=${a}`)},E=async t=>{const e=N(t),n=o.join(e,"salty.config.js"),{config:s}=await import(n);return s},A=async t=>{try{const e=[],n=[],s=N(t),a=o.join(s,"index.css");(()=>{r.existsSync(s)&&B.execSync("rm -rf "+s),r.mkdirSync(s),r.mkdirSync(o.join(s,"css")),r.mkdirSync(o.join(s,"types"))})(),await M(t);const j=await E(t);async function S(i,g){const $=r.statSync(i);if($.isDirectory()){const m=r.readdirSync(i);await Promise.all(m.map(u=>S(o.join(i,u),o.join(g,u))))}else if($.isFile()&&O(i)){const u=await T(i,s),h=[];Object.entries(u).forEach(([y,p])=>{if(p.isKeyframes&&p.css){const k=`${p.animationName}.css`,H=`css/${k}`,I=o.join(s,H);e.push(k),r.writeFileSync(I,p.css);return}if(!p.generator)return;const c=p.generator._withBuildContext({name:y,config:j}),C=`${c.hash}-${c.priority}.css`;n[c.priority]||(n[c.priority]=[]),n[c.priority].push(C),h.push(C);const x=`css/${C}`,D=o.join(s,x);r.writeFileSync(D,c.css)});const F=h.map(y=>`@import url('./${y}');`).join(`
|
2
|
+
`),v=P.toHash(i,6),d=o.join(s,`css/${v}.css`);r.writeFileSync(d,F)}}await S(t,s);const l=e.map(i=>`@import url('./css/${i}');`).join(`
|
3
3
|
`);let f=`@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
4
4
|
|
5
5
|
${["@import url('./css/variables.css');","@import url('./css/global.css');","@import url('./css/templates.css');"].join(`
|
6
6
|
`)}
|
7
|
-
${l}`;if(
|
8
|
-
`);f+=i}r.writeFileSync(a,f)}catch(
|
9
|
-
`),
|
10
|
-
`);r.writeFileSync(a,i)}}catch(n){console.error(n)}},
|
11
|
-
${l}`),l=l.replace("{ styled }","{ styledClient as styled }"),l=l.replace("@salty-css/react/styled","@salty-css/react/styled-client"),l}}catch(n){console.error(n)}};exports.compileSaltyFile=
|
7
|
+
${l}`;if(j.importStrategy!=="component"){const i=n.flat().map(g=>`@import url('./css/${g}');`).join(`
|
8
|
+
`);f+=i}r.writeFileSync(a,f)}catch(e){console.error(e)}},L=async(t,e)=>{try{const n=[],s=o.join(t,"./saltygen"),a=o.join(s,"index.css");if(O(e)){const j=await E(t),S=await T(e,s);Object.entries(S).forEach(([g,$])=>{if(!$.generator)return;const m=$.generator._withBuildContext({name:g,config:j}),u=`${m.hash}-${m.priority}.css`,h=`css/${u}`,F=o.join(s,h);n.push(u),r.writeFileSync(F,m.css)});const l=r.readFileSync(a,"utf8").split(`
|
9
|
+
`),b=n.map(g=>`@import url('../saltygen/css/${g}');`),i=[...new Set([...l,...b])].join(`
|
10
|
+
`);r.writeFileSync(a,i)}}catch(n){console.error(n)}},U=async(t,e)=>{try{const n=o.join(t,"./saltygen");if(O(e)){const a=r.readFileSync(e,"utf8");a.replace(/^(?!export\s)const\s.*/gm,f=>`export ${f}`)!==a&&await K.writeFile(e,a);const j=await E(t),S=await T(e,n);let l=a;Object.entries(S).forEach(([f,i])=>{var F;if(i.isKeyframes){console.log("value",i);return}if(!i.generator)return;const g=i.generator._withBuildContext({name:f,config:j}),$=new RegExp(`${f}[=\\s]+[^()]+styled\\(([^,]+),`,"g").exec(a);if(!$)return console.error("Could not find the original declaration");const m=(F=$.at(1))==null?void 0:F.trim(),u=`${f} = styled(${m}, "${g.classNames}", "${g._callerName}", ${JSON.stringify(g.props)});`,h=new RegExp(`${f}[=\\s]+[^()]+styled\\(([^,]+),[^;]+;`,"g");l=l.replace(h,u)});const b=P.toHash(e,6);return j.importStrategy==="component"&&(l=`import '../../saltygen/css/${b}.css';
|
11
|
+
${l}`),l=l.replace("{ styled }","{ styledClient as styled }"),l=l.replace("@salty-css/react/styled","@salty-css/react/styled-client"),l}}catch(n){console.error(n)}};exports.compileSaltyFile=T;exports.generateConfigStyles=M;exports.generateCss=A;exports.generateFile=L;exports.isSaltyFile=O;exports.minimizeFile=U;exports.saltyFileExtensions=_;exports.saltyFileRegExp=q;
|
package/compiler/index.d.ts
CHANGED
@@ -1,10 +1,8 @@
|
|
1
1
|
import { StyleComponentGenerator } from '../generator/style-generator';
|
2
|
-
import * as winston from 'winston';
|
3
|
-
export declare const logger: winston.Logger;
|
4
2
|
export declare const saltyFileExtensions: string[];
|
5
3
|
export declare const saltyFileRegExp: (additional?: string[]) => RegExp;
|
6
4
|
export declare const isSaltyFile: (file: string, additional?: string[]) => boolean;
|
7
|
-
export declare const
|
5
|
+
export declare const generateConfigStyles: (dirname: string) => Promise<void>;
|
8
6
|
export declare const compileSaltyFile: (sourceFilePath: string, outputDirectory: string) => Promise<{
|
9
7
|
[key: string]: {
|
10
8
|
generator: StyleComponentGenerator;
|
package/compiler/index.js
CHANGED
@@ -1,19 +1,14 @@
|
|
1
|
-
import * as
|
2
|
-
import * as P from "winston";
|
1
|
+
import * as I from "esbuild";
|
3
2
|
import { execSync as H } from "child_process";
|
4
|
-
import {
|
5
|
-
import { join as
|
6
|
-
import { writeFileSync as $, existsSync as K, mkdirSync as
|
7
|
-
import { writeFile as
|
8
|
-
import { p as q, a as A, b as
|
9
|
-
const
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
}), V = (s) => n(s, "./saltygen"), W = ["salty", "css", "styles", "styled"], X = (s = []) => new RegExp(`\\.(${[...W, ...s].join("|")})\\.`), E = (s, e = []) => X(e).test(s), Y = async (s) => {
|
14
|
-
const e = V(s), o = n(s, "salty-config.ts"), t = n(e, "salty-config.js");
|
15
|
-
await M.build({
|
16
|
-
entryPoints: [o],
|
3
|
+
import { t as T, d as R } from "../dash-case-DMQMcCO6.js";
|
4
|
+
import { join as o } from "path";
|
5
|
+
import { writeFileSync as $, existsSync as K, mkdirSync as V, statSync as z, readdirSync as G, readFileSync as M } from "fs";
|
6
|
+
import { writeFile as J } from "fs/promises";
|
7
|
+
import { p as q, a as A, b as L } from "../parse-templates-D4p3pgQR.js";
|
8
|
+
const N = (s) => o(s, "./saltygen"), U = ["salty", "css", "styles", "styled"], W = (s = []) => new RegExp(`\\.(${[...U, ...s].join("|")})\\.`), v = (s, e = []) => W(e).test(s), X = async (s) => {
|
9
|
+
const e = N(s), n = o(s, "salty.config.ts"), t = o(e, "salty.config.js");
|
10
|
+
await I.build({
|
11
|
+
entryPoints: [n],
|
17
12
|
minify: !0,
|
18
13
|
treeShaking: !0,
|
19
14
|
bundle: !0,
|
@@ -23,31 +18,31 @@ const rt = P.createLogger({
|
|
23
18
|
});
|
24
19
|
const c = Date.now(), { config: S } = await import(`${t}?t=${c}`);
|
25
20
|
return S;
|
26
|
-
},
|
27
|
-
const e = await
|
28
|
-
if (!
|
29
|
-
if (typeof
|
21
|
+
}, Y = async (s) => {
|
22
|
+
const e = await X(s), n = /* @__PURE__ */ new Set(), t = (u, l = []) => u ? Object.entries(u).flatMap(([p, r]) => {
|
23
|
+
if (!r) return;
|
24
|
+
if (typeof r == "object") return t(r, [...l, p]);
|
30
25
|
const x = [...l, p].join(".");
|
31
|
-
|
32
|
-
const C = [...l.map(
|
26
|
+
n.add(`"${x}"`);
|
27
|
+
const C = [...l.map(R), R(p)].join("-"), { result: D } = L(r);
|
33
28
|
return `--${C}: ${D};`;
|
34
29
|
}) : [], c = (u) => u ? Object.entries(u).flatMap(([l, p]) => {
|
35
|
-
const
|
36
|
-
return l === "base" ?
|
37
|
-
}) : [], S = (u) => u ? Object.entries(u).flatMap(([l, p]) => Object.entries(p).flatMap(([
|
38
|
-
const C = t(x, [l]), D = `.${l}-${
|
39
|
-
return `${D} { ${
|
40
|
-
})) : [], d = t(e.variables), w = c(e.responsiveVariables), a = S(e.conditionalVariables), b =
|
41
|
-
$(
|
42
|
-
const
|
43
|
-
$(
|
44
|
-
const
|
45
|
-
$(
|
46
|
-
const j =
|
30
|
+
const r = t(p);
|
31
|
+
return l === "base" ? r.join("") : `${l} { ${r.join("")} }`;
|
32
|
+
}) : [], S = (u) => u ? Object.entries(u).flatMap(([l, p]) => Object.entries(p).flatMap(([r, x]) => {
|
33
|
+
const C = t(x, [l]), D = `.${l}-${r}, [data-${l}="${r}"]`, P = C.join("");
|
34
|
+
return `${D} { ${P} }`;
|
35
|
+
})) : [], d = t(e.variables), w = c(e.responsiveVariables), a = S(e.conditionalVariables), b = N(s), f = o(b, "css/variables.css"), i = `:root { ${d.join("")} ${w.join("")} } ${a.join("")}`;
|
36
|
+
$(f, i);
|
37
|
+
const y = o(b, "types/css-tokens.d.ts"), m = `type VariableTokens = ${[...n].join("|")}; type PropertyValueToken = \`{\${VariableTokens}}\``;
|
38
|
+
$(y, m);
|
39
|
+
const g = o(b, "css/global.css"), F = q(e.global, "");
|
40
|
+
$(g, F);
|
41
|
+
const j = o(b, "css/templates.css"), k = A(e.templates);
|
47
42
|
$(j, k);
|
48
|
-
},
|
49
|
-
const
|
50
|
-
await
|
43
|
+
}, E = async (s, e) => {
|
44
|
+
const n = T(s), t = o(e, "js", n + ".js");
|
45
|
+
await I.build({
|
51
46
|
entryPoints: [s],
|
52
47
|
minify: !0,
|
53
48
|
treeShaking: !0,
|
@@ -60,121 +55,120 @@ const rt = P.createLogger({
|
|
60
55
|
});
|
61
56
|
const c = Date.now();
|
62
57
|
return await import(`${t}?t=${c}`);
|
63
|
-
},
|
64
|
-
const e =
|
58
|
+
}, O = async (s) => {
|
59
|
+
const e = N(s), n = o(e, "salty.config.js"), { config: t } = await import(n);
|
65
60
|
return t;
|
66
|
-
},
|
61
|
+
}, ot = async (s) => {
|
67
62
|
try {
|
68
|
-
const e = [],
|
63
|
+
const e = [], n = [], t = N(s), c = o(t, "index.css");
|
69
64
|
(() => {
|
70
|
-
K(t) && H("rm -rf " + t),
|
71
|
-
})(), await
|
72
|
-
const d = await
|
73
|
-
async function w(
|
74
|
-
const h =
|
65
|
+
K(t) && H("rm -rf " + t), V(t), V(o(t, "css")), V(o(t, "types"));
|
66
|
+
})(), await Y(s);
|
67
|
+
const d = await O(s);
|
68
|
+
async function w(i, y) {
|
69
|
+
const h = z(i);
|
75
70
|
if (h.isDirectory()) {
|
76
|
-
const
|
77
|
-
await Promise.all(
|
78
|
-
} else if (h.isFile() &&
|
79
|
-
const
|
80
|
-
Object.entries(
|
71
|
+
const m = G(i);
|
72
|
+
await Promise.all(m.map((g) => w(o(i, g), o(y, g))));
|
73
|
+
} else if (h.isFile() && v(i)) {
|
74
|
+
const g = await E(i, t), F = [];
|
75
|
+
Object.entries(g).forEach(([l, p]) => {
|
81
76
|
if (p.isKeyframes && p.css) {
|
82
|
-
const
|
83
|
-
e.push(
|
77
|
+
const P = `${p.animationName}.css`, _ = `css/${P}`, B = o(t, _);
|
78
|
+
e.push(P), $(B, p.css);
|
84
79
|
return;
|
85
80
|
}
|
86
81
|
if (!p.generator) return;
|
87
|
-
const
|
82
|
+
const r = p.generator._withBuildContext({
|
88
83
|
name: l,
|
89
84
|
config: d
|
90
|
-
}), x = `${
|
91
|
-
|
92
|
-
const C = `css/${x}`, D =
|
93
|
-
$(D,
|
85
|
+
}), x = `${r.hash}-${r.priority}.css`;
|
86
|
+
n[r.priority] || (n[r.priority] = []), n[r.priority].push(x), F.push(x);
|
87
|
+
const C = `css/${x}`, D = o(t, C);
|
88
|
+
$(D, r.css);
|
94
89
|
});
|
95
90
|
const j = F.map((l) => `@import url('./${l}');`).join(`
|
96
|
-
`), k = T(
|
91
|
+
`), k = T(i, 6), u = o(t, `css/${k}.css`);
|
97
92
|
$(u, j);
|
98
93
|
}
|
99
94
|
}
|
100
95
|
await w(s, t);
|
101
|
-
const a = e.map((
|
96
|
+
const a = e.map((i) => `@import url('./css/${i}');`).join(`
|
102
97
|
`);
|
103
|
-
let
|
98
|
+
let f = `@layer l0, l1, l2, l3, l4, l5, l6, l7, l8;
|
104
99
|
|
105
100
|
${["@import url('./css/variables.css');", "@import url('./css/global.css');", "@import url('./css/templates.css');"].join(`
|
106
101
|
`)}
|
107
102
|
${a}`;
|
108
103
|
if (d.importStrategy !== "component") {
|
109
|
-
const
|
104
|
+
const i = n.flat().map((y) => `@import url('./css/${y}');`).join(`
|
110
105
|
`);
|
111
|
-
|
106
|
+
f += i;
|
112
107
|
}
|
113
|
-
$(c,
|
108
|
+
$(c, f);
|
114
109
|
} catch (e) {
|
115
110
|
console.error(e);
|
116
111
|
}
|
117
|
-
},
|
112
|
+
}, it = async (s, e) => {
|
118
113
|
try {
|
119
|
-
const
|
120
|
-
if (
|
121
|
-
const d = await
|
122
|
-
Object.entries(w).forEach(([
|
114
|
+
const n = [], t = o(s, "./saltygen"), c = o(t, "index.css");
|
115
|
+
if (v(e)) {
|
116
|
+
const d = await O(s), w = await E(e, t);
|
117
|
+
Object.entries(w).forEach(([y, h]) => {
|
123
118
|
if (!h.generator) return;
|
124
|
-
const
|
125
|
-
name:
|
119
|
+
const m = h.generator._withBuildContext({
|
120
|
+
name: y,
|
126
121
|
config: d
|
127
|
-
}),
|
128
|
-
|
122
|
+
}), g = `${m.hash}-${m.priority}.css`, F = `css/${g}`, j = o(t, F);
|
123
|
+
n.push(g), $(j, m.css);
|
129
124
|
});
|
130
|
-
const a =
|
131
|
-
`), b =
|
125
|
+
const a = M(c, "utf8").split(`
|
126
|
+
`), b = n.map((y) => `@import url('../saltygen/css/${y}');`), i = [.../* @__PURE__ */ new Set([...a, ...b])].join(`
|
132
127
|
`);
|
133
|
-
$(c,
|
128
|
+
$(c, i);
|
134
129
|
}
|
135
|
-
} catch (
|
136
|
-
console.error(
|
130
|
+
} catch (n) {
|
131
|
+
console.error(n);
|
137
132
|
}
|
138
|
-
},
|
133
|
+
}, rt = async (s, e) => {
|
139
134
|
try {
|
140
|
-
const
|
141
|
-
if (
|
142
|
-
const c =
|
143
|
-
c.replace(/^(?!export\s)const\s.*/gm, (
|
144
|
-
const d = await
|
135
|
+
const n = o(s, "./saltygen");
|
136
|
+
if (v(e)) {
|
137
|
+
const c = M(e, "utf8");
|
138
|
+
c.replace(/^(?!export\s)const\s.*/gm, (f) => `export ${f}`) !== c && await J(e, c);
|
139
|
+
const d = await O(s), w = await E(e, n);
|
145
140
|
let a = c;
|
146
|
-
Object.entries(w).forEach(([
|
141
|
+
Object.entries(w).forEach(([f, i]) => {
|
147
142
|
var j;
|
148
|
-
if (
|
149
|
-
console.log("value",
|
143
|
+
if (i.isKeyframes) {
|
144
|
+
console.log("value", i);
|
150
145
|
return;
|
151
146
|
}
|
152
|
-
if (!
|
153
|
-
const
|
154
|
-
name:
|
147
|
+
if (!i.generator) return;
|
148
|
+
const y = i.generator._withBuildContext({
|
149
|
+
name: f,
|
155
150
|
config: d
|
156
|
-
}), h = new RegExp(`${
|
151
|
+
}), h = new RegExp(`${f}[=\\s]+[^()]+styled\\(([^,]+),`, "g").exec(c);
|
157
152
|
if (!h)
|
158
153
|
return console.error("Could not find the original declaration");
|
159
|
-
const
|
160
|
-
a = a.replace(F,
|
154
|
+
const m = (j = h.at(1)) == null ? void 0 : j.trim(), g = `${f} = styled(${m}, "${y.classNames}", "${y._callerName}", ${JSON.stringify(y.props)});`, F = new RegExp(`${f}[=\\s]+[^()]+styled\\(([^,]+),[^;]+;`, "g");
|
155
|
+
a = a.replace(F, g);
|
161
156
|
});
|
162
157
|
const b = T(e, 6);
|
163
158
|
return d.importStrategy === "component" && (a = `import '../../saltygen/css/${b}.css';
|
164
159
|
${a}`), a = a.replace("{ styled }", "{ styledClient as styled }"), a = a.replace("@salty-css/react/styled", "@salty-css/react/styled-client"), a;
|
165
160
|
}
|
166
|
-
} catch (
|
167
|
-
console.error(
|
161
|
+
} catch (n) {
|
162
|
+
console.error(n);
|
168
163
|
}
|
169
164
|
};
|
170
165
|
export {
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
rt as
|
177
|
-
|
178
|
-
W as
|
179
|
-
X as saltyFileRegExp
|
166
|
+
E as compileSaltyFile,
|
167
|
+
Y as generateConfigStyles,
|
168
|
+
ot as generateCss,
|
169
|
+
it as generateFile,
|
170
|
+
v as isSaltyFile,
|
171
|
+
rt as minimizeFile,
|
172
|
+
U as saltyFileExtensions,
|
173
|
+
W as saltyFileRegExp
|
180
174
|
};
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";const n=e=>String.fromCharCode(e+(e>25?39:97)),i=(e,r)=>{let t="",a;for(a=Math.abs(e);a>52;a=a/52|0)t=n(a%52)+t;return t=n(a%52)+t,t.length<r?t=t.padStart(r,"a"):t.length>r&&(t=t.slice(-r)),t},o=(e,r)=>{let t=r.length;for(;t;)e=e*33^r.charCodeAt(--t);return e},c=(e,r=3)=>{const t=o(5381,JSON.stringify(e))>>>0;return i(t,r)};function s(e){return e?typeof e!="string"?s(String(e)):e.replace(/\s/g,"-").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g,(r,t)=>(t>0?"-":"")+r.toLowerCase()):""}exports.dashCase=s;exports.toHash=c;
|
@@ -0,0 +1,19 @@
|
|
1
|
+
const n = (e) => String.fromCharCode(e + (e > 25 ? 39 : 97)), o = (e, r) => {
|
2
|
+
let t = "", a;
|
3
|
+
for (a = Math.abs(e); a > 52; a = a / 52 | 0) t = n(a % 52) + t;
|
4
|
+
return t = n(a % 52) + t, t.length < r ? t = t.padStart(r, "a") : t.length > r && (t = t.slice(-r)), t;
|
5
|
+
}, i = (e, r) => {
|
6
|
+
let t = r.length;
|
7
|
+
for (; t; ) e = e * 33 ^ r.charCodeAt(--t);
|
8
|
+
return e;
|
9
|
+
}, c = (e, r = 3) => {
|
10
|
+
const t = i(5381, JSON.stringify(e)) >>> 0;
|
11
|
+
return o(t, r);
|
12
|
+
};
|
13
|
+
function s(e) {
|
14
|
+
return e ? typeof e != "string" ? s(String(e)) : e.replace(/\s/g, "-").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g, (r, t) => (t > 0 ? "-" : "") + r.toLowerCase()) : "";
|
15
|
+
}
|
16
|
+
export {
|
17
|
+
s as d,
|
18
|
+
c as t
|
19
|
+
};
|
package/generator/index.cjs
CHANGED
@@ -1 +1 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
1
|
+
"use strict";var m=Object.defineProperty;var l=(a,t,s)=>t in a?m(a,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):a[t]=s;var c=(a,t,s)=>l(a,typeof t!="symbol"?t+"":t,s);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../dash-case-DKzpenwY.cjs"),p=require("../parse-templates-W0YfTmOT.cjs");class g{constructor(t,s){c(this,"_callerName");c(this,"_context");this.tagName=t,this.params=s}get hash(){return u.toHash(this.params.base||this.params)}get priority(){var t;return typeof this.tagName=="function"||typeof this.tagName=="object"?(((t=this.tagName.generator)==null?void 0:t.priority)||0)+1:0}get classNames(){const t=[this.hash],{className:s}=this.params;return s&&t.push(s),t.join(" ")}get cssClassName(){return this.hash}get cssDisplayNameVar(){return`--${this.hash}-display-name: ${this._callerName};`}get templateKeys(){var t;return(t=this._context)!=null&&t.config.templates?p.getTemplateKeys(this._context.config.templates):[]}get css(){var e;const{base:t={},variants:s={},compoundVariants:r=[]}=this.params,i={...t,variants:s,compoundVariants:r};return p.parseStyles(i,`.${this.cssClassName}`,this.priority,(e=this._context)==null?void 0:e.config)}get props(){const{element:t}=this.params,s=this.params.variants?Object.keys(this.params.variants).map(e=>{var n;const o=(n=this.params.defaultVariants)==null?void 0:n[e];return o!==void 0?`${e}=${String(o)}`:e}):void 0,r=new Set([]),i=/\{props\.([\w\d]+)\}/gi.exec(JSON.stringify(this.params.base));return i&&i.forEach((e,o,n)=>{const h=n.at(1);h&&r.add(h)}),{element:t,variantKeys:s,propValueKeys:[...r]}}_withBuildContext(t){this._context=t;const{name:s,config:r}=t;return this._callerName=s,this}}exports.StyleComponentGenerator=g;
|
package/generator/index.js
CHANGED
@@ -1,11 +1,16 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
1
|
+
var h = Object.defineProperty;
|
2
|
+
var m = (e, t, s) => t in e ? h(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s;
|
3
|
+
var c = (e, t, s) => m(e, typeof t != "symbol" ? t + "" : t, s);
|
4
|
+
import { t as l } from "../dash-case-DMQMcCO6.js";
|
5
|
+
import { g, p as u } from "../parse-templates-D4p3pgQR.js";
|
6
|
+
class d {
|
4
7
|
constructor(t, s) {
|
8
|
+
c(this, "_callerName");
|
9
|
+
c(this, "_context");
|
5
10
|
this.tagName = t, this.params = s;
|
6
11
|
}
|
7
12
|
get hash() {
|
8
|
-
return
|
13
|
+
return l(this.params.base || this.params);
|
9
14
|
}
|
10
15
|
get priority() {
|
11
16
|
var t;
|
@@ -23,34 +28,34 @@ class u {
|
|
23
28
|
}
|
24
29
|
get templateKeys() {
|
25
30
|
var t;
|
26
|
-
return (t = this._context) != null && t.config.templates ?
|
31
|
+
return (t = this._context) != null && t.config.templates ? g(this._context.config.templates) : [];
|
27
32
|
}
|
28
33
|
get css() {
|
29
34
|
var a;
|
30
|
-
const { base: t = {}, variants: s = {}, compoundVariants:
|
31
|
-
return
|
35
|
+
const { base: t = {}, variants: s = {}, compoundVariants: r = [] } = this.params, i = { ...t, variants: s, compoundVariants: r };
|
36
|
+
return u(i, `.${this.cssClassName}`, this.priority, (a = this._context) == null ? void 0 : a.config);
|
32
37
|
}
|
33
38
|
get props() {
|
34
39
|
const { element: t } = this.params, s = this.params.variants ? Object.keys(this.params.variants).map((a) => {
|
35
|
-
var
|
36
|
-
const
|
37
|
-
return
|
38
|
-
}) : void 0,
|
39
|
-
return
|
40
|
-
const
|
41
|
-
|
40
|
+
var n;
|
41
|
+
const o = (n = this.params.defaultVariants) == null ? void 0 : n[a];
|
42
|
+
return o !== void 0 ? `${a}=${String(o)}` : a;
|
43
|
+
}) : void 0, r = /* @__PURE__ */ new Set([]), i = /\{props\.([\w\d]+)\}/gi.exec(JSON.stringify(this.params.base));
|
44
|
+
return i && i.forEach((a, o, n) => {
|
45
|
+
const p = n.at(1);
|
46
|
+
p && r.add(p);
|
42
47
|
}), {
|
43
48
|
element: t,
|
44
49
|
variantKeys: s,
|
45
|
-
propValueKeys: [...
|
50
|
+
propValueKeys: [...r]
|
46
51
|
};
|
47
52
|
}
|
48
53
|
_withBuildContext(t) {
|
49
54
|
this._context = t;
|
50
|
-
const { name: s, config:
|
55
|
+
const { name: s, config: r } = t;
|
51
56
|
return this._callerName = s, this;
|
52
57
|
}
|
53
58
|
}
|
54
59
|
export {
|
55
|
-
|
60
|
+
d as StyleComponentGenerator
|
56
61
|
};
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="/* Empty */";exports.default=e;
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@salty-css/core",
|
3
|
-
"version": "0.0.1-alpha.
|
3
|
+
"version": "0.0.1-alpha.15",
|
4
4
|
"main": "./dist/index.js",
|
5
5
|
"module": "./dist/index.mjs",
|
6
6
|
"typings": "./dist/index.d.ts",
|
@@ -23,6 +23,8 @@
|
|
23
23
|
"name": "core"
|
24
24
|
},
|
25
25
|
"peerDependencies": {
|
26
|
+
"commander": ">=12.x",
|
27
|
+
"ejs": ">=3.x",
|
26
28
|
"esbuild": ">=0.21.x",
|
27
29
|
"react": ">=18.x || >=19.x",
|
28
30
|
"winston": ">=3.x"
|
@@ -52,5 +54,9 @@
|
|
52
54
|
"import": "./util/index.js",
|
53
55
|
"require": "./util/index.cjs"
|
54
56
|
}
|
57
|
+
},
|
58
|
+
"bin": {
|
59
|
+
"salty-css": "./bin/index.js",
|
60
|
+
"salty-css-cjs": "./bin/index.cjs"
|
55
61
|
}
|
56
62
|
}
|
@@ -1,22 +1,23 @@
|
|
1
|
-
import {
|
2
|
-
const N = (
|
3
|
-
if (typeof
|
4
|
-
if (!r) return { result:
|
1
|
+
import { d as O } from "./dash-case-DMQMcCO6.js";
|
2
|
+
const N = (t, r) => {
|
3
|
+
if (typeof t != "string") return { result: t };
|
4
|
+
if (!r) return { result: t };
|
5
5
|
const e = [];
|
6
6
|
return Object.values(r).forEach((n) => {
|
7
7
|
const { pattern: o, transform: c } = n;
|
8
|
-
|
8
|
+
t = t.replace(o, (h) => {
|
9
9
|
const { value: i, css: m } = c(h);
|
10
10
|
return m && e.push(m), i;
|
11
11
|
});
|
12
|
-
}), { result:
|
13
|
-
}, P = (
|
14
|
-
|
12
|
+
}), { result: t, additionalCss: e };
|
13
|
+
}, P = (t) => typeof t != "string" ? { result: t } : /\{[^{}]+\}/g.test(t) ? { result: t.replace(/\{([^{}]+)\}/g, (...n) => `var(--${O(n[1].replaceAll(".", "-"))})`) } : { result: t }, d = (t, r, e, n) => {
|
14
|
+
if (!t) return "";
|
15
|
+
const o = [], c = Object.entries(t).reduce((i, [m, s]) => {
|
15
16
|
const p = m.trim();
|
16
|
-
if (typeof
|
17
|
-
if (!
|
17
|
+
if (typeof s == "function" && (s = s()), typeof s == "object") {
|
18
|
+
if (!s) return i;
|
18
19
|
if (p === "variants")
|
19
|
-
return Object.entries(
|
20
|
+
return Object.entries(s).forEach(([u, f]) => {
|
20
21
|
f && Object.entries(f).forEach(([b, j]) => {
|
21
22
|
if (!j) return;
|
22
23
|
const l = `${r}.${u}-${b}`, y = d(j, l, e);
|
@@ -26,39 +27,39 @@ const N = (s, r) => {
|
|
26
27
|
if (p === "defaultVariants")
|
27
28
|
return i;
|
28
29
|
if (p === "compoundVariants")
|
29
|
-
return
|
30
|
+
return s.forEach((u) => {
|
30
31
|
const { css: f, ...b } = u, j = Object.entries(b).reduce((y, [V, W]) => `${y}.${V}-${W}`, r), l = d(f, j, e);
|
31
32
|
o.push(l);
|
32
33
|
}), i;
|
33
34
|
if (p.startsWith("@")) {
|
34
|
-
const u = d(
|
35
|
+
const u = d(s, r, e), f = `${p} {
|
35
36
|
${u.replace(`
|
36
37
|
`, `
|
37
38
|
`)}
|
38
39
|
}`;
|
39
40
|
return o.push(f), i;
|
40
41
|
}
|
41
|
-
const $ = m.includes("&") ? p.replace("&", r) : p.startsWith(":") ? `${r}${p}` : `${r} ${p}`, a = d(
|
42
|
+
const $ = m.includes("&") ? p.replace("&", r) : p.startsWith(":") ? `${r}${p}` : `${r} ${p}`, a = d(s, $, e);
|
42
43
|
return o.push(a), i;
|
43
44
|
}
|
44
45
|
if (n != null && n.templates && n.templates[p]) {
|
45
|
-
const a =
|
46
|
+
const a = s.split(".").reduce((f, b) => f[b], n.templates[p]), u = d(a, "");
|
46
47
|
return `${i}${u}`;
|
47
48
|
}
|
48
49
|
const g = p.startsWith("-") ? p : O(p), E = ($, a = ";") => i = `${i}${$}${a}`, S = ($) => E(`${g}:${$}`);
|
49
|
-
if (typeof
|
50
|
-
if (typeof
|
51
|
-
if ("toString" in
|
50
|
+
if (typeof s == "number") return S(s);
|
51
|
+
if (typeof s != "string")
|
52
|
+
if ("toString" in s) s = s.toString();
|
52
53
|
else return i;
|
53
54
|
const { modifiers: k } = n || {}, T = function* () {
|
54
|
-
yield P(
|
55
|
+
yield P(s), yield N(s, k);
|
55
56
|
}();
|
56
57
|
for (const { result: $, additionalCss: a = [] } of T)
|
57
|
-
|
58
|
+
s = $, a.forEach((u) => {
|
58
59
|
const f = d(u, "");
|
59
60
|
E(f, "");
|
60
61
|
});
|
61
|
-
return S(
|
62
|
+
return S(s);
|
62
63
|
}, "");
|
63
64
|
if (!c) return o.join(`
|
64
65
|
`);
|
@@ -66,9 +67,10 @@ const N = (s, r) => {
|
|
66
67
|
let h = "";
|
67
68
|
return e !== void 0 ? h = `@layer l${e} { ${r} { ${c} } }` : h = `${r} { ${c} }`, [h, ...o].join(`
|
68
69
|
`);
|
69
|
-
}, _ = (
|
70
|
+
}, _ = (t, r = []) => {
|
71
|
+
if (!t) return "";
|
70
72
|
const e = [], n = {};
|
71
|
-
if (Object.entries(
|
73
|
+
if (Object.entries(t).forEach(([o, c]) => {
|
72
74
|
if (typeof c == "object") {
|
73
75
|
if (!c) return;
|
74
76
|
const h = o.trim(), i = _(c, [...r, h]);
|
@@ -81,7 +83,7 @@ const N = (s, r) => {
|
|
81
83
|
}
|
82
84
|
return e.join(`
|
83
85
|
`);
|
84
|
-
}, A = (
|
86
|
+
}, A = (t) => Object.keys(t);
|
85
87
|
export {
|
86
88
|
_ as a,
|
87
89
|
P as b,
|
@@ -0,0 +1,8 @@
|
|
1
|
+
"use strict";const O=require("./dash-case-DKzpenwY.cjs"),N=(t,e)=>{if(typeof t!="string")return{result:t};if(!e)return{result:t};const r=[];return Object.values(e).forEach(n=>{const{pattern:o,transform:c}=n;t=t.replace(o,a=>{const{value:i,css:l}=c(a);return l&&r.push(l),i})}),{result:t,additionalCss:r}},k=t=>typeof t!="string"?{result:t}:/\{[^{}]+\}/g.test(t)?{result:t.replace(/\{([^{}]+)\}/g,(...n)=>`var(--${O.dashCase(n[1].replaceAll(".","-"))})`)}:{result:t},h=(t,e,r,n)=>{if(!t)return"";const o=[],c=Object.entries(t).reduce((i,[l,s])=>{const p=l.trim();if(typeof s=="function"&&(s=s()),typeof s=="object"){if(!s)return i;if(p==="variants")return Object.entries(s).forEach(([u,f])=>{f&&Object.entries(f).forEach(([m,j])=>{if(!j)return;const y=`${e}.${u}-${m}`,b=h(j,y,r);o.push(b)})}),i;if(p==="defaultVariants")return i;if(p==="compoundVariants")return s.forEach(u=>{const{css:f,...m}=u,j=Object.entries(m).reduce((b,[q,K])=>`${b}.${q}-${K}`,e),y=h(f,j,r);o.push(y)}),i;if(p.startsWith("@")){const u=h(s,e,r),f=`${p} {
|
2
|
+
${u.replace(`
|
3
|
+
`,`
|
4
|
+
`)}
|
5
|
+
}`;return o.push(f),i}const $=l.includes("&")?p.replace("&",e):p.startsWith(":")?`${e}${p}`:`${e} ${p}`,d=h(s,$,r);return o.push(d),i}if(n!=null&&n.templates&&n.templates[p]){const d=s.split(".").reduce((f,m)=>f[m],n.templates[p]),u=h(d,"");return`${i}${u}`}const V=p.startsWith("-")?p:O.dashCase(p),T=($,d=";")=>i=`${i}${$}${d}`,S=$=>T(`${V}:${$}`);if(typeof s=="number")return S(s);if(typeof s!="string")if("toString"in s)s=s.toString();else return i;const{modifiers:g}=n||{},W=function*(){yield k(s),yield N(s,g)}();for(const{result:$,additionalCss:d=[]}of W)s=$,d.forEach(u=>{const f=h(u,"");T(f,"")});return S(s)},"");if(!c)return o.join(`
|
6
|
+
`);if(!e)return c;let a="";return r!==void 0?a=`@layer l${r} { ${e} { ${c} } }`:a=`${e} { ${c} }`,[a,...o].join(`
|
7
|
+
`)},E=(t,e=[])=>{if(!t)return"";const r=[],n={};if(Object.entries(t).forEach(([o,c])=>{if(typeof c=="object"){if(!c)return;const a=o.trim(),i=E(c,[...e,a]);r.push(i)}else n[o]=c}),Object.keys(n).length){const o=e.map(O.dashCase).join("-"),c=h(n,`.${o}`);r.push(c)}return r.join(`
|
8
|
+
`)},P=t=>Object.keys(t);exports.getTemplateKeys=P;exports.parseStyles=h;exports.parseTemplates=E;exports.parseValueTokens=k;
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";function r(e){return e?typeof e!="string"?r(String(e)):e.replace(/\s/g,"-").replace(/[-_]([a-z0-9])/g,a=>a[1].toUpperCase()).replace(/^[a-z]/,a=>a.toUpperCase()):""}exports.pascalCase=r;
|
@@ -0,0 +1,8 @@
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=`import { styled } from "@salty-css/react/styled";
|
2
|
+
|
3
|
+
export const <%- name %> = styled('<%- tag %>', {
|
4
|
+
<% if(className) { %>className: '<%- className %>',<% } %>
|
5
|
+
base: {
|
6
|
+
// Add your styles here
|
7
|
+
}
|
8
|
+
})`;exports.default=e;
|
@@ -0,0 +1 @@
|
|
1
|
+
export declare function camelCase(str: PropertyKey): string;
|
package/util/index.cjs
CHANGED
@@ -1 +1 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../dash-case-DKzpenwY.cjs"),t=require("../pascal-case-iWoaJWwT.cjs");function s(e){return e?typeof e!="string"?s(String(e)):e.replace(/\s/g,"-").replace(/-([a-z])/g,r=>r[1].toUpperCase()):""}exports.dashCase=a.dashCase;exports.toHash=a.toHash;exports.pascalCase=t.pascalCase;exports.camelCase=s;
|
package/util/index.d.ts
CHANGED
package/util/index.js
CHANGED
@@ -1,19 +1,11 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
return
|
5
|
-
}, i = (e, r) => {
|
6
|
-
let t = r.length;
|
7
|
-
for (; t; ) e = e * 33 ^ r.charCodeAt(--t);
|
8
|
-
return e;
|
9
|
-
}, s = (e, r = 3) => {
|
10
|
-
const t = i(5381, JSON.stringify(e)) >>> 0;
|
11
|
-
return o(t, r);
|
12
|
-
};
|
13
|
-
function c(e) {
|
14
|
-
return e ? typeof e != "string" ? String(e) : e.replace(/\s/g, "-").replace(/[A-Z](?:(?=[^A-Z])|[A-Z]*(?=[A-Z][^A-Z]|$))/g, (r, t) => (t > 0 ? "-" : "") + r.toLowerCase()) : "";
|
1
|
+
import { d as o, t as s } from "../dash-case-DMQMcCO6.js";
|
2
|
+
import { p as f } from "../pascal-case-BQpR5PdN.js";
|
3
|
+
function r(e) {
|
4
|
+
return e ? typeof e != "string" ? r(String(e)) : e.replace(/\s/g, "-").replace(/-([a-z])/g, (a) => a[1].toUpperCase()) : "";
|
15
5
|
}
|
16
6
|
export {
|
17
|
-
|
7
|
+
r as camelCase,
|
8
|
+
o as dashCase,
|
9
|
+
f as pascalCase,
|
18
10
|
s as toHash
|
19
11
|
};
|
@@ -0,0 +1 @@
|
|
1
|
+
export declare function pascalCase(str: PropertyKey): string;
|
@@ -1,8 +0,0 @@
|
|
1
|
-
"use strict";const O=require("./util/index.cjs"),K=(s,e)=>{if(typeof s!="string")return{result:s};if(!e)return{result:s};const r=[];return Object.values(e).forEach(n=>{const{pattern:o,transform:c}=n;s=s.replace(o,a=>{const{value:i,css:l}=c(a);return l&&r.push(l),i})}),{result:s,additionalCss:r}},k=s=>typeof s!="string"?{result:s}:/\{[^{}]+\}/g.test(s)?{result:s.replace(/\{([^{}]+)\}/g,(...n)=>`var(--${O.dashCase(n[1].replaceAll(".","-"))})`)}:{result:s},h=(s,e,r,n)=>{const o=[],c=Object.entries(s).reduce((i,[l,t])=>{const p=l.trim();if(typeof t=="function"&&(t=t()),typeof t=="object"){if(!t)return i;if(p==="variants")return Object.entries(t).forEach(([u,f])=>{f&&Object.entries(f).forEach(([m,j])=>{if(!j)return;const y=`${e}.${u}-${m}`,b=h(j,y,r);o.push(b)})}),i;if(p==="defaultVariants")return i;if(p==="compoundVariants")return t.forEach(u=>{const{css:f,...m}=u,j=Object.entries(m).reduce((b,[_,q])=>`${b}.${_}-${q}`,e),y=h(f,j,r);o.push(y)}),i;if(p.startsWith("@")){const u=h(t,e,r),f=`${p} {
|
2
|
-
${u.replace(`
|
3
|
-
`,`
|
4
|
-
`)}
|
5
|
-
}`;return o.push(f),i}const $=l.includes("&")?p.replace("&",e):p.startsWith(":")?`${e}${p}`:`${e} ${p}`,d=h(t,$,r);return o.push(d),i}if(n!=null&&n.templates&&n.templates[p]){const d=t.split(".").reduce((f,m)=>f[m],n.templates[p]),u=h(d,"");return`${i}${u}`}const V=p.startsWith("-")?p:O.dashCase(p),T=($,d=";")=>i=`${i}${$}${d}`,S=$=>T(`${V}:${$}`);if(typeof t=="number")return S(t);if(typeof t!="string")if("toString"in t)t=t.toString();else return i;const{modifiers:g}=n||{},W=function*(){yield k(t),yield K(t,g)}();for(const{result:$,additionalCss:d=[]}of W)t=$,d.forEach(u=>{const f=h(u,"");T(f,"")});return S(t)},"");if(!c)return o.join(`
|
6
|
-
`);if(!e)return c;let a="";return r!==void 0?a=`@layer l${r} { ${e} { ${c} } }`:a=`${e} { ${c} }`,[a,...o].join(`
|
7
|
-
`)},E=(s,e=[])=>{const r=[],n={};if(Object.entries(s).forEach(([o,c])=>{if(typeof c=="object"){if(!c)return;const a=o.trim(),i=E(c,[...e,a]);r.push(i)}else n[o]=c}),Object.keys(n).length){const o=e.map(O.dashCase).join("-"),c=h(n,`.${o}`);r.push(c)}return r.join(`
|
8
|
-
`)},N=s=>Object.keys(s);exports.getTemplateKeys=N;exports.parseStyles=h;exports.parseTemplates=E;exports.parseValueTokens=k;
|