@agent-native/core 0.80.11 → 0.81.0

package/corpus/templates/design/actions/run-design-audit.ts

@@ -108,6 +108,8 @@ function checkMissingLabels(html: string): A11yFinding[] {
   let idx = 0;
   for (const m of html.matchAll(inputPattern)) {
     const tag = m[0];
+    const inputStart = m.index ?? 0;
+    const inputEnd = inputStart + tag.length;
     const typeMatch = tag.match(/\btype\s*=\s*(?:"([^"]*?)"|'([^']*?)')/i);
     const type = (typeMatch?.[1] ?? typeMatch?.[2] ?? "text").toLowerCase();
     // Hidden and submit/button/image inputs don't need visible labels
@@ -123,8 +125,9 @@ function checkMissingLabels(html: string): A11yFinding[] {
     const hasExplicitLabel = inputId
       ? new RegExp(`for\\s*=\\s*(?:"${inputId}"|'${inputId}')`, "i").test(html)
       : false;
+    const hasImplicitLabel = isWrappedByLabel(html, inputStart, inputEnd);
 
-    if (!hasAriaLabel && !hasExplicitLabel) {
+    if (!hasAriaLabel && !hasExplicitLabel && !hasImplicitLabel) {
       findings.push({
         id: `missing-label:input-${idx}`,
         severity: "error" as A11ySeverity,
@@ -143,8 +146,53 @@ function checkMissingLabels(html: string): A11yFinding[] {
   return findings;
 }
 
-/** Check interactive elements that are likely too small for touch targets (< ~44px heuristic via Tailwind class). */
-function checkTapTargets(html: string): A11yFinding[] {
+function isWrappedByLabel(
+  html: string,
+  inputStart: number,
+  inputEnd: number,
+): boolean {
+  const labelOpen = html.lastIndexOf("<label", inputStart);
+  if (labelOpen === -1) return false;
+  const labelCloseBeforeInput = html.lastIndexOf("</label", inputStart);
+  if (labelCloseBeforeInput > labelOpen) return false;
+  const labelCloseAfterInput = html.indexOf("</label", inputEnd);
+  return labelCloseAfterInput !== -1;
+}
+
+/**
+ * Whether an interactive element already declares a minimum size that meets the
+ * 44px tap-target floor. This recognises exactly what the inline auto-fix adds
+ * (`min-h-[44px] min-w-[44px]`) plus equivalents — arbitrary `min-h`/`min-w`
+ * values in px/rem/em ≥ 44px, the Tailwind spacing scale (`min-h-11` = 44px on a
+ * 4px step), and full-bleed minimums (`min-h-full` / `min-h-screen`). Without
+ * this, a fixed element keeps its original tiny `h-4` class and the audit would
+ * re-flag it forever, so the audit↔fix loop would never converge.
+ */
+function hasAdequateMinTapSize(tag: string): boolean {
+  // Arbitrary values: min-h-[44px], min-w-[2.75rem], etc.
+  const arbitraryPattern = /\bmin-(?:h|w)-\[([\d.]+)(px|rem|em)\]/gi;
+  let m: RegExpExecArray | null;
+  while ((m = arbitraryPattern.exec(tag)) !== null) {
+    const value = Number.parseFloat(m[1] ?? "");
+    if (!Number.isFinite(value)) continue;
+    const px = m[2]?.toLowerCase() === "px" ? value : value * 16;
+    if (px >= 44) return true;
+  }
+  // Tailwind spacing scale: min-h-11 / min-w-11 = 2.75rem = 44px (4px per step).
+  const scalePattern = /\bmin-(?:h|w)-(\d+)\b/gi;
+  while ((m = scalePattern.exec(tag)) !== null) {
+    if (Number.parseInt(m[1] ?? "", 10) * 4 >= 44) return true;
+  }
+  // Full-bleed minimums always clear the tap floor.
+  return /\bmin-(?:h|w)-(?:full|screen)\b/.test(tag);
+}
+
+/**
+ * Check interactive elements that are likely too small for touch targets
+ * (< ~44px heuristic via Tailwind class). Exported for unit tests that assert
+ * the audit↔fix loop converges (a fixed element must stop being flagged).
+ */
+export function checkTapTargets(html: string): A11yFinding[] {
   const findings: A11yFinding[] = [];
   // Heuristic: buttons/links with explicit tiny size classes (h-4, h-5, w-4, w-5, size-4, size-5)
   // and no explicit larger override or sr-only are flagged.
@@ -158,7 +206,8 @@ function checkTapTargets(html: string): A11yFinding[] {
     if (
       tinyPattern.test(tag) &&
       !largePattern.test(tag) &&
-      !srOnlyPattern.test(tag)
+      !srOnlyPattern.test(tag) &&
+      !hasAdequateMinTapSize(tag)
     ) {
       findings.push({
         id: `tap-target:interactive-${idx}`,

package/corpus/templates/design/actions/run-design-extension-action.ts

@@ -146,7 +146,7 @@ const CAPABILITY_ROUTES: Record<string, CapabilityRoute> = {
   "design.motion-presets:apply": {
     action: "apply-motion-edit",
     paramHint:
-      "Call apply-motion-edit with { designId, fileId?, timeline: { tracks, durationMs } } for an atomic Write to CSS commit.",
+      "Call apply-motion-edit with { designId, fileId?, timeline: { tracks, durationMs } } for an atomic managed CSS timeline save.",
     readOnly: false,
   },
   "design.motion-presets:write-source": {

package/corpus/templates/design/actions/view-screen.ts

@@ -95,7 +95,7 @@ function resolveActiveScreen(
 
 export default defineAction({
   description:
-    "See what the user is currently looking at on screen. Returns the current navigation state including which design is open, which view they are on (list, editor, design-systems, present, templates, settings), active/focused design screen, selected element, active inspector tab (design, tweaks, or extensions), overview canvas state, plus any pending question overlay. Always call this first before taking any action.",
+    "See what the user is currently looking at on screen. Returns the current navigation state including which design is open, which view they are on (list, editor, design-systems, present, templates, settings), active/focused design screen, selected element, active inspector tab (design or tweaks), active left rail panel (file, agent, assets, tools, or tokens), overview canvas state, plus any pending question overlay. Always call this first before taking any action.",
   schema: z.object({}),
   http: false,
   run: async () => {

package/corpus/templates/design/actions/write-local-file.ts

@@ -0,0 +1,213 @@
+/**
+ * write-local-file — write or patch a local file through the design bridge.
+ *
+ * Security gates (in order):
+ *  1. assertAccess: the caller must have editor access to the design.
+ *  2. File extension: only .html, .htm, and .css files are allowed.
+ *  3. verifyWriteGrant: a valid (non-expired) user-approved write-consent grant
+ *     must exist. The agent CANNOT bypass this check.
+ *  4. Path confinement: assertPathInside ensures the target stays inside
+ *     rootPath (pre-bridge check; bridge also validates with realpath).
+ *  5. Bridge token: the X-Bridge-Token header is set to the per-grant token
+ *     minted at consent time so the bridge can reject unauthorized calls.
+ */
+
+import path from "node:path";
+
+import { defineAction } from "@agent-native/core";
+import { getRequestUserEmail } from "@agent-native/core/server/request-context";
+import { assertAccess } from "@agent-native/core/sharing";
+import { and, eq } from "drizzle-orm";
+import { z } from "zod";
+
+import { getDb, schema } from "../server/db/index.js";
+import { verifyWriteGrant } from "../server/lib/verify-write-grant.js";
+
+/** File extensions the agent is permitted to write via the bridge. */
+const ALLOWED_EXTENSIONS = new Set([".html", ".htm", ".css"]);
+
+function assertAllowedExtension(relPath: string): void {
+  const ext = path.extname(relPath).toLowerCase();
+  if (!ALLOWED_EXTENSIONS.has(ext)) {
+    throw new Error(
+      `File "${relPath}" has extension "${ext}" which is not allowed. ` +
+        "Only .html, .htm, and .css files may be written through the bridge.",
+    );
+  }
+}
+
+function isLoopbackHostname(hostname: string): boolean {
+  const normalized = hostname.toLowerCase();
+  if (
+    normalized === "localhost" ||
+    normalized === "::1" ||
+    normalized === "[::1]"
+  ) {
+    return true;
+  }
+  const parts = normalized.split(".");
+  return (
+    parts.length === 4 &&
+    parts[0] === "127" &&
+    parts.every((part) => /^\d+$/.test(part) && Number(part) <= 255)
+  );
+}
+
+function normalizeBridgeUrl(value: string): string {
+  const parsed = new URL(value.trim());
+  if (parsed.protocol !== "http:" && parsed.protocol !== "https:") {
+    throw new Error("bridgeUrl must be an http(s) URL");
+  }
+  if (parsed.username || parsed.password) {
+    throw new Error("bridgeUrl must not include credentials");
+  }
+  if (parsed.pathname !== "/" && parsed.pathname !== "") {
+    throw new Error("bridgeUrl must not include a path");
+  }
+  if (!isLoopbackHostname(parsed.hostname)) {
+    throw new Error("bridgeUrl must use localhost or a loopback IP address");
+  }
+  parsed.search = "";
+  parsed.hash = "";
+  parsed.pathname = "";
+  return parsed.toString().replace(/\/$/, "");
+}
+
+export default defineAction({
+  description:
+    "Write or patch a local file (HTML or CSS only) via the localhost design bridge. " +
+    "The user MUST have already granted write consent via grant-localhost-write-consent; " +
+    "this action will reject the request if no valid grant exists. " +
+    "Pass content for a full file write, or {search, replace} for a targeted patch. " +
+    "Requires editor access on the design.",
+  schema: z.object({
+    designId: z.string().describe("Design ID."),
+    connectionId: z
+      .string()
+      .describe("Localhost connection ID (must have an active write grant)."),
+    relPath: z
+      .string()
+      .describe(
+        "Path to the file relative to the connection rootPath. " +
+          "Only .html, .htm, and .css files are accepted.",
+      ),
+    content: z
+      .string()
+      .optional()
+      .describe(
+        "Full replacement file content. Use for new files or complete rewrites.",
+      ),
+    patch: z
+      .object({
+        search: z
+          .string()
+          .describe("Exact text to search for (must appear exactly once)."),
+        replace: z.string().describe("Replacement text."),
+      })
+      .optional()
+      .describe(
+        "Search-and-replace patch. Use for targeted edits. " +
+          "Mutually exclusive with content.",
+      ),
+  }),
+  run: async ({ designId, connectionId, relPath, content, patch }) => {
+    // --- Gate 1: access ---
+    await assertAccess("design", designId, "editor");
+
+    const ownerEmail = getRequestUserEmail();
+    if (!ownerEmail) throw new Error("no authenticated user");
+
+    // --- Gate 2: extension whitelist ---
+    assertAllowedExtension(relPath);
+
+    // --- Gate 3: valid write-consent grant ---
+    const grant = await verifyWriteGrant({
+      designId,
+      connectionId,
+      ownerEmail,
+      targetPath: relPath,
+    });
+
+    // --- Gate 4: exactly one of content/patch must be provided ---
+    if (content === undefined && patch === undefined) {
+      throw new Error(
+        "Either content (full file write) or patch (search/replace) must be provided.",
+      );
+    }
+    if (content !== undefined && patch !== undefined) {
+      throw new Error(
+        "content and patch are mutually exclusive. Provide one or the other.",
+      );
+    }
+
+    // --- Resolve bridge URL ---
+    const db = getDb();
+    const [connection] = await db
+      .select({ bridgeUrl: schema.designLocalhostConnections.bridgeUrl })
+      .from(schema.designLocalhostConnections)
+      .where(
+        and(
+          eq(schema.designLocalhostConnections.id, connectionId),
+          eq(schema.designLocalhostConnections.ownerEmail, ownerEmail),
+        ),
+      )
+      .limit(1);
+
+    if (!connection?.bridgeUrl) {
+      throw new Error(
+        `No bridge URL found for connection "${connectionId}". ` +
+          "Ensure the design bridge is running (npx @agent-native/core@latest design connect).",
+      );
+    }
+
+    const bridgeUrl = normalizeBridgeUrl(connection.bridgeUrl);
+    const headers: Record<string, string> = {
+      "Content-Type": "application/json",
+      "X-Bridge-Token": grant.bridgeToken,
+    };
+
+    if (content !== undefined) {
+      // Full file write
+      const res = await fetch(`${bridgeUrl}/write-file`, {
+        method: "POST",
+        headers,
+        body: JSON.stringify({ relPath, content }),
+      });
+      if (!res.ok) {
+        const errText = await res.text().catch(() => res.statusText);
+        throw new Error(`Bridge write-file failed (${res.status}): ${errText}`);
+      }
+      return { designId, relPath, operation: "write" as const, written: true };
+    } else {
+      // Search-and-replace patch — first read, then apply-edit
+      const readRes = await fetch(`${bridgeUrl}/read-file`, {
+        method: "POST",
+        headers,
+        body: JSON.stringify({ relPath }),
+      });
+      if (!readRes.ok) {
+        const errText = await readRes.text().catch(() => readRes.statusText);
+        throw new Error(
+          `Bridge read-file failed (${readRes.status}): ${errText}`,
+        );
+      }
+
+      const applyRes = await fetch(`${bridgeUrl}/apply-edit`, {
+        method: "POST",
+        headers,
+        body: JSON.stringify({
+          relPath,
+          search: patch!.search,
+          replace: patch!.replace,
+        }),
+      });
+      if (!applyRes.ok) {
+        const errText = await applyRes.text().catch(() => applyRes.statusText);
+        throw new Error(
+          `Bridge apply-edit failed (${applyRes.status}): ${errText}`,
+        );
+      }
+      return { designId, relPath, operation: "patch" as const, written: true };
+    }
+  },
+});