@kbach/react 1.0.0-beta.26 → 1.0.0-beta.27

package/AGENTS.md

@@ -8,6 +8,16 @@ overview, `kbach.config.js` reference, the color palette, and how the
 underlying engine is built, see the repo root's
 [AGENTS.md](https://github.com/semsakadanupol/kbach/blob/main/AGENTS.md).
 
+> **Before writing a single class, know this — Tailwind familiarity
+> actively misleads here:** color shades are `1`–`12` (lightest→darkest),
+> not Tailwind's `50`–`950`. `bg-blue-500` is not a Kbach class — it
+> silently resolves to nothing (an "Unknown class ... Typo?" dev warning,
+> not a visible color, and ONLY if the string was actually reachable by
+> the static scanner — see §2). The real class is `bg-blue-6`. Full
+> palette: root AGENTS.md §7. Everything else in real Tailwind's utility
+> vocabulary works here essentially as-is — unlike `@kbach/react-native`,
+> web has the full modifier set with no native-platform gaps.
+
 ---
 
 ## 1. Install + wire up the build
@@ -84,6 +94,12 @@ write `className="..."` normally.
 - **`@kbach/react/jsx-runtime`** — a `jsxImportSource` override that
   intercepts *every* element's `className` at runtime instead of relying on
   the static scan. Also needs `await initKbach()`.
+- **No-build CDN usage is a SEPARATE package, `@kbach/browser`**
+  (packages/browser), which bundles this package's runtime modules (`kb`,
+  `theme`, `config`, `colorVariables`, `darkModeStore`, `wasmLoader`)
+  straight from `src/`. Renaming or changing those modules' exports (or
+  `wasmLoader.ts`'s internal `initKbachFrom`) breaks that package, and its
+  own tests catch it. See [packages/browser/AGENTS.md](../browser/AGENTS.md).
 
 ## 4. Dark mode
 

package/README.md

@@ -1,7 +1,8 @@
 # @kbach/react
 
 A utility-first styling engine for React, powered by a Rust/WASM core.
-Tailwind CSS v4 feature parity, plus Kbach's own color palette.
+Uses Tailwind CSS-compatible utility class names, plus Kbach's own color
+palette.
 
 > Beta — API may still change before 1.0.0.
 
@@ -11,6 +12,12 @@ Tailwind CSS v4 feature parity, plus Kbach's own color palette.
 npm install @kbach/react
 ```
 
+Or skip straight to a working setup: `npx @kbach/cli init` detects Vite
+or Next.js, installs this package, and patches `vite.config.ts` /
+`postcss.config.js` for you — see [`@kbach/cli`](https://www.npmjs.com/package/@kbach/cli).
+The steps below are what it automates, and still the fallback it prints
+if your config file's shape is too unusual for it to edit safely.
+
 ## Quick start
 
 ```ts
@@ -72,6 +79,13 @@ runtime: the dynamic [`kb()`](#dynamic-classes) function, and the optional
 static build). If you use either, `await initKbach()` once before your
 first render, same as before.
 
+## Use from a CDN (no build step)
+
+For a plain HTML page with no npm, bundler or React, use
+[`@kbach/browser`](https://www.npmjs.com/package/@kbach/browser) instead:
+one `<script src="https://cdn.jsdelivr.net/npm/@kbach/browser"></script>`
+tag and the same class names just work.
+
 ## React Router
 
 React Router is a client-side routing library with no build-tool coupling
@@ -308,3 +322,8 @@ correct across theme changes with zero re-render.
 ## License
 
 MIT
+
+Tailwind CSS is a trademark of Tailwind Labs Inc. Kbach is an independent
+project and is not affiliated with, sponsored by, or endorsed by Tailwind Labs.
+See [THIRD_PARTY_NOTICES.md](THIRD_PARTY_NOTICES.md) for the Tailwind CSS
+license notice.

package/THIRD_PARTY_NOTICES.md

@@ -0,0 +1,41 @@
+<!-- GENERATED from the repo root THIRD_PARTY_NOTICES.md by packages/core-engine/scripts/generate-notices.mjs. Edit the root file, then regenerate. -->
+
+# Third-party notices
+
+Kbach is MIT-licensed (see `LICENSE`). It also contains material from the
+project below, used under that project's license.
+
+## Tailwind CSS
+
+Kbach uses Tailwind CSS-compatible utility class names, and some of its
+default theme values (for example the spacing formula and the shadow, radius,
+blur, and line-height scales) are derived from Tailwind CSS.
+
+Tailwind CSS is a trademark of Tailwind Labs Inc. Kbach is an independent
+project and is not affiliated with, sponsored by, or endorsed by Tailwind Labs.
+
+Source: https://github.com/tailwindlabs/tailwindcss
+
+```
+MIT License
+
+Copyright (c) Tailwind Labs, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```

package/dist/{chunk-BJEOK2VK.mjs → chunk-DJKDEDPE.mjs}

@@ -9,8 +9,11 @@ import init, { generate_css as wasmGenerateCss } from "@kbach/core-engine";
 var readyPromise = null;
 var ready = false;
 function initKbach() {
+  return initKbachFrom(void 0);
+}
+function initKbachFrom(wasmSource) {
   if (!readyPromise) {
-    readyPromise = init().then(() => {
+    readyPromise = (wasmSource === void 0 ? init() : init({ module_or_path: wasmSource })).then(() => {
       ready = true;
     });
   }

package/dist/{chunk-5EXGGZMA.mjs → chunk-UP7MWEU5.mjs}

@@ -1,6 +1,6 @@
 import {
   kb
-} from "./chunk-BJEOK2VK.mjs";
+} from "./chunk-DJKDEDPE.mjs";
 
 // src/jsx-runtime.tsx
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";

package/dist/index.js

@@ -58,8 +58,11 @@ var import_core_engine = __toESM(require("@kbach/core-engine"));
 var readyPromise = null;
 var ready = false;
 function initKbach() {
+  return initKbachFrom(void 0);
+}
+function initKbachFrom(wasmSource) {
   if (!readyPromise) {
-    readyPromise = (0, import_core_engine.default)().then(() => {
+    readyPromise = (wasmSource === void 0 ? (0, import_core_engine.default)() : (0, import_core_engine.default)({ module_or_path: wasmSource })).then(() => {
       ready = true;
     });
   }

package/dist/index.mjs

@@ -4,7 +4,7 @@ import {
   isKbachReady,
   isRuntimeCSSDisabled,
   kb
-} from "./chunk-BJEOK2VK.mjs";
+} from "./chunk-DJKDEDPE.mjs";
 import {
   applyKbachConfig,
   ensureColorVariablesInjected,

package/dist/jsx-dev-runtime.mjs

@@ -2,8 +2,8 @@ import {
   Fragment,
   jsx,
   jsxs
-} from "./chunk-5EXGGZMA.mjs";
-import "./chunk-BJEOK2VK.mjs";
+} from "./chunk-UP7MWEU5.mjs";
+import "./chunk-DJKDEDPE.mjs";
 import "./chunk-OVKVZA7B.mjs";
 
 // src/jsx-dev-runtime.tsx

package/dist/jsx-runtime.mjs

@@ -2,8 +2,8 @@ import {
   Fragment,
   jsx,
   jsxs
-} from "./chunk-5EXGGZMA.mjs";
-import "./chunk-BJEOK2VK.mjs";
+} from "./chunk-UP7MWEU5.mjs";
+import "./chunk-DJKDEDPE.mjs";
 import "./chunk-OVKVZA7B.mjs";
 export {
   Fragment,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@kbach/react",
-  "version": "1.0.0-beta.26",
-  "description": "A utility-first styling engine for React, powered by a real Rust/WASM core — Tailwind CSS v4 feature parity with Kbach's own color palette.",
+  "version": "1.0.0-beta.27",
+  "description": "A utility-first styling engine for React, powered by a Rust/WASM core: Tailwind CSS-compatible utility class names with Kbach's own color palette.",
   "keywords": [
     "css",
     "react",
@@ -26,7 +26,8 @@
   },
   "files": [
     "dist",
-    "AGENTS.md"
+    "AGENTS.md",
+    "THIRD_PARTY_NOTICES.md"
   ],
   "source": "./src/index.ts",
   "main": "./dist/index.js",
@@ -73,7 +74,7 @@
     "generate:colors": "node ../core-engine/scripts/generate-palette.mjs src/generatedPalette.ts"
   },
   "dependencies": {
-    "@kbach/core-engine": "1.0.0-beta.14"
+    "@kbach/core-engine": "1.0.0-beta.16"
   },
   "devDependencies": {
     "@types/react": "^19.2.0",