@vesk/adapter 0.2.66 → 0.2.67

package/dist/image-pipeline.d.ts

@@ -1,3 +1,4 @@
-import type { ImageResult } from '@vesk/adapter/src/types';
+import type { ImageRef, ImageResult } from '@vesk/adapter/src/types';
+export declare function collectImageRefs(appDir: string): ImageRef[];
 export declare function optimizeImages(appDir: string, outDir: string): Promise<ImageResult[]>;
 //# sourceMappingURL=image-pipeline.d.ts.map

package/dist/image-pipeline.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-pipeline.d.ts","sourceRoot":"","sources":["../src/image-pipeline.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAY,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAyKrE,wBAAsB,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,WAAW,EAAE,CAAC,CAwD3F"}
+{"version":3,"file":"image-pipeline.d.ts","sourceRoot":"","sources":["../src/image-pipeline.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAoKrE,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,MAAM,GAAG,QAAQ,EAAE,CA6B3D;AAED,wBAAsB,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,WAAW,EAAE,CAAC,CAoE3F"}

package/dist/image-pipeline.js

@@ -99,22 +99,42 @@ async function ensureSharp() {
 async function processImage(srcPath, outDir, baseName) {
     const image = sharpFn ? sharpFn(srcPath) : null;
     if (!image) {
+        // Copy-only fallback. The emitted file MUST keep the source extension:
+        // `<Image>`'s srcset is `${base}-${w}w${ext}`, so writing `hero-640w` with
+        // no extension left every copy-only URL 404ing.
         const original = readFileSync(srcPath);
+        const ext = extname(srcPath);
+        const written = [];
         for (const w of OUTPUT_WIDTHS) {
-            const outputPath = resolve(outDir, `${baseName}-${w}w`);
+            const outputPath = resolve(outDir, `${baseName}-${w}w${ext}`);
             mkdirSync(dirname(outputPath), { recursive: true });
             writeFileSync(outputPath, original);
+            written.push(outputPath);
         }
-        return [];
+        return written;
     }
     const meta = await image.metadata();
     const originalWidth = meta.width || 1920;
     const generated = [];
+    // `<Image>` emits a srcset entry for EVERY configured width, whatever the
+    // source's real size — it has no way to know what was generated. Skipping
+    // widths above the source's width therefore left real URLs 404ing (a 400px
+    // photo produced none of the 640w+ entries the browser would pick).
+    //
+    // So emit every configured width, and for any width at or above the
+    // source's own, emit the ORIGINAL bytes rather than enlarging: the URL
+    // resolves, and the browser gets a smaller image than it asked for instead
+    // of a 404.
     for (const w of OUTPUT_WIDTHS) {
-        if (w > originalWidth)
+        const base = `${baseName}-${w}w`;
+        if (w >= originalWidth) {
+            const copyPath = resolve(outDir, `${base}${extname(srcPath)}`);
+            mkdirSync(dirname(copyPath), { recursive: true });
+            writeFileSync(copyPath, readFileSync(srcPath));
+            generated.push(copyPath);
             continue;
+        }
         const resized = image.clone().resize({ width: w, withoutEnlargement: true });
-        const base = `${baseName}-${w}w`;
         const jpgPath = resolve(outDir, `${base}${extname(srcPath)}`);
         mkdirSync(dirname(jpgPath), { recursive: true });
         await resized.toFile(jpgPath);
@@ -127,7 +147,7 @@ async function processImage(srcPath, outDir, baseName) {
     }
     return generated;
 }
-function collectImageRefs(appDir) {
+export function collectImageRefs(appDir) {
     const refs = [];
     function walk(dir) {
         let entries;
@@ -145,9 +165,13 @@ function collectImageRefs(appDir) {
                     continue;
                 walk(full);
             }
-            else if (entry === 'page.vsk') {
+            else if (entry.endsWith('.vsk')) {
+                // Scan EVERY .vsk file, not just page.vsk. An `<Image>` living in a
+                // shared component or a layout is just as real a reference, and
+                // restricting the walk to page.vsk meant those images were never
+                // processed — their srcsets 404'd with no build-time complaint.
                 const src = readFileSync(full, 'utf-8');
-                const imgRegex = /<Image\s+src=["']([^"']+)["']/g;
+                const imgRegex = /<Image\s[^>]*src=["']([^"']+)["']/g;
                 let m;
                 while ((m = imgRegex.exec(src)) !== null) {
                     refs.push({ source: full, src: m[1] });
@@ -159,8 +183,15 @@ function collectImageRefs(appDir) {
     return refs;
 }
 export async function optimizeImages(appDir, outDir) {
-    const imageOutDir = resolve(outDir, 'static', 'images');
-    mkdirSync(imageOutDir, { recursive: true });
+    // Variants must land where the emitted URLs actually resolve.
+    //
+    // `<Image src="/hero.png" />` renders `srcset="/hero-640w.png 640w, …"` —
+    // site-root-relative, with no directory prefix. The prod server serves the
+    // site root from `<outDir>/static/public`, so that is exactly where each
+    // variant belongs. They used to be written to `<outDir>/static/images`,
+    // which nothing serves: every `<Image>` srcset URL 404'd in a real build
+    // while the build itself reported success.
+    mkdirSync(resolve(outDir, 'static', 'public'), { recursive: true });
     const refs = collectImageRefs(appDir);
     if (refs.length === 0) {
         console.error('vesk images: no <Image> refs found');
@@ -198,6 +229,11 @@ export async function optimizeImages(appDir, outDir) {
             continue;
         }
         const baseName = ref.src.replace(/^\//, '').replace(extname(ref.src), '');
+        // `baseName` already carries the source's subdirectory (`/photos/hero.png`
+        // → `photos/hero`), and processImage mkdir's the parent of each output —
+        // so the destination stays the site root and the nesting is not doubled.
+        const imageOutDir = resolve(outDir, 'static', 'public');
+        mkdirSync(imageOutDir, { recursive: true });
         const files = await processImage(srcPath, imageOutDir, baseName);
         results.push({ src: ref.src, baseName, files, widths: OUTPUT_WIDTHS });
         console.error(`vesk images: ${ref.src} → ${files.length} variants`);

package/dist/image-pipeline.test-helpers.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Test helper exposing the srcset URL list that `collectImageRefs` /
+ * `optimizeImages` must make reachable.
+ *
+ * `<Image>`'s `generateSrcset` lives inside the runtime package's private
+ * scope, so the pipeline tests derive the same URLs here rather than
+ * duplicating the rule by hand in every assertion.
+ */
+export declare function generateSrcsetForTest(src: string, widths: number[]): Array<{
+    url: string;
+    descriptor: string;
+}>;
+//# sourceMappingURL=image-pipeline.test-helpers.d.ts.map

package/dist/image-pipeline.test-helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-pipeline.test-helpers.d.ts","sourceRoot":"","sources":["../src/image-pipeline.test-helpers.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CACpC,GAAG,EAAE,MAAM,EACX,MAAM,EAAE,MAAM,EAAE,GACd,KAAK,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,MAAM,CAAA;CAAE,CAAC,CAK5C"}

package/dist/image-pipeline.test-helpers.js

@@ -0,0 +1,15 @@
+/**
+ * Test helper exposing the srcset URL list that `collectImageRefs` /
+ * `optimizeImages` must make reachable.
+ *
+ * `<Image>`'s `generateSrcset` lives inside the runtime package's private
+ * scope, so the pipeline tests derive the same URLs here rather than
+ * duplicating the rule by hand in every assertion.
+ */
+export function generateSrcsetForTest(src, widths) {
+    if (!src || widths.length === 0)
+        return [];
+    const ext = src.lastIndexOf('.') > src.lastIndexOf('/') ? src.slice(src.lastIndexOf('.')) : '';
+    const base = ext ? src.slice(0, -ext.length) : src;
+    return widths.map(w => ({ url: `${base}-${w}w${ext}`, descriptor: `${w}w` }));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vesk/adapter",
-  "version": "0.2.66",
+  "version": "0.2.67",
   "type": "module",
   "description": "Vesk adapter — builds deployable .vesk/ output for Deno and Node serverless",
   "main": "./dist/index.js",
@@ -23,9 +23,9 @@
     "sharp": "^0.35.3"
   },
   "dependencies": {
-    "@vesk/compiler": "^0.2.66",
-    "@vesk/runtime": "^0.2.66",
-    "@vesk/types": "^0.2.66"
+    "@vesk/compiler": "^0.2.67",
+    "@vesk/runtime": "^0.2.67",
+    "@vesk/types": "^0.2.67"
   },
   "devDependencies": {
     "@types/ws": "^8.18.1",