@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.
@@ -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"), full);
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 extractTokensFromCode(code) {
3495
- const tokens = /* @__PURE__ */ new Set();
3496
- for (const cls of extractClassStrings(code))
3497
- for (const token of cls.split(/\s+/).filter(Boolean))
3498
- tokens.add(token);
3499
- return tokens;
3500
- }
3501
- function rebuildTokenCSS() {
3502
- const live = /* @__PURE__ */ new Set();
3503
- for (const tokens of fileTokens.values())
3504
- for (const t of tokens) live.add(t);
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, getFormattedCSS());
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
- try {
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
  }
@@ -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"), full);
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 extractTokensFromCode(code) {
154
- const tokens = /* @__PURE__ */ new Set();
155
- for (const cls of extractClassStrings(code))
156
- for (const token of cls.split(/\s+/).filter(Boolean))
157
- tokens.add(token);
158
- return tokens;
159
- }
160
- function rebuildTokenCSS() {
161
- const live = /* @__PURE__ */ new Set();
162
- for (const tokens of fileTokens.values())
163
- for (const t of tokens) live.add(t);
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, getFormattedCSS());
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
- try {
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
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kbach/react",
3
- "version": "0.5.31",
3
+ "version": "0.5.33",
4
4
  "description": "React / React Native components and hooks for the Kbach framework",
5
5
  "source": "./src/index.ts",
6
6
  "main": "./dist/index.js",