@vesk/vesk-cli 0.2.40 → 0.2.42

package/dist/cli.js

@@ -2283,6 +2283,16 @@ function runInHydrateBlock(fn) {
     throw error;
   }
 }
+function recordClaim(root3, record) {
+  claimRegistry.set(record.el, record);
+  if (!root3) return;
+  const records = walkerClaimRecords.get(root3);
+  if (records) records.push(record);
+  else walkerClaimRecords.set(root3, [record]);
+}
+function isAdopted(el) {
+  return claimRegistry.get(el)?.state === "adopted";
+}
 function reportHydrationIssue(issue) {
   if (!__mismatchHandler) return;
   try {
@@ -2304,13 +2314,15 @@ function reportMiss(kind, detail, loud) {
   }
   if (loud) devWarn(`${kind}: ${detail}`);
 }
-function stampClaimed(el) {
-  if (__hydrateDevMode) {
-    try {
-      el.setAttribute(CLAIMED_ATTR, "");
-    } catch {
-    }
-  }
+function recordAdopted(root3, el, expectedTag) {
+  recordClaim(root3, {
+    state: "adopted",
+    el,
+    owner: root3,
+    expectedTag,
+    actualTag: el.tagName.toLowerCase(),
+    detached: false
+  });
 }
 function stripDirectTextNodes(el) {
   let text = "";
@@ -2361,8 +2373,8 @@ function scanTwins(container) {
     let a = false;
     let b = false;
     try {
-      a = el.hasAttribute(CLAIMED_ATTR);
-      b = prev.hasAttribute(CLAIMED_ATTR);
+      a = isAdopted(el);
+      b = isAdopted(prev);
     } catch {
       continue;
     }
@@ -2405,6 +2417,30 @@ function auditHydration(container) {
     }
     if (!sample && container.outerHTML) sample = String(container.outerHTML).slice(0, 800);
   }
+  const structuralRecords = [];
+  const seenRecords = /* @__PURE__ */ new Set();
+  const collectWalkerRecords = (el) => {
+    const records = walkerClaimRecords.get(el);
+    if (records) {
+      for (const record of records) {
+        if (!seenRecords.has(record)) {
+          seenRecords.add(record);
+          structuralRecords.push(record);
+        }
+      }
+    }
+    for (let i = 0; i < el.children.length; i++) collectWalkerRecords(el.children[i]);
+  };
+  collectWalkerRecords(container);
+  const structuralGhosts = structuralRecords.filter((record) => record.state === "ghost");
+  if (structuralGhosts.length > 0) {
+    unclaimed += structuralGhosts.length;
+    if (orphanNames.length < 5) {
+      orphanNames.push(
+        `${structuralGhosts.length} structural hydration ghost(s) (${structuralGhosts.slice(0, 3).map((record) => `<${record.actualTag}> expected <${record.expectedTag}>`).join(", ")})`
+      );
+    }
+  }
   const twinRes = scanTwins(container);
   const issues = [];
   if (unclaimed > 0) {
@@ -2432,6 +2468,14 @@ function auditHydration(container) {
       } catch {
       }
     }
+    for (const record of structuralGhosts) {
+      try {
+        if (record.detached || !record.owner || record.el.parentNode !== record.owner) continue;
+        record.el.remove();
+        record.detached = true;
+      } catch {
+      }
+    }
   }
   if (__mismatchHandler) {
     for (const issue of issues) {
@@ -2462,7 +2506,7 @@ ${report.sample}`
 }
 function underClaimedAncestor(el, container) {
   for (let n = el; n && n !== container; n = n.parentElement) {
-    if (n.nodeType === 1 && n.hasAttribute(CLAIMED_ATTR)) return true;
+    if (n.nodeType === 1 && isAdopted(n)) return true;
   }
   return false;
 }
@@ -2523,7 +2567,7 @@ function checkMarkerIdentity(marker, el) {
     }
   }
 }
-function adoptElement(marker, tag) {
+function adoptElement(root3, marker, tag) {
   const el = marker.nextElementSibling;
   if (!el) {
     marker.remove();
@@ -2534,10 +2578,10 @@ function adoptElement(marker, tag) {
   marker.remove();
   stripDirectTextNodes(el);
   captureSsrElementChildren(el);
-  stampClaimed(el);
+  recordAdopted(root3, el, tag || el.tagName.toLowerCase());
   return el;
 }
-function adoptElementRaw(marker, tag) {
+function adoptElementRaw(root3, marker, tag) {
   const el = marker.nextElementSibling;
   if (!el) {
     marker.remove();
@@ -2547,7 +2591,7 @@ function adoptElementRaw(marker, tag) {
   checkMarkerIdentity(marker, el);
   marker.remove();
   captureSsrElementChildren(el);
-  stampClaimed(el);
+  recordAdopted(root3, el, tag || el.tagName.toLowerCase());
   return el;
 }
 function createHydrateWalker(container, markerList) {
@@ -2752,14 +2796,15 @@ function hydrateOnInteraction(container, componentFn, props, options = {}) {
     }
   };
 }
-var __hydrateDevMode, CLAIMED_ATTR, __hydrateStrict, __mismatchHandler, _SHOW_COMMENT, _FILTER_ACCEPT, _FILTER_SKIP, WalkerEngine, StructuralWalker;
+var __hydrateDevMode, claimRegistry, walkerClaimRecords, __hydrateStrict, __mismatchHandler, _SHOW_COMMENT, _FILTER_ACCEPT, _FILTER_SKIP, WalkerEngine, StructuralWalker;
 var init_hydrate = __esm({
   "../runtime/src/hydrate.ts"() {
     "use strict";
     init_ripple_runtime();
     init_ripple_blocks();
     __hydrateDevMode = true;
-    CLAIMED_ATTR = "data-vsk-claimed";
+    claimRegistry = /* @__PURE__ */ new WeakMap();
+    walkerClaimRecords = /* @__PURE__ */ new WeakMap();
     __hydrateStrict = false;
     __mismatchHandler = null;
     _SHOW_COMMENT = 128;
@@ -2844,7 +2889,7 @@ var init_hydrate = __esm({
             break;
           }
           this.idx++;
-          const adopted = adoptElement(tm.comment, tag);
+          const adopted = adoptElement(this.root, tm.comment, tag);
           if (adopted === null) {
             tm.state = "claimed";
             break;
@@ -2896,7 +2941,7 @@ ${String(this.root.outerHTML).slice(0, 800)}` : ""),
             break;
           }
           this.idx++;
-          const adopted = adoptElementRaw(tm.comment, tag);
+          const adopted = adoptElementRaw(this.root, tm.comment, tag);
           if (adopted === null) {
             tm.state = "claimed";
             break;
@@ -2986,7 +3031,7 @@ ${String(this.root.outerHTML).slice(0, 800)}` : ""),
         tm.comment.remove();
         stripDirectTextNodes(el);
         captureSsrElementChildren(el);
-        stampClaimed(el);
+        recordAdopted(this.root, el, el.tagName.toLowerCase());
         return { el };
       }
       claimByKey(key, options) {
@@ -3160,12 +3205,37 @@ ${String(this.root.outerHTML).slice(0, 800)}` : ""),
           const el = this.els[target];
           if (tag && el.tagName.toLowerCase() !== tag) {
             this.idx = this.advancePastSkippable(target + 1);
+            const ghost = {
+              state: "ghost",
+              el,
+              owner: this.root,
+              expectedTag: tag || "div",
+              actualTag: el.tagName.toLowerCase(),
+              detached: false
+            };
+            recordClaim(this.root, ghost);
+            if (this.root && el.parentNode === this.root) {
+              try {
+                el.remove();
+                ghost.detached = true;
+              } catch {
+              }
+            }
+            const fresh2 = document.createElement(tag || "div");
+            recordClaim(this.root, {
+              state: "fresh",
+              el: fresh2,
+              owner: this.root,
+              expectedTag: tag || "div",
+              actualTag: fresh2.tagName.toLowerCase(),
+              detached: false
+            });
             reportMiss(
               "tag-mismatch",
-              `descriptor wanted <${tag}> but the SSR slot holds <${el.tagName.toLowerCase()}>; consuming one slot and rendering fresh.`,
+              `descriptor wanted <${tag}> but the SSR slot holds <${el.tagName.toLowerCase()}>; consumed one slot, detached the local ghost, and rendered fresh.`,
               false
             );
-            return document.createElement(tag || "div");
+            return fresh2;
           }
           if (this.adopted.has(el)) {
             target = this.advancePastSkippable(target + 1);
@@ -3175,10 +3245,19 @@ ${String(this.root.outerHTML).slice(0, 800)}` : ""),
           this.adopted.add(el);
           if (!raw2) stripDirectTextNodes(el);
           captureSsrElementChildren(el);
-          stampClaimed(el);
+          recordAdopted(this.root, el, tag || el.tagName.toLowerCase());
           return el;
         }
         this.idx = this.els.length;
+        const fresh = document.createElement(tag || "div");
+        recordClaim(this.root, {
+          state: "fresh",
+          el: fresh,
+          owner: this.root,
+          expectedTag: tag || "div",
+          actualTag: fresh.tagName.toLowerCase(),
+          detached: false
+        });
         reportMiss(
           "exhausted",
           `hydration claim missed <${tag || "element"}>; the client rendered more or different content than SSR.`,
@@ -3187,7 +3266,7 @@ ${String(this.root.outerHTML).slice(0, 800)}` : ""),
           // nodes) — telemetry-only, mirroring the marker engine.
           false
         );
-        return document.createElement(tag || "div");
+        return fresh;
       }
       nextElement(tag, skipK = 0) {
         return this.claimAt(tag, skipK, false);
@@ -3236,7 +3315,7 @@ ${String(this.root.outerHTML).slice(0, 800)}` : ""),
           this.adopted.add(el);
           stripDirectTextNodes(el);
           captureSsrElementChildren(el);
-          stampClaimed(el);
+          recordAdopted(this.root, el, el.tagName.toLowerCase());
           return { el };
         }
         this.idx = this.els.length;
@@ -23367,7 +23446,8 @@ function Form(props, registry, hydrate) {
     return `<form ${attrStr}>${children || ""}</form>`;
   }
   if (hydrate && hydrate.nextElement) {
-    let form2 = hydrate.nextElement("form");
+    const skipK = typeof hydrate.takeSkipK === "function" ? hydrate.takeSkipK() : 0;
+    let form2 = hydrate.nextElement("form", skipK);
     if (form2 && !form2.parentNode && hydrate.root) {
       const existing = hydrate.root.querySelector("form");
       if (existing) form2 = existing;
@@ -29213,7 +29293,7 @@ function emitComponentCall(ctx2, node, tracked2, effectsVar, parentVar, compPref
       const frag = ctx2.n();
       const wipeMount = ctx2.linkNames.has(node.componentName);
       const savedHydrate = ctx2.hydrate;
-      if (wipeMount) ctx2.hydrate = false;
+      if (wipeMount || ctx2.selfClaimNames.has(node.componentName)) ctx2.hydrate = false;
       ctx2.push(`const ${frag} = (() => { const $f = document.createDocumentFragment();`);
       const savedEffects = ctx2.effects;
       ctx2.effects = [];
@@ -32694,6 +32774,7 @@ __export(image_pipeline_exports, {
   optimizeImages: () => optimizeImages
 });
 import { mkdirSync as mkdirSync8, writeFileSync as writeFileSync9, readFileSync as readFileSync18, existsSync as existsSync18, readdirSync as readdirSync4, statSync as statSync9 } from "node:fs";
+import { spawnSync } from "node:child_process";
 import { resolve as resolve16, extname as extname5, dirname as dirname12 } from "node:path";
 async function processImage(srcPath, outDir, baseName) {
   const image = sharpFn ? sharpFn(srcPath) : null;
@@ -32808,8 +32889,17 @@ var init_image_pipeline = __esm({
     FORMATS = ["webp", "avif"];
     sharpFn = null;
     try {
-      const mod = await import("sharp");
-      sharpFn = mod.default;
+      const probe = spawnSync(process.execPath, [
+        "--input-type=module",
+        "-e",
+        "import sharp from 'sharp'; await sharp({ create: { width: 2, height: 2, channels: 3, background: 'red' } }).png().toBuffer();"
+      ], { stdio: "ignore" });
+      if (probe.status === 0) {
+        const mod = await import("sharp");
+        sharpFn = mod.default;
+      } else {
+        console.warn("vesk images: sharp native probe failed; using copy-only image pipeline");
+      }
     } catch {
     }
   }
@@ -37917,9 +38007,6 @@ function compileVskCodegen(source, opts = {}) {
   }
   return { code, mappings: g2.mappings, styleRegions: g2.styleRegions, errors: [] };
 }
-function vskToTsx(source) {
-  return compileVskCodegen(source).code;
-}
 function isTypeDecl(stmt) {
   return stmt.type === "TSInterfaceDeclaration" || stmt.type === "TSTypeAliasDeclaration" || stmt.type === "ExportNamedDeclaration" && (stmt.declaration?.type === "TSInterfaceDeclaration" || stmt.declaration?.type === "TSTypeAliasDeclaration");
 }
@@ -38120,7 +38207,7 @@ function createTypecheckHost(projectRoot, appDir, vskFiles) {
       } else if (file.endsWith(".css.d.ts")) {
         content = "";
       } else if (vskFiles.has(file)) {
-        content = vskToTsx(vskFiles.get(file));
+        content = compileVskCodegen(vskFiles.get(file)).code;
       } else if (ts8.sys.fileExists(file)) {
         content = ts8.sys.readFile(file);
       }
@@ -38161,7 +38248,7 @@ function createTypecheckHost(projectRoot, appDir, vskFiles) {
       if (file.endsWith(".css.d.ts"))
         return "";
       if (vskFiles.has(file))
-        return vskToTsx(vskFiles.get(file));
+        return compileVskCodegen(vskFiles.get(file)).code;
       return ts8.sys.readFile(file);
     },
     writeFile: () => {
@@ -38211,6 +38298,35 @@ function createTypecheckHost(projectRoot, appDir, vskFiles) {
   };
   return host;
 }
+function mapGeneratedOffset(mappings, generatedOffset) {
+  let nearest = null;
+  for (const mapping of mappings) {
+    for (let i = 0; i < mapping.generatedOffsets.length; i++) {
+      const generated = mapping.generatedOffsets[i];
+      const length = mapping.lengths[i] ?? 0;
+      const source = mapping.sourceOffsets[i];
+      if (generated <= generatedOffset && generated + length >= generatedOffset) {
+        return source + (generatedOffset - generated);
+      }
+      if (generated <= generatedOffset && (!nearest || generated > nearest.generated)) {
+        nearest = { source, generated, length };
+      }
+    }
+  }
+  return nearest ? nearest.source + Math.min(nearest.length, Math.max(0, generatedOffset - nearest.generated)) : null;
+}
+function sourcePosition(source, offset2) {
+  const bounded = Math.max(0, Math.min(offset2, source.length));
+  let line = 1;
+  let lineStart = 0;
+  for (let i = 0; i < bounded; i++) {
+    if (source.charCodeAt(i) === 10) {
+      line++;
+      lineStart = i + 1;
+    }
+  }
+  return { line, character: bounded - lineStart + 1 };
+}
 function typecheckProject(projectRoot, opts = {}) {
   const appDir = opts.appDir ?? join25(projectRoot, "app");
   const vskFiles = /* @__PURE__ */ new Map();
@@ -38291,12 +38407,28 @@ function typecheckProject(projectRoot, opts = {}) {
     }
     if (!rootSet.has(filePath) && !vskSet.has(filePath))
       continue;
-    const pos = file.getLineAndCharacterOfPosition(diag.start ?? 0);
+    let sourceOffset = diag.start ?? 0;
+    let line;
+    let column;
+    if (vskFiles.has(filePath)) {
+      const source = vskFiles.get(filePath);
+      const generated = compileVskCodegen(source);
+      const mapped = mapGeneratedOffset(generated.mappings, sourceOffset);
+      if (mapped !== null)
+        sourceOffset = mapped;
+      const pos = sourcePosition(source, sourceOffset);
+      line = pos.line;
+      column = pos.character;
+    } else {
+      const pos = file.getLineAndCharacterOfPosition(diag.start ?? 0);
+      line = pos.line + 1;
+      column = pos.character + 1;
+    }
     const code = typeof diag.code === "number" ? `TS${diag.code}` : String(diag.code);
     errors.push({
       file: relative8(projectRoot, filePath),
-      line: pos.line + 1,
-      column: pos.character + 1,
+      line,
+      column,
       code,
       message: ts8.flattenDiagnosticMessageText(diag.messageText, "\n")
     });
@@ -43708,7 +43840,7 @@ function emitComponentCall2(ctx2, node, tracked2, effectsVar, parentVar, compPre
       const frag = ctx2.n();
       const wipeMount = ctx2.linkNames.has(node.componentName);
       const savedHydrate = ctx2.hydrate;
-      if (wipeMount)
+      if (wipeMount || ctx2.selfClaimNames.has(node.componentName))
         ctx2.hydrate = false;
       ctx2.push(`const ${frag} = (() => { const $f = document.createDocumentFragment();`);
       const savedEffects = ctx2.effects;
@@ -52839,7 +52971,7 @@ function renderDevErrorPage(payload, opts) {
 }
 
 // src/build-packages.ts
-import { spawnSync } from "node:child_process";
+import { spawnSync as spawnSync2 } from "node:child_process";
 import { cpSync as cpSync2, existsSync as existsSync40, mkdirSync as mkdirSync18, readFileSync as readFileSync36, readdirSync as readdirSync11, statSync as statSync20, writeFileSync as writeFileSync20 } from "node:fs";
 import { createRequire as createRequire6 } from "node:module";
 import { dirname as dirname25, join as join23, resolve as resolve36 } from "node:path";
@@ -52914,7 +53046,7 @@ function buildPackages(force = false) {
     if (!force && !distStale(pkgDir, cfg.entry)) continue;
     console.log(`[build] ${cfg.name} -> tsc`);
     const tscBin = require2.resolve("typescript/bin/tsc");
-    const result = spawnSync(process.execPath, [tscBin, "-p", join23(pkgDir, "tsconfig.build.json")], {
+    const result = spawnSync2(process.execPath, [tscBin, "-p", join23(pkgDir, "tsconfig.build.json")], {
       stdio: "inherit"
     });
     if (result.status !== 0) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vesk/vesk-cli",
-  "version": "0.2.40",
+  "version": "0.2.42",
   "type": "module",
   "description": "Vesk — compiler-first framework for the post-VDOM web. vesk dev, vesk build.",
   "bin": {
@@ -8,10 +8,10 @@
   },
   "main": "./dist/cli.js",
   "dependencies": {
-    "@vesk/adapter": "^0.2.40",
-    "@vesk/compiler": "^0.2.40",
-    "@vesk/plugin-tailwind": "^0.2.40",
-    "@vesk/runtime": "^0.2.40",
+    "@vesk/adapter": "^0.2.42",
+    "@vesk/compiler": "^0.2.42",
+    "@vesk/plugin-tailwind": "^0.2.42",
+    "@vesk/runtime": "^0.2.42",
     "esrap": "^2.3.0",
     "typescript": "^5.8.0",
     "ws": "^8.18.0",