@praxisjs/vite-plugin 0.1.0 → 1.0.0

package/dist/css.js

@@ -0,0 +1,172 @@
+import { existsSync, readFileSync, readdirSync } from "node:fs";
+import path from "node:path";
+import vm from "node:vm";
+import { build as esbuildBuild } from "esbuild";
+import { extractionModule } from "@praxisjs/css/extract";
+// ─── Constants ────────────────────────────────────────────────────────────────
+// The .css extension is required so Vite recognises this as a CSS asset and
+// emits it as a separate file rather than inlining it into a JS module.
+const VIRTUAL_ID = "virtual:praxisjs/styles.css";
+const RESOLVED_ID = "\0virtual:praxisjs/styles.css";
+const HAS_CSS_CONTENT = /extends\s+(Reactive)?Stylesheet\b|\bStyled\s*\(|\bkeyframes\s*\(|\bglobalStyle\s*\(|\bThemed\s*\(/;
+const SKIP_DIRS = new Set(["node_modules", "dist", ".git", ".cache", "out"]);
+// ─── File scanner ─────────────────────────────────────────────────────────────
+function findSourceFiles(dir) {
+    const files = [];
+    let entries;
+    try {
+        entries = readdirSync(dir, { withFileTypes: true, encoding: "utf8" });
+    }
+    catch {
+        return files;
+    }
+    for (const entry of entries) {
+        const name = entry.name;
+        if (name.startsWith(".") || SKIP_DIRS.has(name))
+            continue;
+        const full = path.join(dir, name);
+        if (entry.isDirectory())
+            files.push(...findSourceFiles(full));
+        else if (name.endsWith(".ts") || name.endsWith(".tsx"))
+            files.push(full);
+    }
+    return files;
+}
+function findTsConfig(root) {
+    const p = path.join(root, "tsconfig.json");
+    return existsSync(p) ? p : undefined;
+}
+// ─── Noop stub for @praxisjs/* packages (except @praxisjs/css) ───────────────
+// Regular function (not arrow) so it can be used as a base class via `extends`.
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function noop(..._args) {
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    return () => { };
+}
+function makePraxisStub() {
+    return new Proxy({}, { get: () => noop });
+}
+// ─── CSS extractor ────────────────────────────────────────────────────────────
+async function extractStaticCSS(root) {
+    const candidates = findSourceFiles(root)
+        .filter((f) => HAS_CSS_CONTENT.test(readFileSync(f, "utf-8")));
+    if (candidates.length === 0)
+        return "";
+    // Each candidate is wrapped in try/catch so one bad file doesn't abort extraction.
+    const entry = candidates
+        .map((f) => `try { require(${JSON.stringify(f)}); } catch {}`)
+        .join("\n");
+    let bundleCode;
+    try {
+        const result = await esbuildBuild({
+            stdin: { contents: entry, loader: "js", resolveDir: root },
+            bundle: true,
+            write: false,
+            format: "cjs",
+            platform: "node",
+            target: "node20",
+            tsconfig: findTsConfig(root),
+            plugins: [
+                {
+                    name: "praxisjs-css-extract",
+                    setup(build) {
+                        // @praxisjs/css is handled by the vm sandbox (extractionModule).
+                        // Keep all @praxisjs/* external so esbuild emits plain require()
+                        // calls — no __toESM wrapping that would break Proxy property access.
+                        build.onResolve({ filter: /^@praxisjs\// }, () => ({ external: true }));
+                        build.onResolve({ filter: /^[^./]/ }, () => ({ external: true }));
+                    },
+                },
+            ],
+            logLevel: "silent",
+        });
+        bundleCode = result.outputFiles[0].text;
+    }
+    catch {
+        return "";
+    }
+    const collected = [];
+    const cssMod = extractionModule((css, prepend) => {
+        if (prepend)
+            collected.unshift(css);
+        else
+            collected.push(css);
+    });
+    const praxisStub = makePraxisStub();
+    const sandbox = {
+        require: (id) => {
+            if (id === "@praxisjs/css")
+                return cssMod;
+            if (id.startsWith("@praxisjs/"))
+                return praxisStub;
+            return {};
+        },
+        console: { log: noop, warn: noop, error: noop },
+        process: { env: {} },
+        setTimeout: noop,
+        clearTimeout: noop,
+    };
+    try {
+        vm.runInNewContext(bundleCode, sandbox);
+    }
+    catch {
+        return "";
+    }
+    return collected.join("\n");
+}
+// ─── Plugin ───────────────────────────────────────────────────────────────────
+/**
+ * Extracts all `@Styled()`, `keyframes()`, and `globalStyle()` CSS at build
+ * time and emits it as `virtual:praxisjs/styles.css`.
+ *
+ * In production:
+ * - CSS lives in a static asset with normal HTTP caching.
+ * - Runtime `<style>` injection is disabled (`__PRAXIS_CSS_STATIC__ = true`).
+ *
+ * In development:
+ * - The virtual module is empty; CSS is injected at runtime.
+ * - HMR works without extra configuration.
+ *
+ * @example
+ * // vite.config.ts
+ * import { praxisjs, praxisjsCSS } from '@praxisjs/vite-plugin'
+ * export default defineConfig({ plugins: [praxisjs(), praxisjsCSS()] })
+ */
+export function praxisjsCSS() {
+    let config;
+    let staticCSS = "";
+    return {
+        name: "praxisjs:css",
+        enforce: "pre",
+        configResolved(c) {
+            config = c;
+        },
+        config(_, env) {
+            if (env.command === "build") {
+                return { define: { __PRAXIS_CSS_STATIC__: JSON.stringify(true) } };
+            }
+        },
+        resolveId(id) {
+            if (id === VIRTUAL_ID)
+                return RESOLVED_ID;
+        },
+        load(id) {
+            if (id !== RESOLVED_ID)
+                return;
+            if (config.command === "serve")
+                return "/* @praxisjs/css: runtime injection active */";
+            return staticCSS
+                ? `/* @praxisjs/css: static extraction */\n${staticCSS}`
+                : "/* @praxisjs/css: no static styles found */";
+        },
+        async buildStart() {
+            if (config.command !== "build")
+                return;
+            staticCSS = await extractStaticCSS(config.root);
+            if (staticCSS) {
+                this.info(`@praxisjs/css: extracted ${String(staticCSS.split("\n").length)} CSS rules`);
+            }
+        },
+    };
+}
+//# sourceMappingURL=css.js.map

package/dist/css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.js","sourceRoot":"","sources":["../src/css.ts"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -1,4 +1,6 @@
+import { praxisjsCSS } from "./css.js";
 import type { Plugin } from "vite";
+export { praxisjsCSS };
 export interface PraxisJSVitePluginOptions {
     hmr?: boolean;
     autoImport?: boolean;

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAiB,MAAM,MAAM,CAAC;AAElD,MAAM,WAAW,yBAAyB;IACxC,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,QAAQ,CAAC,OAAO,GAAE,yBAA8B,GAAG,MAAM,EAAE,CA6C1E;AAED,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAEvC,OAAO,KAAK,EAAE,MAAM,EAAiB,MAAM,MAAM,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,CAAC;AAEvB,MAAM,WAAW,yBAAyB;IACxC,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,QAAQ,CAAC,OAAO,GAAE,yBAA8B,GAAG,MAAM,EAAE,CA6C1E;AAED,eAAe,QAAQ,CAAC"}

package/dist/index.js

@@ -1,3 +1,5 @@
+import { praxisjsCSS } from "./css.js";
+export { praxisjsCSS };
 export function praxisjs(options = {}) {
     const { hmr = true, autoImport = true } = options;
     return [

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAOA,MAAM,UAAU,QAAQ,CAAC,UAAqC,EAAE;IAC9D,MAAM,EAAE,GAAG,GAAG,IAAI,EAAE,UAAU,GAAG,IAAI,EAAE,GAAG,OAAO,CAAC;IAElD,OAAO;QACL;YACE,IAAI,EAAE,eAAe;YACrB,OAAO,EAAE,KAAK;YACd,MAAM;gBACJ,OAAO;oBACL,OAAO,EAAE;wBACP,MAAM,EAAE,QAAQ;qBACjB;iBACF,CAAC;YACJ,CAAC;YACD,SAAS,CAAC,IAAI,EAAE,EAAE;gBAChB,IAAI,CAAC,UAAU;oBAAE,OAAO;gBACxB,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC;oBAAE,OAAO;gBACzD,IAAI,IAAI,CAAC,QAAQ,CAAC,2BAA2B,CAAC;oBAAE,OAAO;gBACvD,OAAO,IAAI,CAAC;YACd,CAAC;SACF;QACD,GAAG,CAAC,GAAG;YACL,CAAC,CAAC;gBACE;oBACE,IAAI,EAAE,cAAc;oBACpB,OAAO,EAAE,MAAe;oBACxB,eAAe,CAAC,EACd,IAAI,EACJ,MAAM,GAIP;wBACC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;4BAAE,OAAO;wBAE5D,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC;4BACb,IAAI,EAAE,QAAQ;4BACd,KAAK,EAAE,2BAA2B;4BAClC,IAAI,EAAE,EAAE,IAAI,EAAE;yBACf,CAAC,CAAC;oBACL,CAAC;iBACF;aACF;YACH,CAAC,CAAC,EAAE,CAAC;KACR,CAAC;AACJ,CAAC;AAED,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAIvC,OAAO,EAAE,WAAW,EAAE,CAAC;AAOvB,MAAM,UAAU,QAAQ,CAAC,UAAqC,EAAE;IAC9D,MAAM,EAAE,GAAG,GAAG,IAAI,EAAE,UAAU,GAAG,IAAI,EAAE,GAAG,OAAO,CAAC;IAElD,OAAO;QACL;YACE,IAAI,EAAE,eAAe;YACrB,OAAO,EAAE,KAAK;YACd,MAAM;gBACJ,OAAO;oBACL,OAAO,EAAE;wBACP,MAAM,EAAE,QAAQ;qBACjB;iBACF,CAAC;YACJ,CAAC;YACD,SAAS,CAAC,IAAI,EAAE,EAAE;gBAChB,IAAI,CAAC,UAAU;oBAAE,OAAO;gBACxB,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC;oBAAE,OAAO;gBACzD,IAAI,IAAI,CAAC,QAAQ,CAAC,2BAA2B,CAAC;oBAAE,OAAO;gBACvD,OAAO,IAAI,CAAC;YACd,CAAC;SACF;QACD,GAAG,CAAC,GAAG;YACL,CAAC,CAAC;gBACE;oBACE,IAAI,EAAE,cAAc;oBACpB,OAAO,EAAE,MAAe;oBACxB,eAAe,CAAC,EACd,IAAI,EACJ,MAAM,GAIP;wBACC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;4BAAE,OAAO;wBAE5D,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC;4BACb,IAAI,EAAE,QAAQ;4BACd,KAAK,EAAE,2BAA2B;4BAClC,IAAI,EAAE,EAAE,IAAI,EAAE;yBACf,CAAC,CAAC;oBACL,CAAC;iBACF;aACF;YACH,CAAC,CAAC,EAAE,CAAC;KACR,CAAC;AACJ,CAAC;AAED,eAAe,QAAQ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@praxisjs/vite-plugin",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -11,12 +11,14 @@
     }
   },
   "peerDependencies": {
-    "vite": ">=7.0.0"
+    "@praxisjs/css": "0.1.0"
   },
   "devDependencies": {
-    "@types/node": "^25.3.0",
+    "@types/node": "^25.9.1",
+    "esbuild": "^0.25.12",
     "typescript": "^5.9.3",
-    "vite": "^7.3.1"
+    "vite": "^7.3.1",
+    "@praxisjs/css": "0.1.0"
   },
   "scripts": {
     "build": "tsc",

package/src/__tests__/css-esbuild-error.test.ts

@@ -0,0 +1,39 @@
+// Isolated test file: mocks esbuild to throw so we can exercise the
+// esbuild-failure branch in extractStaticCSS (css.ts line 97).
+import { describe, it, expect, vi, beforeAll, afterAll } from "vitest";
+import { mkdtempSync, writeFileSync, rmSync } from "node:fs";
+import { tmpdir } from "node:os";
+import path from "node:path";
+import type { Plugin, ResolvedConfig } from "vite";
+
+vi.mock("esbuild", () => ({
+  build: vi.fn().mockRejectedValue(new Error("esbuild crash")),
+}));
+
+type PluginHooks = {
+  configResolved(c: Partial<ResolvedConfig>): void;
+  load(id: string): string | undefined;
+  buildStart(): Promise<void>;
+};
+
+let tmpDir: string;
+
+beforeAll(() => {
+  tmpDir = mkdtempSync(path.join(tmpdir(), "praxis-css-esbuild-err-"));
+  writeFileSync(
+    path.join(tmpDir, "styles.ts"),
+    `import { Stylesheet } from "@praxisjs/css";\nclass X extends Stylesheet {}`,
+  );
+});
+
+afterAll(() => { rmSync(tmpDir, { recursive: true, force: true }); });
+
+describe("praxisjsCSS() — esbuild failure (mocked)", () => {
+  it("returns empty CSS when esbuild throws during extraction", async () => {
+    const { praxisjsCSS } = await import("../css");
+    const p = praxisjsCSS() as unknown as Plugin & { configResolved: PluginHooks["configResolved"]; buildStart: PluginHooks["buildStart"]; load: PluginHooks["load"] };
+    p.configResolved({ command: "build", root: tmpDir } as Partial<ResolvedConfig>);
+    await p.buildStart.call({ info: vi.fn() });
+    expect(p.load("\0virtual:praxisjs/styles.css")).toContain("no static styles found");
+  });
+});

package/src/__tests__/css.test.ts

@@ -0,0 +1,319 @@
+import { describe, it, expect, vi, beforeAll, afterAll } from "vitest";
+import { mkdtempSync, mkdirSync, writeFileSync, rmSync } from "node:fs";
+import { tmpdir } from "node:os";
+import path from "node:path";
+import vm from "node:vm";
+import type { Plugin, ResolvedConfig } from "vite";
+import { praxisjsCSS } from "../css";
+
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+
+type PluginHooks = {
+  configResolved(c: Partial<ResolvedConfig>): void;
+  config(c: unknown, env: { command: "build" | "serve" }): { define: Record<string, string> } | undefined;
+  resolveId(id: string): string | undefined;
+  load(id: string): string | undefined;
+  buildStart(): Promise<void>;
+};
+
+function hooks(p: Plugin): PluginHooks {
+  return p as unknown as PluginHooks;
+}
+
+function servePlugin() {
+  const p = praxisjsCSS();
+  hooks(p).configResolved({ command: "serve", root: "/" } as Partial<ResolvedConfig>);
+  return p;
+}
+
+function buildPlugin(root = "/") {
+  const p = praxisjsCSS();
+  hooks(p).configResolved({ command: "build", root } as Partial<ResolvedConfig>);
+  return p;
+}
+
+// ─── Plugin shape ─────────────────────────────────────────────────────────────
+
+describe("praxisjsCSS() — plugin shape", () => {
+  it("has name praxisjs:css", () => {
+    expect(praxisjsCSS().name).toBe("praxisjs:css");
+  });
+
+  it("enforces 'pre'", () => {
+    expect(praxisjsCSS().enforce).toBe("pre");
+  });
+});
+
+// ─── resolveId() ─────────────────────────────────────────────────────────────
+
+describe("praxisjsCSS() — resolveId()", () => {
+  it("resolves virtual:praxisjs/styles.css to internal null-prefixed id", () => {
+    const p = servePlugin();
+    expect(hooks(p).resolveId("virtual:praxisjs/styles.css")).toBe("\0virtual:praxisjs/styles.css");
+  });
+
+  it("returns undefined for any other id", () => {
+    const p = servePlugin();
+    expect(hooks(p).resolveId("./component.ts")).toBeUndefined();
+    expect(hooks(p).resolveId("vite/client")).toBeUndefined();
+  });
+});
+
+// ─── config() ────────────────────────────────────────────────────────────────
+
+describe("praxisjsCSS() — config()", () => {
+  it("injects __PRAXIS_CSS_STATIC__ define in build mode", () => {
+    const p = praxisjsCSS();
+    const result = hooks(p).config({}, { command: "build" });
+    expect(result?.define?.["__PRAXIS_CSS_STATIC__"]).toBe("true");
+  });
+
+  it("returns undefined in serve mode", () => {
+    const p = praxisjsCSS();
+    expect(hooks(p).config({}, { command: "serve" })).toBeUndefined();
+  });
+});
+
+// ─── load() ──────────────────────────────────────────────────────────────────
+
+describe("praxisjsCSS() — load()", () => {
+  it("returns runtime-injection comment for virtual id in serve mode", () => {
+    const result = hooks(servePlugin()).load("\0virtual:praxisjs/styles.css");
+    expect(result).toContain("runtime injection active");
+  });
+
+  it("returns 'no static styles found' for virtual id in build mode before extraction", () => {
+    const result = hooks(buildPlugin()).load("\0virtual:praxisjs/styles.css");
+    expect(result).toContain("no static styles found");
+  });
+
+  it("returns undefined for non-virtual ids", () => {
+    expect(hooks(servePlugin()).load("./component.ts")).toBeUndefined();
+    expect(hooks(buildPlugin()).load("node_modules/something")).toBeUndefined();
+  });
+
+  it("returns extracted CSS header in build mode after extraction", async () => {
+    // set up extraction output by running buildStart first (integration test below)
+    // this test checks the static CSS header content after buildStart sets staticCSS
+    const p = buildPlugin(tmpDir);
+    const info = vi.fn();
+    await hooks(p).buildStart.call({ info });
+    const result = hooks(p).load("\0virtual:praxisjs/styles.css") as string;
+    expect(result).toContain("static extraction");
+  });
+});
+
+// ─── buildStart() — integration ──────────────────────────────────────────────
+
+let tmpDir: string;
+
+beforeAll(async () => {
+  tmpDir = mkdtempSync(path.join(tmpdir(), "praxis-css-test-"));
+
+  // tsconfig.json — exercises the findTsConfig() success branch (return p)
+  writeFileSync(path.join(tmpDir, "tsconfig.json"), "{}");
+
+  // File 1: extends Stylesheet + uses Styled()
+  writeFileSync(
+    path.join(tmpDir, "button.ts"),
+    `
+import { Stylesheet, Styled } from "@praxisjs/css";
+class BtnStyles extends Stylesheet {
+  $root  = this.css({ display: "inline-flex", padding: "8px 16px" });
+  $hover = this.css({ opacity: 0.9 });
+}
+Styled(BtnStyles);
+`,
+  );
+
+  // File 2: globalStyle()
+  writeFileSync(
+    path.join(tmpDir, "base.ts"),
+    `
+import { globalStyle } from "@praxisjs/css";
+globalStyle(_css => "*, *::before, *::after { box-sizing: border-box; }");
+`,
+  );
+
+  // File 3: keyframes()
+  writeFileSync(
+    path.join(tmpDir, "animations.ts"),
+    `
+import { keyframes } from "@praxisjs/css";
+const spin = keyframes("spin", {
+  from: { transform: "rotate(0deg)" },
+  to: { transform: "rotate(360deg)" },
+});
+`,
+  );
+
+  // File 4: Themed()
+  writeFileSync(
+    path.join(tmpDir, "theme.ts"),
+    `
+import { Themed } from "@praxisjs/css";
+class AppTokens { colorBrand = "#6d5bbd"; }
+class LightTheme extends AppTokens {}
+Themed(AppTokens, LightTheme);
+`,
+  );
+
+  // File that imports another @praxisjs/* package — exercises the praxis stub,
+  // calls noop, AND calls noop's return value to achieve full function coverage
+  writeFileSync(
+    path.join(tmpDir, "with-runtime.ts"),
+    `
+import { signal } from "@praxisjs/core";
+import { globalStyle } from "@praxisjs/css";
+globalStyle(_css => "html { font-family: system-ui; }");
+const s = signal(0);
+if (typeof s === 'function') s();
+console.log(s);
+setTimeout(() => {}, 0);
+clearTimeout(0);
+`,
+  );
+
+  // File that imports a third-party package — exercises require() fallback return {}
+  writeFileSync(
+    path.join(tmpDir, "with-thirdparty.ts"),
+    `
+import { globalStyle } from "@praxisjs/css";
+import { format } from "date-fns";
+globalStyle(_css => "body { color: black; }");
+void format;
+`,
+  );
+
+  // Subdirectory with a .tsx file — exercises isDirectory() and .tsx branches
+  const subDir = path.join(tmpDir, "components");
+  mkdirSync(subDir);
+  writeFileSync(
+    path.join(subDir, "card.tsx"),
+    `
+import { Stylesheet, Styled } from "@praxisjs/css";
+class CardStyles extends Stylesheet {
+  $card = this.css({ borderRadius: "8px" });
+}
+Styled(CardStyles);
+`,
+  );
+
+  // Skipped directory (SKIP_DIRS) — exercises the SKIP_DIRS.has() branch
+  mkdirSync(path.join(tmpDir, "node_modules"));
+
+  // Hidden file — exercises the startsWith(".") branch
+  writeFileSync(path.join(tmpDir, ".hidden.ts"), `export {};`);
+
+  // Non-TS/TSX file — exercises the else-if false branch in findSourceFiles
+  writeFileSync(path.join(tmpDir, "styles.css"), `body { margin: 0; }`);
+
+  // Non-matching TS file (should be ignored)
+  writeFileSync(
+    path.join(tmpDir, "utils.ts"),
+    `export const add = (a: number, b: number) => a + b;`,
+  );
+});
+
+afterAll(() => {
+  rmSync(tmpDir, { recursive: true, force: true });
+});
+
+describe("praxisjsCSS() — buildStart() integration", () => {
+  it("extracts scoped class CSS from Stylesheet subclasses", async () => {
+    const p = buildPlugin(tmpDir);
+    const info = vi.fn();
+    await hooks(p).buildStart.call({ info });
+    const css = hooks(p).load("\0virtual:praxisjs/styles.css") as string;
+    expect(css).toContain(".prx-root-");
+    expect(css).toContain("display: inline-flex");
+  });
+
+  it("extracts globalStyle CSS", async () => {
+    const p = buildPlugin(tmpDir);
+    await hooks(p).buildStart.call({ info: vi.fn() });
+    const css = hooks(p).load("\0virtual:praxisjs/styles.css") as string;
+    expect(css).toContain("box-sizing: border-box");
+  });
+
+  it("extracts @keyframes CSS", async () => {
+    const p = buildPlugin(tmpDir);
+    await hooks(p).buildStart.call({ info: vi.fn() });
+    const css = hooks(p).load("\0virtual:praxisjs/styles.css") as string;
+    expect(css).toContain("@keyframes prx-spin-");
+    expect(css).toContain("rotate(0deg)");
+  });
+
+  it("extracts :root vars from Themed()", async () => {
+    const p = buildPlugin(tmpDir);
+    await hooks(p).buildStart.call({ info: vi.fn() });
+    const css = hooks(p).load("\0virtual:praxisjs/styles.css") as string;
+    expect(css).toContain(":root");
+    expect(css).toContain("--color-brand: #6d5bbd");
+  });
+
+  it(":root vars appear before class rules", async () => {
+    const p = buildPlugin(tmpDir);
+    await hooks(p).buildStart.call({ info: vi.fn() });
+    const css = hooks(p).load("\0virtual:praxisjs/styles.css") as string;
+    const rootIdx = css.indexOf(":root");
+    const classIdx = css.indexOf(".prx-");
+    expect(rootIdx).toBeLessThan(classIdx);
+  });
+
+  it("calls this.info() with extracted rule count", async () => {
+    const p = buildPlugin(tmpDir);
+    const info = vi.fn();
+    await hooks(p).buildStart.call({ info });
+    expect(info).toHaveBeenCalledWith(expect.stringContaining("extracted"));
+  });
+
+  it("returns empty when root has no matching source files", async () => {
+    const emptyDir = mkdtempSync(path.join(tmpdir(), "praxis-empty-"));
+    try {
+      const p = buildPlugin(emptyDir);
+      const info = vi.fn();
+      await hooks(p).buildStart.call({ info });
+      expect(info).not.toHaveBeenCalled();
+      const css = hooks(p).load("\0virtual:praxisjs/styles.css") as string;
+      expect(css).toContain("no static styles found");
+    } finally {
+      rmSync(emptyDir, { recursive: true, force: true });
+    }
+  });
+
+  it("skips non-serve mode in buildStart for serve command", async () => {
+    const p = servePlugin();
+    const info = vi.fn();
+    await hooks(p).buildStart.call({ info });
+    expect(info).not.toHaveBeenCalled();
+  });
+
+  it("handles a root directory that cannot be read (readdirSync throws)", async () => {
+    const p = buildPlugin("/this/path/does/not/exist/at/all");
+    const info = vi.fn();
+    await hooks(p).buildStart.call({ info });
+    expect(info).not.toHaveBeenCalled();
+    expect(hooks(p).load("\0virtual:praxisjs/styles.css")).toContain("no static styles found");
+  });
+
+  it("handles vm execution error gracefully (returns empty CSS)", async () => {
+    const spy = vi.spyOn(vm, "runInNewContext").mockImplementationOnce(() => { throw new Error("vm crash"); });
+    try {
+      const p = buildPlugin(tmpDir);
+      await hooks(p).buildStart.call({ info: vi.fn() });
+      expect(hooks(p).load("\0virtual:praxisjs/styles.css")).toContain("no static styles found");
+    } finally {
+      spy.mockRestore();
+    }
+  });
+
+  it("exercises the @praxisjs/* stub path (require for non-css praxis packages)", async () => {
+    const p = buildPlugin(tmpDir);
+    await hooks(p).buildStart.call({ info: vi.fn() });
+    const css = hooks(p).load("\0virtual:praxisjs/styles.css") as string;
+    // The with-runtime.ts fixture imports @praxisjs/core which uses the stub
+    // If no error was thrown, the stub handled it correctly
+    expect(typeof css).toBe("string");
+  });
+});