@kbach/react 0.5.31 → 0.5.33
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/dist/vite-plugin.js +17 -46
- package/dist/vite-plugin.mjs +17 -46
- package/package.json +1 -1
package/dist/vite-plugin.js
CHANGED
|
@@ -3384,9 +3384,8 @@ function formatKbachCSS(tokenCSS, theme) {
|
|
|
3384
3384
|
const allRaw = [...tokenCSS.values()].filter(Boolean).join("\n");
|
|
3385
3385
|
const colorVars = buildColorVarMap(theme, allRaw);
|
|
3386
3386
|
function applyVars(css) {
|
|
3387
|
-
for (const [val, varName] of colorVars)
|
|
3387
|
+
for (const [val, varName] of colorVars)
|
|
3388
3388
|
css = css.split(val).join(`var(${varName})`);
|
|
3389
|
-
}
|
|
3390
3389
|
return css;
|
|
3391
3390
|
}
|
|
3392
3391
|
const groups = new Map(GROUP_ORDER.map((g) => [g, []]));
|
|
@@ -3399,17 +3398,13 @@ function formatKbachCSS(tokenCSS, theme) {
|
|
|
3399
3398
|
const out = ["/* Generated by Kbach \u2014 do not edit */"];
|
|
3400
3399
|
if (colorVars.size > 0) {
|
|
3401
3400
|
out.push("\n:root {");
|
|
3402
|
-
for (const [val, varName] of colorVars) {
|
|
3403
|
-
out.push(` ${varName}: ${val};`);
|
|
3404
|
-
}
|
|
3401
|
+
for (const [val, varName] of colorVars) out.push(` ${varName}: ${val};`);
|
|
3405
3402
|
out.push("}");
|
|
3406
3403
|
}
|
|
3407
3404
|
const globalCSS = buildThemeGlobal(theme);
|
|
3408
|
-
if (globalCSS)
|
|
3409
|
-
out.push(`
|
|
3405
|
+
if (globalCSS) out.push(`
|
|
3410
3406
|
/* Global */
|
|
3411
3407
|
${globalCSS}`);
|
|
3412
|
-
}
|
|
3413
3408
|
for (const label of GROUP_ORDER) {
|
|
3414
3409
|
const items = groups.get(label) ?? [];
|
|
3415
3410
|
if (!items.length) continue;
|
|
@@ -3467,7 +3462,7 @@ function scanDir(dir, onFile) {
|
|
|
3467
3462
|
try {
|
|
3468
3463
|
const st = (0, import_fs.statSync)(full);
|
|
3469
3464
|
if (st.isDirectory()) scanDir(full, onFile);
|
|
3470
|
-
else if (/\.(tsx?|jsx?)$/.test(entry)) onFile((0, import_fs.readFileSync)(full, "utf-8")
|
|
3465
|
+
else if (/\.(tsx?|jsx?)$/.test(entry)) onFile((0, import_fs.readFileSync)(full, "utf-8"));
|
|
3471
3466
|
} catch {
|
|
3472
3467
|
}
|
|
3473
3468
|
}
|
|
@@ -3487,37 +3482,20 @@ function extractClassStrings(code) {
|
|
|
3487
3482
|
function kbach(userConfig) {
|
|
3488
3483
|
const cfg = buildConfig(userConfig ?? {});
|
|
3489
3484
|
const screens = toNumericScreens(cfg.theme.screens ?? {});
|
|
3490
|
-
const fileTokens = /* @__PURE__ */ new Map();
|
|
3491
|
-
const tokenCSS = /* @__PURE__ */ new Map();
|
|
3492
3485
|
let root = process.cwd();
|
|
3493
3486
|
let mainCSSFile = null;
|
|
3494
|
-
function
|
|
3495
|
-
const
|
|
3496
|
-
for (const
|
|
3497
|
-
|
|
3498
|
-
|
|
3499
|
-
|
|
3500
|
-
|
|
3501
|
-
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3505
|
-
let changed = false;
|
|
3506
|
-
for (const token of tokenCSS.keys()) {
|
|
3507
|
-
if (!live.has(token)) {
|
|
3508
|
-
tokenCSS.delete(token);
|
|
3509
|
-
changed = true;
|
|
3510
|
-
}
|
|
3487
|
+
function generateCSS() {
|
|
3488
|
+
const tokenCSS = /* @__PURE__ */ new Map();
|
|
3489
|
+
for (const dir of ["src", "app", "pages", "components", "views", "layouts"]) {
|
|
3490
|
+
scanDir((0, import_path.join)(root, dir), (code) => {
|
|
3491
|
+
for (const cls of extractClassStrings(code))
|
|
3492
|
+
for (const token of cls.split(/\s+/).filter(Boolean))
|
|
3493
|
+
if (!tokenCSS.has(token)) {
|
|
3494
|
+
const css = generateClassCSS(token, cfg.theme, cfg.darkMode, screens);
|
|
3495
|
+
tokenCSS.set(token, css);
|
|
3496
|
+
}
|
|
3497
|
+
});
|
|
3511
3498
|
}
|
|
3512
|
-
for (const token of live) {
|
|
3513
|
-
if (!tokenCSS.has(token)) {
|
|
3514
|
-
tokenCSS.set(token, generateClassCSS(token, cfg.theme, cfg.darkMode, screens));
|
|
3515
|
-
changed = true;
|
|
3516
|
-
}
|
|
3517
|
-
}
|
|
3518
|
-
return changed;
|
|
3519
|
-
}
|
|
3520
|
-
function getFormattedCSS() {
|
|
3521
3499
|
return formatKbachCSS(tokenCSS, cfg.theme);
|
|
3522
3500
|
}
|
|
3523
3501
|
return {
|
|
@@ -3527,19 +3505,12 @@ function kbach(userConfig) {
|
|
|
3527
3505
|
root = resolved.root;
|
|
3528
3506
|
},
|
|
3529
3507
|
buildStart() {
|
|
3530
|
-
for (const dir of ["src", "app", "pages", "components", "views", "layouts"])
|
|
3531
|
-
scanDir((0, import_path.join)(root, dir), (code, filePath) => fileTokens.set(filePath, extractTokensFromCode(code)));
|
|
3532
|
-
rebuildTokenCSS();
|
|
3533
3508
|
mainCSSFile = findMainCSSFile(root);
|
|
3534
|
-
if (mainCSSFile) writeKbachToFile(mainCSSFile,
|
|
3509
|
+
if (mainCSSFile) writeKbachToFile(mainCSSFile, generateCSS());
|
|
3535
3510
|
},
|
|
3536
3511
|
handleHotUpdate({ file }) {
|
|
3537
3512
|
if (file.includes("node_modules") || !/\.(tsx?|jsx?)$/.test(file)) return;
|
|
3538
|
-
|
|
3539
|
-
fileTokens.set(file, extractTokensFromCode((0, import_fs.readFileSync)(file, "utf-8")));
|
|
3540
|
-
if (rebuildTokenCSS() && mainCSSFile) writeKbachToFile(mainCSSFile, getFormattedCSS());
|
|
3541
|
-
} catch {
|
|
3542
|
-
}
|
|
3513
|
+
if (mainCSSFile) writeKbachToFile(mainCSSFile, generateCSS());
|
|
3543
3514
|
}
|
|
3544
3515
|
};
|
|
3545
3516
|
}
|
package/dist/vite-plugin.mjs
CHANGED
|
@@ -43,9 +43,8 @@ function formatKbachCSS(tokenCSS, theme) {
|
|
|
43
43
|
const allRaw = [...tokenCSS.values()].filter(Boolean).join("\n");
|
|
44
44
|
const colorVars = buildColorVarMap(theme, allRaw);
|
|
45
45
|
function applyVars(css) {
|
|
46
|
-
for (const [val, varName] of colorVars)
|
|
46
|
+
for (const [val, varName] of colorVars)
|
|
47
47
|
css = css.split(val).join(`var(${varName})`);
|
|
48
|
-
}
|
|
49
48
|
return css;
|
|
50
49
|
}
|
|
51
50
|
const groups = new Map(GROUP_ORDER.map((g) => [g, []]));
|
|
@@ -58,17 +57,13 @@ function formatKbachCSS(tokenCSS, theme) {
|
|
|
58
57
|
const out = ["/* Generated by Kbach \u2014 do not edit */"];
|
|
59
58
|
if (colorVars.size > 0) {
|
|
60
59
|
out.push("\n:root {");
|
|
61
|
-
for (const [val, varName] of colorVars) {
|
|
62
|
-
out.push(` ${varName}: ${val};`);
|
|
63
|
-
}
|
|
60
|
+
for (const [val, varName] of colorVars) out.push(` ${varName}: ${val};`);
|
|
64
61
|
out.push("}");
|
|
65
62
|
}
|
|
66
63
|
const globalCSS = buildThemeGlobal(theme);
|
|
67
|
-
if (globalCSS)
|
|
68
|
-
out.push(`
|
|
64
|
+
if (globalCSS) out.push(`
|
|
69
65
|
/* Global */
|
|
70
66
|
${globalCSS}`);
|
|
71
|
-
}
|
|
72
67
|
for (const label of GROUP_ORDER) {
|
|
73
68
|
const items = groups.get(label) ?? [];
|
|
74
69
|
if (!items.length) continue;
|
|
@@ -126,7 +121,7 @@ function scanDir(dir, onFile) {
|
|
|
126
121
|
try {
|
|
127
122
|
const st = statSync(full);
|
|
128
123
|
if (st.isDirectory()) scanDir(full, onFile);
|
|
129
|
-
else if (/\.(tsx?|jsx?)$/.test(entry)) onFile(readFileSync(full, "utf-8")
|
|
124
|
+
else if (/\.(tsx?|jsx?)$/.test(entry)) onFile(readFileSync(full, "utf-8"));
|
|
130
125
|
} catch {
|
|
131
126
|
}
|
|
132
127
|
}
|
|
@@ -146,37 +141,20 @@ function extractClassStrings(code) {
|
|
|
146
141
|
function kbach(userConfig) {
|
|
147
142
|
const cfg = buildConfig(userConfig ?? {});
|
|
148
143
|
const screens = toNumericScreens(cfg.theme.screens ?? {});
|
|
149
|
-
const fileTokens = /* @__PURE__ */ new Map();
|
|
150
|
-
const tokenCSS = /* @__PURE__ */ new Map();
|
|
151
144
|
let root = process.cwd();
|
|
152
145
|
let mainCSSFile = null;
|
|
153
|
-
function
|
|
154
|
-
const
|
|
155
|
-
for (const
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
let changed = false;
|
|
165
|
-
for (const token of tokenCSS.keys()) {
|
|
166
|
-
if (!live.has(token)) {
|
|
167
|
-
tokenCSS.delete(token);
|
|
168
|
-
changed = true;
|
|
169
|
-
}
|
|
146
|
+
function generateCSS() {
|
|
147
|
+
const tokenCSS = /* @__PURE__ */ new Map();
|
|
148
|
+
for (const dir of ["src", "app", "pages", "components", "views", "layouts"]) {
|
|
149
|
+
scanDir(join(root, dir), (code) => {
|
|
150
|
+
for (const cls of extractClassStrings(code))
|
|
151
|
+
for (const token of cls.split(/\s+/).filter(Boolean))
|
|
152
|
+
if (!tokenCSS.has(token)) {
|
|
153
|
+
const css = generateClassCSS(token, cfg.theme, cfg.darkMode, screens);
|
|
154
|
+
tokenCSS.set(token, css);
|
|
155
|
+
}
|
|
156
|
+
});
|
|
170
157
|
}
|
|
171
|
-
for (const token of live) {
|
|
172
|
-
if (!tokenCSS.has(token)) {
|
|
173
|
-
tokenCSS.set(token, generateClassCSS(token, cfg.theme, cfg.darkMode, screens));
|
|
174
|
-
changed = true;
|
|
175
|
-
}
|
|
176
|
-
}
|
|
177
|
-
return changed;
|
|
178
|
-
}
|
|
179
|
-
function getFormattedCSS() {
|
|
180
158
|
return formatKbachCSS(tokenCSS, cfg.theme);
|
|
181
159
|
}
|
|
182
160
|
return {
|
|
@@ -186,19 +164,12 @@ function kbach(userConfig) {
|
|
|
186
164
|
root = resolved.root;
|
|
187
165
|
},
|
|
188
166
|
buildStart() {
|
|
189
|
-
for (const dir of ["src", "app", "pages", "components", "views", "layouts"])
|
|
190
|
-
scanDir(join(root, dir), (code, filePath) => fileTokens.set(filePath, extractTokensFromCode(code)));
|
|
191
|
-
rebuildTokenCSS();
|
|
192
167
|
mainCSSFile = findMainCSSFile(root);
|
|
193
|
-
if (mainCSSFile) writeKbachToFile(mainCSSFile,
|
|
168
|
+
if (mainCSSFile) writeKbachToFile(mainCSSFile, generateCSS());
|
|
194
169
|
},
|
|
195
170
|
handleHotUpdate({ file }) {
|
|
196
171
|
if (file.includes("node_modules") || !/\.(tsx?|jsx?)$/.test(file)) return;
|
|
197
|
-
|
|
198
|
-
fileTokens.set(file, extractTokensFromCode(readFileSync(file, "utf-8")));
|
|
199
|
-
if (rebuildTokenCSS() && mainCSSFile) writeKbachToFile(mainCSSFile, getFormattedCSS());
|
|
200
|
-
} catch {
|
|
201
|
-
}
|
|
172
|
+
if (mainCSSFile) writeKbachToFile(mainCSSFile, generateCSS());
|
|
202
173
|
}
|
|
203
174
|
};
|
|
204
175
|
}
|