xbintsc 0.5.41 → 0.5.43

package/dist/src/cli/help.d.ts

@@ -4,4 +4,4 @@
  * It lives apart from the command dispatch so the executable entry point stays
  * under the repository's per-file line budget; the text is data, not logic.
  */
-export declare const HELP = "xbintsc 0.5.41 - TypeScript binary compiler\n\nUsage:\n  xbintsc build <file.ts> [options]   Compile to a native binary\n  xbintsc run <file.ts> [-- args]     Compile and execute\n  xbintsc check <file.ts>             Parse, bind and check without linking\n  xbintsc watch <file.ts> [options]   Rebuild whenever the source tree changes\n  xbintsc emit <file.ts>              Print LLVM IR\n  xbintsc doctor                      Report the resolved toolchain\n  xbintsc version                     Print the version\n  xbintsc help                        Show this message\n\nOptions:\n  -o, --output <path>   Output path\n      --out <dir>       Output directory (default: build/)\n      --emit <kind>     exe | obj | ir (default: exe)\n  -O0..-O3              Optimization level (default: -O2)\n      --ext <names>     Comma separated extensions (e.g. node,gui,media)\n      --ext-native <m>  Register a C++/Rust extension from a JSON manifest\n                        (comma separated for several)\n      --config <path>   Use a project config (default: auto-detect\n                        xbintsc.config.json)\n      --no-config       Do not read any project config\n      --icon <path>     Embed an application icon (PNG/ICO/ICNS)\n      --bundle          macOS: also produce a .app bundle\n      --app-name <name> Bundle / display name\n      --app-id <id>     macOS bundle identifier (e.g. com.example.demo)\n      --force           Ignore the incremental cache\n      --verbose         Print progress information\n      --time            Print per-phase build timings\n      --debug           Emit debug info (DWARF/CodeView) and keep frame pointers\n      --check           Run the semantic checker (default)\n      --no-check        Skip the semantic checker; only erase type syntax\n      --lto             Compile program and runtime to LTO bitcode; link with lld\n      --pgo-generate [dir]  Build an instrumented binary writing profiles to dir\n      --pgo-use [dir]   Build with the profiles collected from --pgo-generate\n      --json            Print diagnostics as a JSON array on stdout\n      --no-hints        Do not append the \"hint: \u2026 see <doc>\" line to failures\n\nxbintsc compiles a subset of TypeScript to a native binary. Types are erased;\nonly inference-free facts (names, redeclarations, call arity) are checked.\nNode built-ins need --ext node, packages in node_modules are bundled at build\ntime, and clang 16+ is required to link.\n\nInstalled as a project dependency (npm):\n  npx xbintsc doctor\n  npx xbintsc build <entry.ts> --out build\n  npx xbintsc run <entry.ts>\nThe first build compiles the C runtime; later builds reuse the cache.\n\nDocs: doc/ai/README.md (task guide) - doc/ai/language-support.md (subset) -\ndoc/ai/troubleshooting.md (failures) - llms.txt (index of every document).\nWhen installed from npm, these live under node_modules/xbintsc/doc/ and\nnode_modules/xbintsc/doc/npm-package.md is the project guide.\n";
+export declare const HELP = "xbintsc 0.5.43 - TypeScript binary compiler\n\nUsage:\n  xbintsc build <file.ts> [options]   Compile to a native binary\n  xbintsc run <file.ts> [-- args]     Compile and execute\n  xbintsc check <file.ts>             Parse, bind and check without linking\n  xbintsc watch <file.ts> [options]   Rebuild whenever the source tree changes\n  xbintsc emit <file.ts>              Print LLVM IR\n  xbintsc doctor                      Report the resolved toolchain\n  xbintsc version                     Print the version\n  xbintsc help                        Show this message\n\nOptions:\n  -o, --output <path>   Output path\n      --out <dir>       Output directory (default: build/)\n      --emit <kind>     exe | obj | ir (default: exe)\n  -O0..-O3              Optimization level (default: -O2)\n      --ext <names>     Comma separated extensions (e.g. node,gui,media)\n      --ext-native <m>  Register a C++/Rust extension from a JSON manifest\n                        (comma separated for several)\n      --config <path>   Use a project config (default: auto-detect\n                        xbintsc.config.json)\n      --no-config       Do not read any project config\n      --icon <path>     Embed an application icon (PNG/ICO/ICNS)\n      --bundle          macOS: also produce a .app bundle\n      --app-name <name> Bundle / display name\n      --app-id <id>     macOS bundle identifier (e.g. com.example.demo)\n      --force           Ignore the incremental cache\n      --verbose         Print progress information\n      --time            Print per-phase build timings\n      --debug           Emit debug info (DWARF/CodeView) and keep frame pointers\n      --check           Run the semantic checker (default)\n      --no-check        Skip the semantic checker; only erase type syntax\n      --lto             Compile program and runtime to LTO bitcode; link with lld\n      --pgo-generate [dir]  Build an instrumented binary writing profiles to dir\n      --pgo-use [dir]   Build with the profiles collected from --pgo-generate\n      --json            Print diagnostics as a JSON array on stdout\n      --no-hints        Do not append the \"hint: \u2026 see <doc>\" line to failures\n\nxbintsc compiles a subset of TypeScript to a native binary. Types are erased;\nonly inference-free facts (names, redeclarations, call arity) are checked.\nNode built-ins need --ext node, packages in node_modules are bundled at build\ntime, and clang 16+ is required to link.\n\nInstalled as a project dependency (npm):\n  npx xbintsc doctor\n  npx xbintsc build <entry.ts> --out build\n  npx xbintsc run <entry.ts>\nThe first build compiles the C runtime; later builds reuse the cache.\n\nDocs: doc/ai/README.md (task guide) - doc/ai/language-support.md (subset) -\ndoc/ai/troubleshooting.md (failures) - llms.txt (index of every document).\nWhen installed from npm, these live under node_modules/xbintsc/doc/ and\nnode_modules/xbintsc/doc/npm-package.md is the project guide.\n";

package/dist/src/driver/version.d.ts

@@ -9,4 +9,4 @@
  * `main`/`master` only (see `.githooks/pre-commit`), so feature branches never
  * change this line and merging two of them cannot conflict here.
  */
-export declare const COMPILER_VERSION = "0.5.41";
+export declare const COMPILER_VERSION = "0.5.43";

package/dist/src/driver/version.js

@@ -9,5 +9,5 @@
  * `main`/`master` only (see `.githooks/pre-commit`), so feature branches never
  * change this line and merging two of them cannot conflict here.
  */
-export const COMPILER_VERSION = "0.5.41";
+export const COMPILER_VERSION = "0.5.43";
 //# sourceMappingURL=version.js.map

package/dist/tests/e2e/gui-data-url.test.d.ts

@@ -0,0 +1,10 @@
+/**
+ * End-to-end tests for `data:` image URLs: raster and SVG, base64 and
+ * percent-encoded payloads, in `<img>`, `canvas.drawImage(String, …)` and CSS
+ * `background-image`.
+ *
+ * The SVG below deliberately exercises the decoder, not NanoSVG's feature set:
+ * the engine rasterises NanoSVG's subset, so an SVG that uses filters still
+ * decodes but renders the shapes without the filter effect.
+ */
+export {};

package/dist/tests/e2e/gui-data-url.test.js

@@ -0,0 +1,127 @@
+/**
+ * End-to-end tests for `data:` image URLs: raster and SVG, base64 and
+ * percent-encoded payloads, in `<img>`, `canvas.drawImage(String, …)` and CSS
+ * `background-image`.
+ *
+ * The SVG below deliberately exercises the decoder, not NanoSVG's feature set:
+ * the engine rasterises NanoSVG's subset, so an SVG that uses filters still
+ * decodes but renders the shapes without the filter effect.
+ */
+import { afterAll, beforeAll, describe, expect, it } from "vitest";
+import { createGuiHarness, guiAvailable } from "./gui-helpers.js";
+const harness = createGuiHarness();
+/* 4x4 PNG: left half red, right half blue. */
+const PNG = "iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAFElEQVR42mP4z8DwH4Sh1H8G0gUALFAf4eNWqTEAAAAASUVORK5CYII=";
+const SVG = '<svg xmlns="http://www.w3.org/2000/svg" width="8" height="6"><rect width="8" height="6" fill="#ff0000"/></svg>';
+const SVG_B64 = Buffer.from(SVG).toString("base64");
+const SVG_ENC = encodeURIComponent(SVG);
+/** The `feTurbulence` example from the request: `<filter>` is not in NanoSVG's
+ * subset, but the document still decodes (the rect renders, unfiltered). */
+const NOISE = "data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.8'/%3E%3C/svg%3E";
+const PAGE = `
+<html><head><style>body { margin: 0; }</style></head><body>
+<img id="vec" src="data:image/svg+xml,${SVG_ENC}">
+<img id="vec64" src="data:image/svg+xml;base64,${SVG_B64}">
+<img id="noise" src="${NOISE}">
+<div id="bg" style="width:20px;height:20px"></div>
+<canvas id="c" width="240" height="240"></canvas>
+</body></html>`;
+describe.skipIf(!guiAvailable)("gui extension — data URL images", () => {
+    beforeAll(() => harness.setup());
+    afterAll(() => harness.cleanup());
+    it("decodes SVG data URLs in <img>, drawImage and CSS backgrounds", () => {
+        const { value, stderr } = harness.compileAndRun("data-url-svg", `
+      import { createWindow, run } from "gui";
+
+      const win = createWindow({ title: "data-url", width: 500, height: 400 });
+      win.on("ready", () => {
+        const doc: any = document;
+        const ctx: any = doc.getElementById("c").getContext("2d");
+        const px = (x: number, y: number): string => {
+          const d = ctx.getImageData(x, y, 1, 1).data;
+          return d[0] + "," + d[1] + "," + d[2] + "," + d[3];
+        };
+        const clear = (): void => { ctx.clearRect(0, 0, 240, 240); };
+        const box = (id: string): string => {
+          const r: any = doc.getElementById(id).getBoundingClientRect();
+          return r.width + "x" + r.height;
+        };
+
+        const png = "data:image/png;base64,${PNG}";
+        const svgEnc = "data:image/svg+xml,${SVG_ENC}";
+        const svg64 = "data:image/svg+xml;base64,${SVG_B64}";
+        const noise = "${NOISE}";
+
+        console.log("vec-box=" + box("vec"));
+        console.log("vec64-box=" + box("vec64"));
+        console.log("noise-box=" + box("noise"));
+
+        // A raster data URL drawn from its string, without an <img>.
+        clear();
+        ctx.drawImage(png, 0, 0);
+        console.log("png-string=" + px(0, 0) + ":" + px(3, 0));
+
+        // SVG data URLs in both encodings, as a string and as an <img>.
+        clear();
+        ctx.drawImage(svgEnc, 0, 0);
+        console.log("svg-enc-string=" + px(0, 0) + ":" + px(7, 5));
+
+        clear();
+        ctx.drawImage(svg64, 0, 0);
+        console.log("svg64-string=" + px(0, 0));
+
+        clear();
+        ctx.drawImage(svgEnc, 0, 0, 16, 12);
+        console.log("svg-scaled=" + px(0, 0) + ":" + px(15, 11));
+
+        clear();
+        ctx.drawImage(doc.getElementById("vec"), 0, 0);
+        console.log("svg-img=" + px(0, 0));
+
+        clear();
+        ctx.drawImage(doc.getElementById("vec64"), 0, 0);
+        console.log("svg64-img=" + px(0, 0));
+
+        // The request's feTurbulence document: it decodes (opaque rect), while
+        // the filter itself remains outside NanoSVG's subset.
+        clear();
+        ctx.drawImage(noise, 0, 0, 32, 32);
+        console.log("noise-alpha=" + ctx.getImageData(0, 0, 1, 1).data[3]);
+
+        // SVG data URL as a CSS background.
+        const bg: any = doc.getElementById("bg");
+        bg.style.backgroundImage = 'url("' + svgEnc + '")';
+        console.log("bg-css=" + getComputedStyle(bg).backgroundImage.substring(0, 26));
+        let hits = 0;
+        for (const line of win.paintList().split("\\n")) {
+          if (line.indexOf("src=data:image/svg+xml") >= 0) hits++;
+        }
+        console.log("paint-svg=" + hits);
+
+        // Let one rendered frame decode the background texture (stderr reports
+        // a failure), then close.
+        requestAnimationFrame(() => {
+          requestAnimationFrame(() => {
+            win.close();
+          });
+        });
+      });
+      win.loadHTML(\`${PAGE}\`);
+      run();
+      `, { autocloseMs: 3000 });
+        expect(value("vec-box")).toBe("8x6");
+        expect(value("vec64-box")).toBe("8x6");
+        expect(value("noise-box")).toBe("180x180");
+        expect(value("png-string")).toBe("255,0,0,255:0,0,255,255");
+        expect(value("svg-enc-string")).toBe("255,0,0,255:255,0,0,255");
+        expect(value("svg64-string")).toBe("255,0,0,255");
+        expect(value("svg-scaled")).toBe("255,0,0,255:255,0,0,255");
+        expect(value("svg-img")).toBe("255,0,0,255");
+        expect(value("svg64-img")).toBe("255,0,0,255");
+        expect(Number(value("noise-alpha"))).toBeGreaterThan(0);
+        expect(value("bg-css")).toMatch(/^url\(data:image\/svg\+xml/);
+        expect(value("paint-svg")).toBe("4");
+        expect(stderr).not.toContain("could not decode image");
+    });
+});
+//# sourceMappingURL=gui-data-url.test.js.map

package/dist/tests/e2e/gui-data-url.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gui-data-url.test.js","sourceRoot":"","sources":["../../../tests/e2e/gui-data-url.test.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAElE,MAAM,OAAO,GAAG,gBAAgB,EAAE,CAAC;AAEnC,8CAA8C;AAC9C,MAAM,GAAG,GACP,0GAA0G,CAAC;AAC7G,MAAM,GAAG,GACP,gHAAgH,CAAC;AACnH,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;AACpD,MAAM,OAAO,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;AAExC;4EAC4E;AAC5E,MAAM,KAAK,GACT,4SAA4S,CAAC;AAE/S,MAAM,IAAI,GAAG;;wCAE2B,OAAO;iDACE,OAAO;uBACjC,KAAK;;;eAGb,CAAC;AAEhB,QAAQ,CAAC,MAAM,CAAC,CAAC,YAAY,CAAC,CAAC,iCAAiC,EAAE,GAAG,EAAE;IACrE,SAAS,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC;IACjC,QAAQ,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,CAAC;IAElC,EAAE,CAAC,+DAA+D,EAAE,GAAG,EAAE;QACvE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,aAAa,CAC7C,cAAc,EACd;;;;;;;;;;;;;;;;;6CAiBuC,GAAG;6CACH,OAAO;mDACD,OAAO;yBACjC,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAwDP,IAAI;;OAEpB,EACD,EAAE,WAAW,EAAE,IAAI,EAAE,CACtB,CAAC;QAEF,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACrC,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACvC,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC3C,MAAM,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;QAC5D,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;QAChE,MAAM,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAClD,MAAM,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;QAC5D,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAC7C,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAC/C,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;QACxD,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,4BAA4B,CAAC,CAAC;QAC9D,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACrC,MAAM,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,wBAAwB,CAAC,CAAC;IACzD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/tests/e2e/gui-effects.test.js

@@ -130,13 +130,153 @@ describe.skipIf(!guiAvailable)("gui extension — effects", () => {
         const list = stdout.slice(stdout.indexOf("list-start"), stdout.indexOf("list-end"));
         expect(value("image")).toContain("radial-gradient()");
         expect(value("image")).toContain("linear-gradient()");
-        // Both layers are painted: the red radial core and its green outer ring
-        // (the linear blue layer is underneath them).
+        // The radial layer is one rasterised gradient carrying its stops; the linear
+        // layer is still painted as solid bands.
+        expect(list).toContain("gradient=radial");
         expect(list).toContain("#ff0000ff");
         expect(list).toContain("#00ff00ff");
         expect(list).toMatch(/#0000[0-9a-f]{2}ff/);
-        // Radial bands plus the linear strips.
-        expect(Number(value("count"))).toBeGreaterThan(30);
+        // Eighteen linear strips plus the background colour: the gradient image is
+        // not a stack of rectangles.
+        expect(Number(value("count"))).toBe(19);
+    });
+    it("rasterises a translucent radial vignette as one gradient image", () => {
+        const { value, stdout } = harness.compileAndRun("vignette", `
+      import { createWindow, run } from "gui";
+
+      const HTML = \`
+      <html><head><style>
+        body { margin: 0; }
+        #scene { position: relative; width: 200px; height: 100px; background: #3366cc; }
+        #dim {
+          position: absolute; inset: -5%; z-index: 2; pointer-events: none;
+          background: radial-gradient(ellipse at center,
+            transparent 45%, rgba(0, 0, 0, 0.46) 76%, rgba(0, 0, 0, 0.88) 100%);
+        }
+      </style></head><body>
+        <div id="scene"><div id="dim"></div></div>
+      </body></html>
+      \`;
+
+      const win = createWindow({ title: "vignette", width: 400, height: 300 });
+      win.on("ready", () => {
+        console.log("image=" + win.computedStyle("#dim", "background-image"));
+        console.log("count=" + win.paintCount());
+        console.log("list-start");
+        console.log(win.paintList());
+        console.log("list-end");
+        win.close();
+      });
+      win.loadHTML(HTML);
+      run();
+      `);
+        const list = stdout.slice(stdout.indexOf("list-start"), stdout.indexOf("list-end"));
+        expect(value("image")).toContain("radial-gradient()");
+        // A single op whose stops keep the alpha ramp. Painting this as nested
+        // translucent ellipses composited the alpha once per band and turned the
+        // whole scene solid black.
+        expect((list.match(/gradient=radial/g) ?? []).length).toBe(1);
+        expect(list).toContain("#00000000@0.4500");
+        expect(list).toContain("#000000e0@1.0000");
+        // Only the scene background is a rectangle; the vignette is not bands.
+        expect(value("count")).toBe("1");
+    });
+    it("tiles repeating gradients across the whole box", () => {
+        const { value, stdout } = harness.compileAndRun("repeating-gradient", `
+      import { createWindow, run } from "gui";
+
+      const HTML = \`
+      <html><head><style>
+        body { margin: 0; }
+        #r {
+          width: 100px; height: 40px;
+          background: repeating-linear-gradient(90deg,
+            #ff0000 0%, #ff0000 10%, #0000ff 10%, #0000ff 20%);
+        }
+      </style></head><body><div id="r"></div></body></html>
+      \`;
+
+      const win = createWindow({ title: "repeating-gradient", width: 400, height: 300 });
+      win.on("ready", () => {
+        console.log("image=" + win.computedStyle("#r", "background-image"));
+        console.log("list-start");
+        console.log(win.paintList());
+        console.log("list-end");
+        win.close();
+      });
+      win.loadHTML(HTML);
+      run();
+      `);
+        const list = stdout.slice(stdout.indexOf("list-start"), stdout.indexOf("list-end"));
+        // The computed value keeps the repeating function name ...
+        expect(value("image")).toBe("repeating-linear-gradient()");
+        // ... and the whole 100px box is tiled: a 20% period gives five red and
+        // five blue bands, not one ramp that holds the final colour.
+        expect((list.match(/#ff0000ff/g) ?? []).length).toBeGreaterThan(4);
+        expect((list.match(/#0000ffff/g) ?? []).length).toBeGreaterThan(4);
+    });
+    it("resolves pixel offsets in repeating gradients", () => {
+        const { value, stdout } = harness.compileAndRun("repeating-gradient-px", `
+      import { createWindow, run } from "gui";
+
+      const HTML = \`
+      <html><head><style>
+        body { margin: 0; }
+        #r {
+          width: 100px; height: 20px;
+          background: repeating-linear-gradient(90deg,
+            #123456 0px 10px, #abcdef 10px 20px);
+        }
+      </style></head><body><div id="r"></div></body></html>
+      \`;
+
+      const win = createWindow({ title: "repeating-gradient-px", width: 400, height: 300 });
+      win.on("ready", () => {
+        console.log("image=" + win.computedStyle("#r", "background-image"));
+        console.log("list-start");
+        console.log(win.paintList());
+        console.log("list-end");
+        win.close();
+      });
+      win.loadHTML(HTML);
+      run();
+      `);
+        const list = stdout.slice(stdout.indexOf("list-start"), stdout.indexOf("list-end"));
+        expect(value("image")).toBe("repeating-linear-gradient()");
+        expect((list.match(/#123456ff/g) ?? []).length).toBeGreaterThan(4);
+        expect((list.match(/#abcdefff/g) ?? []).length).toBeGreaterThan(4);
+    });
+    it("tiles repeating radial gradients", () => {
+        const { value, stdout } = harness.compileAndRun("repeating-radial-gradient", `
+      import { createWindow, run } from "gui";
+
+      const HTML = \`
+      <html><head><style>
+        body { margin: 0; }
+        #r {
+          width: 40px; height: 40px;
+          background: repeating-radial-gradient(circle at 50% 50%,
+            #ff0000 0%, #ff0000 5%, #0000ff 5%, #0000ff 10%);
+        }
+      </style></head><body><div id="r"></div></body></html>
+      \`;
+
+      const win = createWindow({ title: "repeating-radial-gradient", width: 400, height: 300 });
+      win.on("ready", () => {
+        console.log("image=" + win.computedStyle("#r", "background-image"));
+        console.log("list-start");
+        console.log(win.paintList());
+        console.log("list-end");
+        win.close();
+      });
+      win.loadHTML(HTML);
+      run();
+      `);
+        const list = stdout.slice(stdout.indexOf("list-start"), stdout.indexOf("list-end"));
+        expect(value("image")).toBe("repeating-radial-gradient()");
+        expect(list).toContain("gradient=repeating-radial");
+        expect(list).toContain("#ff0000ff");
+        expect(list).toContain("#0000ffff");
     });
     it("paints text-shadow copies behind the text", () => {
         const { value, stdout } = harness.compileAndRun("text-shadow", `

package/dist/tests/e2e/gui-effects.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"gui-effects.test.js","sourceRoot":"","sources":["../../../tests/e2e/gui-effects.test.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"gui-effects.test.js","sourceRoot":"","sources":["../../../tests/e2e/gui-effects.test.ts"],"names":[],"mappings":"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"}

package/dist/tests/e2e/gui-paint.test.js

@@ -187,5 +187,82 @@ describe.skipIf(!guiAvailable)("gui extension — paint", () => {
         // Anything above 0 is painted in full (there is no partial compositing yet).
         expect(list).toContain("#ff0000ff");
     });
+    it("applies fractional `opacity` to every painted colour in the subtree", () => {
+        const { value, stdout } = harness.compileAndRun("opacity-half", `
+      import { createWindow, run } from "gui";
+
+      const HTML = \`
+      <html><head><style>
+        body { margin: 0; background-color: #000000; }
+        #half { width: 40px; height: 20px; background: #ff0000; opacity: 0.5; }
+        #nested { width: 20px; height: 10px; background: #00ff00; color: #00ff00; opacity: 0.5; }
+        #label { color: #ffff00; }
+      </style></head><body>
+        <div id="half"><div id="nested"><span id="label">faded</span></div></div>
+      </body></html>
+      \`;
+
+      const win = createWindow({ title: "opacity-half", width: 400, height: 300 });
+      win.on("ready", () => {
+        console.log("opacity=" + win.computedStyle("#nested", "opacity"));
+        console.log("list-start");
+        console.log(win.paintList());
+        console.log("list-end");
+        win.close();
+      });
+      win.loadHTML(HTML);
+      run();
+      `);
+        const list = stdout.slice(stdout.indexOf("list-start"), stdout.indexOf("list-end"));
+        expect(value("opacity")).toBe("0.5");
+        // #half's red background, then #nested's 0.5 on top of it, then the text's
+        // inherited 0.25: alpha is multiplied down the paint chain instead of
+        // treating any value above zero as opaque.
+        expect(list).toContain("color=#ff000080");
+        expect(list).toContain("color=#00ff0040");
+        expect(list).toContain("color=#ffff0040");
+    });
+    it("wraps `mix-blend-mode` boxes in a compositing layer", () => {
+        const { value, stdout, stderr } = harness.compileAndRun("mix-blend-mode", `
+      import { createWindow, run } from "gui";
+
+      const HTML = \`
+      <html><head><style>
+        body { margin: 0; }
+        #card { width: 100px; height: 100px; background: #ffffff; }
+        #multiply { width: 50px; height: 50px; background: #ff0000; mix-blend-mode: multiply; }
+        #overlay { width: 20px; height: 20px; background: #00ff00; mix-blend-mode: overlay; }
+      </style></head><body>
+        <div id="card"><div id="multiply"><div id="overlay"></div></div></div>
+      </body></html>
+      \`;
+
+      const win = createWindow({ title: "mix-blend-mode", width: 400, height: 300 });
+      win.on("ready", () => {
+        console.log("multiply=" + win.computedStyle("#multiply", "mix-blend-mode"));
+        console.log("overlay=" + win.computedStyle("#overlay", "mix-blend-mode"));
+        console.log("list-start");
+        console.log(win.paintList());
+        console.log("list-end");
+        win.close();
+      });
+      win.loadHTML(HTML);
+      run();
+      `);
+        const list = stdout.slice(stdout.indexOf("list-start"), stdout.indexOf("list-end"));
+        expect(value("multiply")).toBe("multiply");
+        expect(value("overlay")).toBe("overlay");
+        // The card paints normally; the multiply element and its overlay child are
+        // separate nested groups (the renderer composites each as a unit).
+        expect(list).toContain("layer blend=multiply");
+        expect(list).toContain("layer blend=overlay");
+        expect(list).toContain("end-layer");
+        expect(list).toContain("color=#ffffffff");
+        expect(list).toContain("color=#ff0000ff");
+        expect(list).toContain("color=#00ff00ff");
+        // The offscreen blend pipeline and its runtime-compiled shader must not
+        // fall back on this GPU backend.
+        expect(stderr).not.toContain("mix-blend-mode");
+    });
 });
 //# sourceMappingURL=gui-paint.test.js.map

package/dist/tests/e2e/gui-paint.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"gui-paint.test.js","sourceRoot":"","sources":["../../../tests/e2e/gui-paint.test.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"gui-paint.test.js","sourceRoot":"","sources":["../../../tests/e2e/gui-paint.test.ts"],"names":[],"mappings":"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"}

package/doc/gui/api.md

@@ -187,7 +187,7 @@ win.queryCount(selector)               // number of matching elements
 win.getBoundingClientRect(selector)    // { x, y, width, height } (border box, transformed)
 win.documentTree()                     // serialized DOM (debugging)
 win.layoutTree()                       // serialized layout boxes (debugging)
-win.paintCount()                       // number of shapes in the display list
+win.paintCount()                       // number of filled rectangles in the display list
 win.paintList()                        // serialized display list (debugging)
 win.inlineSvg(selector)                // serialized inline <svg>: { markup, width, height, shapes }
 win.measureText(text, fontSize?, family?)  // shaped advance width in pixels

package/doc/gui/canvas.md

@@ -206,7 +206,10 @@ engine's 9-argument form is destination-first) forms. A full affine transform
 (rotation/skew/scale) is honoured: the destination rectangle becomes a
 parallelogram and every device pixel is inverse-mapped to the source rectangle.
 `source` may be an `<img>` element (decoded through the image module), another
-`<canvas>`, an `OffscreenCanvas`, or an `ImageBitmap`. Sampling is bilinear when
+`<canvas>`, an `OffscreenCanvas`, an `ImageBitmap`, or — an engine extension — a
+string path/`data:` URL that is decoded directly, so an SVG or bitmap data URL
+can be drawn without an `<img>`. A vector source is rasterised at the destination
+size (`dw`/`dh`), keeping a scaled SVG crisp. Sampling is bilinear when
 `imageSmoothingEnabled` is `true` (the default) and nearest-neighbour when it is
 `false`.
 
@@ -230,7 +233,8 @@ from a microtask (the bytes are on `__xt_gui_blob_data`; there is no
 shape and `transferToImageBitmap()` snapshots the bitmap.
 
 CSS backgrounds: `background-image: url(...)` accepts a file path or a `data:`
-URL, so a canvas can be used as a CSS background by exporting it first
+URL (a raster payload or an SVG document, base64 or percent-encoded), so a
+canvas can be used as a CSS background by exporting it first
 (`element.style.backgroundImage = "url(" + canvas.toDataURL() + ")"`). An image
 layer is stretched to the element's border box; `background-size`,
 `background-position` and tiling are not modelled.

package/doc/gui/known-issues.md

@@ -59,18 +59,24 @@
   `pointer-events`, `@media` queries, generated content (`::before`/`::after`),
   multi-layer linear/radial backgrounds, `text-shadow`, `clip-path`
   (`inset`/`circle`/`ellipse`/`polygon`) and `filter` colour functions are
-  implemented. Known limits: `mix-blend-mode`, `background-clip`,
-  `background-position`/`size`/`repeat`, repeating gradients and `backdrop-filter`
-  compositing are not implemented (`backdrop-filter` parses and cascades, but
-  sampling the backdrop needs an offscreen layer, so it paints nothing);
+  implemented. Known limits: `background-clip`,
+  `background-position`/`size`/`repeat` and `backdrop-filter` compositing are not
+  implemented (`backdrop-filter` parses and cascades, but sampling the backdrop
+  needs an offscreen layer, so it paints nothing); `mix-blend-mode` and repeating
+  gradients are implemented (see [Rendering](./rendering.md)), but group
+  `opacity` is a per-shape alpha rather than a true group composite, and the
+  blend compositor is unavailable on the D3D12/DXIL backend, where groups fall
+  back to normal source-over painting;
   `filter: blur()` is a nine-tap per-shape spread rather than a true group blur,
   so overlapping descendants can darken; `drop-shadow` is approximated from box
   silhouettes; at most two nested `clip-path` shapes are intersected (deeper
   nesting keeps the outer two); and images/canvases are not colour-filtered
   except for the brightness/opacity tint the image shader can carry. Canvas
-  textures are sampled nearest-neighbour. Background gradients remain solid
-  bands (18 for linear, 32 concentric ellipses for radial), so a soft gradient
-  may show slight banding.
+  textures are sampled nearest-neighbour. A background linear gradient remains
+  solid bands (18 strips, 64 while repeating), so a large soft ramp may show
+  slight banding; a radial gradient is rasterised per pixel into a texture
+  (capped at 1024 px per edge, then stretched, so a hard stop in a very large
+  box comes out slightly soft).
 - **SVG is NanoSVG's subset.** SVG *files* (`<img src="logo.svg">`) and inline
   `<svg>` trees share the vendored NanoSVG parser/rasteriser
   (`runtime/ext_gui/svg.cpp`, `inline_svg.cpp`), which renders
@@ -78,9 +84,11 @@
   gradients and class-based `<style>` rules. `<text>`, `<use>`, filters, masks
   and clip paths are not rendered, and CSS applied by the document cascade does
   not reach inside the artwork (fill/stroke are SVG presentation attributes,
-  not CSS properties here). Vector art that needs those has to be rasterised
-  beforehand, drawn from boxes, or restricted to the supported syntax. See
-  [Media](./media.md#images-m6a).
+  not CSS properties here). An SVG whose only artwork comes from a filter
+  (`feTurbulence` noise, blur, …) therefore shows the unfiltered shapes — often
+  a solid rect — rather than the filter result. Vector art that needs those has
+  to be rasterised beforehand, drawn from boxes, or restricted to the supported
+  syntax. See [Media](./media.md#images-m6a).
 - **Rendering is still whole-document per change.** A DOM mutation recomputes
   the cascade and lays out the complete document again (there is no incremental
   subtree invalidation), and a change that only affects paint (a hover colour,

package/doc/gui/media.md

@@ -43,6 +43,15 @@ subtree, whose DOM nodes are serialized into a document first
   without limit.
 - The parse is cached per path; the parse and rasteriser state are released in
   `xt_svg_shutdown` (`xt_image_shutdown`).
+- `data:` URLs are decoded in memory and work wherever a path does:
+  `<img src>`, CSS `background-image` and `canvas.drawImage(url, …)`. Both the
+  `;base64` form and a percent-encoded (or plain) payload are accepted, and the
+  `base64` flag is case-insensitive. The MIME type only classifies the payload:
+  `image/svg+xml` (or an SVG sniff when the type is generic or absent) goes
+  through NanoSVG — a data-URL SVG is rasterised at the drawn size exactly like
+  an SVG file — while PNG/JPEG/BMP/GIF/TGA go through `stb_image`. NanoSVG's
+  subset still applies: an SVG whose only artwork comes from `<filter>`
+  (`feTurbulence`, …) decodes and lays out, but the filter itself is ignored.
 
 Document CSS styles the `<svg>` **box** — size, margins, background, borders,
 `transform`, opacity, `display` — exactly as it styles any other element. The
@@ -55,8 +64,8 @@ renderer caches one texture per markup-and-size pair, so a program that rewrites
 its artwork every frame keeps a texture per variant; prefer animating the box
 (`transform`, `opacity`) or swapping between a small set of documents.
 
-Still to do for images: CSS `background-image: url(...)`, `data:` URIs,
-`object-fit` and 9-slice borders.
+Still to do for images: `object-fit` and 9-slice borders. (CSS
+`background-image: url(...)` and `data:` URLs are supported.)
 
 Both kinds of SVG share NanoSVG's subset: `path`, `rect`, `circle`, `ellipse`,
 `line`, `polyline`, `polygon`, groups (`g`), `defs` with linear/radial gradients