npm - lavish-axi - Versions diffs - 0.1.47 → 0.1.49 - Mend

lavish-axi 0.1.47 → 0.1.49

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/README.md CHANGED Viewed

@@ -162,6 +162,8 @@ pnpm link
 - **Portable artifacts** - The artifact runs in an iframe while Lavish injects a small SDK for annotations, snapshots, feedback controls, and render-time layout checks.
   Lavish does not inject any design system, so the saved HTML file renders identically whether you open it through `lavish-axi` or directly in a browser.
   Run `lavish-axi design` for the single source of agent-facing design guidance and optional CDN or Mermaid snippets.
+- **Self-paint warning** - `lavish-axi <html-file>`, `export`, and `share` run a render-free check for artifacts missing an explicit page background and return a one-line `self_paint_warning`.
+  The check fails open - any stylesheet link, `@import`, Tailwind runtime script, `color-scheme`, or `html`/`body`/`:root` background signal suppresses it - and it never blocks the open.
 - **Open-time layout gate** - The browser chrome masks an artifact only while the real in-iframe audit waits for fonts and final geometry.
   The first completed check always reveals the artifact, whatever it found; the gate never holds the review hostage waiting for a repair.
   The user can click **Show anyway**, and a bounded safety timeout fails open when no check has completed.

package/dist/cli.mjs CHANGED Viewed

@@ -447,7 +447,7 @@ function createDesignOutput() {
       playbooks: listPlaybooks()
     },
     design: {
-      summary: "Use this Lavish CDN fallback only if (1) the user gave no design direction and (2) you already inspected the project the artifact is about and found no design system or style conventions to match. If you have not checked the subject project yet, check first. Lavish does not auto-inject any design system; artifacts stay portable HTML. " + DESIGN_PRIORITY_RULE + " Paste the CDN snippet below into your `<head>`.",
+      summary: "Use this Lavish CDN fallback only if (1) the user gave no design direction and (2) you already inspected the project the artifact is about and found no design system or style conventions to match. If you have not checked the subject project yet, check first. Lavish does not auto-inject any design system; artifacts stay portable HTML. Paint an explicit page background and readable text. " + DESIGN_PRIORITY_RULE + " Paste the CDN snippet below into your `<head>`.",
       cdn_snippet: DESIGN_CDN_SNIPPET,
       cdn_urls: DESIGN_CDN_URLS,
       versions: { tailwind: TAILWIND_BROWSER_VERSION, daisyui: DAISYUI_VERSION },
@@ -4450,11 +4450,53 @@ function linkFailureReason(error) {
   return message || "link creation failed";
 }
+// src/self-paint.js
+var ROOT_TAG_RE = /<(?:html|body)\b([^>]*)>/gi;
+var STYLE_BLOCK_RE = /<style\b[^>]*>([\s\S]*?)<\/style>/gi;
+var CSS_RULE_RE = /([^{}]+)\{([^{}]*)\}/g;
+var ROOT_SELECTOR_TOKEN_RE = /(^|[\s,>~+])(html|body|:root|\*)(?![\w-])/i;
+var SELF_PAINT_WARNING = "This artifact never paints its own page surface: no background on html/body/:root, no bg-* class or data-theme on html/body, and no stylesheet that could set one. Lavish injects no design system, so text that assumes a dark or light host surface can render invisible. Set an explicit background and readable text.";
+function analyzeSelfPaint(html) {
+  const source = typeof html === "string" ? html : "";
+  if (/<link\b[^>]*\brel\s*=\s*["']?[^"'>]*stylesheet/i.test(source)) {
+    return { painted: true, signal: "stylesheet-link" };
+  }
+  if (/<script\b[^>]*\bsrc\s*=\s*["']?[^"'>]*tailwind/i.test(source)) {
+    return { painted: true, signal: "tailwind-runtime" };
+  }
+  if (/<meta\b[^>]*\bname\s*=\s*["']?color-scheme/i.test(source)) {
+    return { painted: true, signal: "color-scheme" };
+  }
+  for (const [, attrs] of source.matchAll(ROOT_TAG_RE)) {
+    if (/\bdata-theme\s*=/i.test(attrs)) return { painted: true, signal: "data-theme" };
+    const className = attrValue(attrs, "class");
+    if (className && /(^|[^\w-])bg-/i.test(className)) return { painted: true, signal: "background-class" };
+    const style = attrValue(attrs, "style");
+    if (style && /background/i.test(style)) return { painted: true, signal: "inline-background" };
+    if (style && /color-scheme\s*:/i.test(style)) return { painted: true, signal: "color-scheme" };
+  }
+  for (const [, css] of source.matchAll(STYLE_BLOCK_RE)) {
+    const stripped = css.replace(/\/\*[\s\S]*?\*\//g, "");
+    if (/@import\b/i.test(stripped)) return { painted: true, signal: "css-import" };
+    if (/color-scheme\s*:/i.test(stripped)) return { painted: true, signal: "color-scheme" };
+    for (const [, selector, declarations] of stripped.matchAll(CSS_RULE_RE)) {
+      if (!/background/i.test(declarations)) continue;
+      if (ROOT_SELECTOR_TOKEN_RE.test(selector)) return { painted: true, signal: "root-background-rule" };
+    }
+  }
+  return { painted: false, signal: null };
+}
+function attrValue(attrs, name) {
+  const match = attrs.match(new RegExp(`\\b${name}\\s*=\\s*(?:"([^"]*)"|'([^']*)'|([^\\s>]+))`, "i"));
+  if (!match) return null;
+  return match[1] ?? match[2] ?? match[3] ?? null;
+}
 // src/server.js
 import crypto4 from "node:crypto";
 import { EventEmitter } from "node:events";
 import { existsSync as existsSync2 } from "node:fs";
-import { readFile as readFile4 } from "node:fs/promises";
+import { readFile as readFile4, realpath as realpath3 } from "node:fs/promises";
 import { homedir } from "node:os";
 import path6 from "node:path";
 import { fileURLToPath as fileURLToPath3 } from "node:url";
@@ -7769,7 +7811,7 @@ async function serve({
         return;
       }
       const root = path6.dirname(session.file);
-      const file = resolveArtifactAsset(root, assetPath);
+      const file = await resolveArtifactAsset(root, assetPath);
       if (!file) {
         res.status(403).send("Forbidden");
         return;
@@ -7894,9 +7936,9 @@ data: ${JSON.stringify({ state: computePresence(req.params.key, activePolls, del
     res.setHeader("cache-control", "no-store");
     res.type("html").send(createWhiteboardFrameHtml(createWhiteboardChannelToken(whiteboardChannelSecret)));
   });
-  app.get(/^\/whiteboard-assets\/(.+)$/, (req, res, next) => {
+  app.get(/^\/whiteboard-assets\/(.+)$/, async (req, res, next) => {
     try {
-      const file = resolveArtifactAsset(whiteboardAssetsDir, req.params[0]);
+      const file = await resolveArtifactAsset(whiteboardAssetsDir, req.params[0]);
       if (!file) {
         res.status(403).send("Forbidden");
         return;
@@ -8192,13 +8234,32 @@ function optionalBodyString(value) {
   const trimmed = String(value ?? "").trim();
   return trimmed || void 0;
 }
-function resolveArtifactAsset(root, assetPath) {
+async function resolveArtifactAsset(root, assetPath) {
   const file = path6.resolve(root, assetPath);
   const relative = path6.relative(root, file);
   if (relative.startsWith("..") || path6.isAbsolute(relative)) {
     return null;
   }
-  return file;
+  let real;
+  try {
+    real = await realpath3(file);
+  } catch (error) {
+    if (error?.code === "ENOENT" || error?.code === "ENOTDIR") {
+      return file;
+    }
+    throw error;
+  }
+  let realRoot;
+  try {
+    realRoot = await realpath3(root);
+  } catch {
+    realRoot = path6.resolve(root);
+  }
+  const relativeReal = path6.relative(realRoot, real);
+  if (relativeReal === ".." || relativeReal.startsWith(`..${path6.sep}`) || path6.isAbsolute(relativeReal)) {
+    return null;
+  }
+  return real;
 }
 async function watchSession(session, watchers, events, logEvent, reloadDebounceMs = () => RELOAD_DEBOUNCE_MS) {
   if (watchers.has(session.key)) {
@@ -8674,7 +8735,7 @@ var POLL_WAKE_PATH_RULES = Object.freeze([
 ]);
 var POLL_SEND_AND_END_RULE = "`Send & End` ends the session. Its final feedback is still delivered once. After that response, polling stops, and the agent must not reopen the session uninvited.";
 var CODEX_POLL_WAKE_PATH_GUIDANCE = "Codex detected: completed background tasks may not resume Codex automatically, so keep the poll attached to the active turn.";
-var VERSION = "0.1.47";
+var VERSION = "0.1.49";
 function detectInvokingAgent(env = process.env) {
   return ["CODEX_SANDBOX", "CODEX_THREAD_ID"].some((key) => Object.hasOwn(env, key)) ? "codex" : "generic";
 }
@@ -8818,10 +8879,12 @@ function createPlaybookOutput(args) {
   }
   return { playbook };
 }
-function createOpenOutput({ file, url, status, agent = "generic" }) {
+function createOpenOutput({ file, url, status, agent = "generic", selfPaintWarning = void 0 }) {
+  const selfPaintPrefix = selfPaintWarning ? `First fix the unpainted page surface flagged in self_paint_warning and save - Lavish live-reloads the artifact automatically, so you do not need to re-run \`lavish-axi ${file}\`. ` : "";
   return {
     session: { file, url, status },
-    next_step: `Do not respond to the user just yet. Now you must run \`lavish-axi poll ${file}\`. This command long-polls until the user sends feedback or ends the session, and it stays silent the whole time - that is normal, never kill it. Layout issues the browser detects do not return this poll; they wait in the user's Layout issues inbox until the user queues them, then arrive as an ordinary tag "layout-warnings" prompt. Do not pass --timeout-ms during normal agent use. ${pollExecutionGuidance({ agent })} After applying feedback, run \`lavish-axi poll ${file} --agent-reply "<message for the user>"\` without --timeout-ms to show your response in Lavish Editor and wait for more feedback. If the user ends the session, stop polling and do not reopen it by re-running \`lavish-axi ${file}\` unless the user asks for further review or something genuinely important needs their visual attention - deliver routine updates directly in this conversation instead. When reopening is warranted, run \`lavish-axi ${file} --reopen\`.`
+    ...selfPaintWarning ? { self_paint_warning: selfPaintWarning } : {},
+    next_step: `${selfPaintPrefix}Do not respond to the user just yet. Now you must run \`lavish-axi poll ${file}\`. This command long-polls until the user sends feedback or ends the session, and it stays silent the whole time - that is normal, never kill it. Layout issues the browser detects do not return this poll; they wait in the user's Layout issues inbox until the user queues them, then arrive as an ordinary tag "layout-warnings" prompt. Do not pass --timeout-ms during normal agent use. ${pollExecutionGuidance({ agent })} After applying feedback, run \`lavish-axi poll ${file} --agent-reply "<message for the user>"\` without --timeout-ms to show your response in Lavish Editor and wait for more feedback. If the user ends the session, stop polling and do not reopen it by re-running \`lavish-axi ${file}\` unless the user asks for further review or something genuinely important needs their visual attention - deliver routine updates directly in this conversation instead. When reopening is warranted, run \`lavish-axi ${file} --reopen\`.`
   };
 }
 function createUserEndedOpenOutput({ file, url }) {
@@ -8837,6 +8900,7 @@ async function openCommand(args) {
   }
   await assertHtmlFile(file);
   const absolute = await canonicalFile(file);
+  const selfPaintWarning = await selfPaintWarningForFile(absolute);
   const noGate = args.includes("--no-gate");
   const reopen = args.includes("--reopen");
   const baseUrl = await ensureServer({ forceRestart: shouldForceRestartForLocalBuild(process.argv[1] || "") });
@@ -8856,9 +8920,17 @@ async function openCommand(args) {
     file: absolute,
     url: response.url,
     status: response.status || "opened",
-    agent: detectInvokingAgent(process.env)
+    agent: detectInvokingAgent(process.env),
+    selfPaintWarning
   });
 }
+async function selfPaintWarningForFile(absolute) {
+  try {
+    return analyzeSelfPaint(await readFile5(absolute, "utf8")).painted ? void 0 : SELF_PAINT_WARNING;
+  } catch {
+    return void 0;
+  }
+}
 function shouldOpenBrowser(args, env) {
   return !args.includes("--no-open") && env.LAVISH_AXI_NO_OPEN !== "1";
 }
@@ -9020,9 +9092,15 @@ async function exportCommand(args) {
     resolveAbsolute: resolveDesignAssetPath
   });
   await writeFile3(output, html);
-  return createExportOutput({ source: absolute, output, html, warnings });
+  return createExportOutput({
+    source: absolute,
+    output,
+    html,
+    warnings,
+    selfPaintWarning: analyzeSelfPaint(source).painted ? void 0 : SELF_PAINT_WARNING
+  });
 }
-function createExportOutput({ source, output, html, warnings }) {
+function createExportOutput({ source, output, html, warnings, selfPaintWarning = void 0 }) {
   const allWarnings = Array.isArray(warnings) ? warnings : [];
   const { unresolved, notices } = splitExportWarnings(allWarnings);
   const result = {
@@ -9044,6 +9122,10 @@ function createExportOutput({ source, output, html, warnings }) {
   } else {
     result.next_step = `Wrote ${output}. Open it directly or host it anywhere - it needs no Lavish server. Local assets are inlined; remote CDN/font references are left as links, so it needs network to render those.`;
   }
+  if (selfPaintWarning) {
+    result.self_paint_warning = selfPaintWarning;
+    result.next_step = `Fix the unpainted page surface flagged in self_paint_warning and re-run the export before sharing the file - an exported page renders over whatever surface hosts it. ${result.next_step}`;
+  }
   return result;
 }
 function assetWarningSummaries(warnings) {
@@ -9066,9 +9148,15 @@ async function shareCommand(args) {
     resolveAbsolute: resolveDesignAssetPath
   });
   const site = await publishToHtmlApp(html, { password, token });
-  return createShareOutput({ source: absolute, site, warnings, passwordProtected: Boolean(password) });
+  return createShareOutput({
+    source: absolute,
+    site,
+    warnings,
+    passwordProtected: Boolean(password),
+    selfPaintWarning: analyzeSelfPaint(source).painted ? void 0 : SELF_PAINT_WARNING
+  });
 }
-function createShareOutput({ source, site, warnings, passwordProtected = false }) {
+function createShareOutput({ source, site, warnings, passwordProtected = false, selfPaintWarning = void 0 }) {
   const allWarnings = Array.isArray(warnings) ? warnings : [];
   const { unresolved, notices } = splitExportWarnings(allWarnings);
   const isPasswordProtected = Boolean(passwordProtected);
@@ -9099,6 +9187,10 @@ function createShareOutput({ source, site, warnings, passwordProtected = false }
   } else {
     result.next_step = `Published a PUBLIC page that anyone with the link can view: ${site.url} - share this URL with the user. ${noticeNote ? `${noticeNote} ` : ""}The update_key is a secret shown only once; keep it to update or delete the page later (there is no recovery). ` + hostNote;
   }
+  if (selfPaintWarning) {
+    result.self_paint_warning = selfPaintWarning;
+    result.next_step = `Fix the unpainted page surface flagged in self_paint_warning, then re-run the share command and share only its replacement URL - the hosted page renders over ht-ml.app's own surface. ${result.next_step}`;
+  }
   return result;
 }
 async function stopCommand(args) {

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "lavish-axi",
-  "version": "0.1.47",
+  "version": "0.1.49",
   "packageManager": "pnpm@11.1.1",
   "description": "HTML is the new markdown. Lavish is the new editor for your HTML artifacts.",
   "type": "module",

package/plugin.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "$schema": "https://agent-plugins.org/schemas/1.0.0/plugin.schema.json",
   "name": "lavish-axi",
-  "version": "0.1.47",
+  "version": "0.1.49",
   "description": "HTML is the new markdown. Lavish is the new editor for your HTML artifacts.",
   "author": {
     "name": "Kun Chen",

package/skills/lavish/SKILL.md CHANGED Viewed

@@ -32,6 +32,7 @@ Use lavish-axi when the user asks for a visual artifact, HTML explainer, interac
 1. Create the HTML artifact (default location `.lavish/<name>.html` in the working directory).
 2. Run `npx -y lavish-axi <html-file>` to open or resume a review session in the browser.
+   If the output carries a `self_paint_warning`, fix the unpainted page surface and save before polling - Lavish live-reloads the artifact.
 3. Run `npx -y lavish-axi poll <html-file>` to long-poll for the user's annotations and queued prompts.
    On the first poll, prefer `--agent-reply "<one-line summary of what you built and what to review first>"` so the conversation panel opens with context.
    Browser-detected layout issues are filed passively in the user's Layout issues inbox and arrive as an ordinary `layout-warnings` prompt only when the user selects and queues them. Never edit an issue the user has not queued. The only response that arrives without user action is `artifact_failures`, when the review surface itself is unusable.