@agent-native/core 0.83.0 → 0.84.0

package/corpus/templates/design/actions/add-localhost-screens.ts

@@ -17,6 +17,7 @@ import { z } from "zod";
 import { getDb, schema } from "../server/db/index.js";
 import {
   mergeCanvasFramePlacements,
+  parseCanvasFrameGeometryById,
   type CanvasFramePlacement,
 } from "../shared/canvas-frames.js";
 import {
@@ -148,6 +149,25 @@ function uniqueFilename(
   return filename;
 }
 
+export function viewportFilename(
+  pathOrUrl: string,
+  width: number,
+  height: number,
+) {
+  const viewport = `${Math.round(width)}x${Math.round(height)}`;
+  return `localhost-${slugForPath(pathOrUrl)}-${viewport}.html`;
+}
+
+function metadataNumber(
+  metadata: Record<string, unknown> | undefined,
+  key: "width" | "height",
+) {
+  const value = metadata?.[key];
+  return typeof value === "number" && Number.isFinite(value)
+    ? value
+    : undefined;
+}
+
 export default defineAction({
   description:
     "Create or refresh URL-backed localhost screens in a design project. " +
@@ -179,14 +199,12 @@ export default defineAction({
       .number()
       .positive()
       .optional()
-      .default(1280)
-      .describe("Default iframe viewport width."),
+      .describe("Default iframe viewport width. Defaults to 1280."),
     defaultHeight: z
       .number()
       .positive()
       .optional()
-      .default(900)
-      .describe("Default iframe viewport height."),
+      .describe("Default iframe viewport height. Defaults to 900."),
     startX: z.number().optional().default(0),
     startY: z.number().optional().default(0),
     gap: z.number().optional().default(160),
@@ -292,6 +310,13 @@ export default defineAction({
       .from(schema.designs)
       .where(eq(schema.designs.id, designId))
       .limit(1);
+    const prevData = parseJson<Record<string, unknown>>(design?.data, {});
+    const existingCanvasFrames = parseCanvasFrameGeometryById(
+      prevData.canvasFrames,
+    );
+    const existingMetadata = isRecord(prevData.screenMetadata)
+      ? (prevData.screenMetadata as Record<string, unknown>)
+      : {};
     const existingFiles = await db
       .select()
       .from(schema.designFiles)
@@ -301,6 +326,8 @@ export default defineAction({
     );
     const usedFilenames = new Set(existingFiles.map((file) => file.filename));
     const now = new Date().toISOString();
+    const effectiveDefaultWidth = defaultWidth ?? 1280;
+    const effectiveDefaultHeight = defaultHeight ?? 900;
     const savedScreens: Array<{
       id: string;
       filename: string;
@@ -333,9 +360,38 @@ export default defineAction({
       const title =
         input.title ?? manifestRoute?.title ?? titleFromRoutePath(path);
       const sourceFile = input.sourceFile ?? manifestRoute?.sourceFile;
-      const width = input.width ?? defaultWidth;
-      const height = input.height ?? defaultHeight;
-      const preferredFilename = `localhost-${slugForPath(path)}.html`;
+      const width = input.width ?? effectiveDefaultWidth;
+      const height = input.height ?? effectiveDefaultHeight;
+      const basePreferredFilename = `localhost-${slugForPath(path)}.html`;
+      const existingBase = existingByFilename.get(basePreferredFilename);
+      const requestedViewportExplicitly =
+        input.width !== undefined ||
+        input.height !== undefined ||
+        defaultWidth !== undefined ||
+        defaultHeight !== undefined;
+      const existingBaseMetadata = isRecord(
+        existingBase ? existingMetadata[existingBase.id] : undefined,
+      )
+        ? (existingMetadata[existingBase!.id] as Record<string, unknown>)
+        : undefined;
+      const existingBaseFrame = existingBase
+        ? existingCanvasFrames[existingBase.id]
+        : undefined;
+      const existingBaseWidth =
+        existingBaseFrame?.width ??
+        metadataNumber(existingBaseMetadata, "width");
+      const existingBaseHeight =
+        existingBaseFrame?.height ??
+        metadataNumber(existingBaseMetadata, "height");
+      const viewportDiffersFromBase =
+        (typeof existingBaseWidth === "number" &&
+          existingBaseWidth !== width) ||
+        (typeof existingBaseHeight === "number" &&
+          existingBaseHeight !== height);
+      const preferredFilename =
+        existingBase && requestedViewportExplicitly && viewportDiffersFromBase
+          ? viewportFilename(path, width, height)
+          : basePreferredFilename;
       const existing = existingByFilename.get(preferredFilename);
       const filename =
         existing?.filename ??
@@ -387,7 +443,6 @@ export default defineAction({
       });
     }
 
-    const prevData = parseJson<Record<string, unknown>>(design?.data, {});
     const mergedFrames = mergeCanvasFramePlacements({
       existing: prevData.canvasFrames,
       placements,

package/corpus/templates/design/actions/apply-motion-edit.ts

@@ -31,6 +31,7 @@ import {
   assertSafeMotionCssProperty,
   assertSafeMotionCssToken,
   compile,
+  injectManagedMotionCss,
 } from "../shared/motion-compiler.js";
 import type { MotionTrack } from "../shared/motion-timeline.js";
 
@@ -69,55 +70,12 @@ const trackSchema = z.object({
 
 // ─── Helpers ──────────────────────────────────────────────────────────────────
 
-const MOTION_STYLE_OPEN = "<style data-agent-native-motion>";
-const MOTION_STYLE_CLOSE = "</style>";
-
-/**
- * Bounded, case-insensitive matcher for any HTML `</style>` end tag
- * (`</style >`, `</STYLE>`, …). Used to locate the close of the managed block
- * without a naive `indexOf("</style>")` that would miss case/whitespace
- * variants — and to detect any `</style` sequence smuggled into compiled CSS.
- */
-const STYLE_CLOSE_RE = /<\s*\/\s*style\b[^>]*>/i;
-
-/**
- * Inject or replace the managed `<style data-agent-native-motion>` block in
- * the HTML content.  Inserts before `</head>` when not already present.
- */
-function injectMotionStyle(html: string, css: string): string {
-  const open = MOTION_STYLE_OPEN;
-  const close = MOTION_STYLE_CLOSE;
-  const openIdx = html.indexOf(open);
-
-  if (openIdx !== -1) {
-    // Find the matching closing tag after the open tag using a bounded regex
-    // (tolerates `</style >`, `</STYLE>`, etc.) instead of a literal indexOf.
-    const after = html.slice(openIdx + open.length);
-    const closeMatch = STYLE_CLOSE_RE.exec(after);
-    if (closeMatch) {
-      const closeIdx = openIdx + open.length + closeMatch.index;
-      // Replace the existing block.
-      return (
-        html.slice(0, openIdx) + open + "\n" + css + "\n" + html.slice(closeIdx)
-      );
-    }
-  }
-
-  // Not found — insert before </head> or, if there is no <head>, at the top.
-  const headClose = html.lastIndexOf("</head>");
-  const block = `${open}\n${css}\n${close}`;
-  if (headClose !== -1) {
-    return html.slice(0, headClose) + block + "\n" + html.slice(headClose);
-  }
-  return block + "\n" + html;
-}
-
 async function persistFileContent(
   fileId: string,
   designId: string,
   content: string,
   now: string,
-): Promise<void> {
+): Promise<string> {
   const db = getDb();
   await db
     .update(schema.designFiles)
@@ -134,6 +92,8 @@ async function persistFileContent(
     .update(schema.designs)
     .set({ updatedAt: now })
     .where(eq(schema.designs.id, designId));
+
+  return now;
 }
 
 // ─── Action ───────────────────────────────────────────────────────────────────
@@ -296,7 +256,7 @@ export default defineAction({
     });
 
     // ── 3. Inject the managed CSS block into the HTML ───────────────────────
-    const patchedContent = injectMotionStyle(currentContent, css);
+    const patchedContent = injectManagedMotionCss(currentContent, css);
     const bytesBefore = currentContent.length;
     const bytesAfter = patchedContent.length;
 
@@ -392,7 +352,12 @@ export default defineAction({
     // Written after the row so a SQL failure here leaves the timeline row
     // accurate (correct tracks + hash) and the stale HTML can be recompiled on
     // the next apply-motion-edit call via compiledHash drift detection.
-    await persistFileContent(fileId, designId, patchedContent, now);
+    const updatedAt = await persistFileContent(
+      fileId,
+      designId,
+      patchedContent,
+      now,
+    );
 
     return {
       timelineId: resolvedTimelineId,
@@ -401,6 +366,7 @@ export default defineAction({
       sourceRef: resolvedSourceRef,
       trackCount: typedTracks.length,
       compiledHash: hash,
+      updatedAt,
       bytesBefore,
       bytesAfter,
       bytesDelta: bytesAfter - bytesBefore,

package/corpus/templates/design/actions/list-design-native-assets.ts

@@ -90,7 +90,8 @@ export default defineAction({
   }),
   http: { method: "GET" },
   readOnly: true,
-  publicAgent: { expose: true, readOnly: true, requiresAuth: true },
+  requiresAuth: false,
+  publicAgent: { expose: true, readOnly: true, requiresAuth: false },
   run: ({ category }) => {
     const assets = category
       ? DESIGN_NATIVE_ASSETS.filter((asset) => asset.category === category)

package/corpus/templates/design/actions/migrate-board-objects-to-file.ts

@@ -39,6 +39,7 @@ import { z } from "zod";
 import { getDb, schema } from "../server/db/index.js";
 import {
   BOARD_FILENAME,
+  backfillBoardPrimitiveMarkers,
   boardObjectEntryToHtmlFragment,
   emptyBoardHtml,
 } from "../shared/board-file.js";
@@ -91,10 +92,57 @@ export default defineAction({
       typeof parsed["boardFileId"] === "string" &&
       parsed["boardFileId"].length > 0
     ) {
+      // ── Marker backfill path ───────────────────────────────────────────────
+      // The board file exists (boardFileId set), but it may have been created
+      // before the data-an-primitive marker was introduced.  Run the additive
+      // backfill so the layers-panel renders the correct icon (ellipse / text /
+      // frame / rectangle) instead of the generic code glyph.
+      const existingBoardFileId = parsed["boardFileId"] as string;
+
+      const [boardFileRow] = await db
+        .select({ content: schema.designFiles.content })
+        .from(schema.designFiles)
+        .where(eq(schema.designFiles.id, existingBoardFileId))
+        .limit(1);
+
+      if (boardFileRow) {
+        const originalContent = boardFileRow.content ?? "";
+        // Only run backfill when the board file has node-id elements but is
+        // missing at least one data-an-primitive marker.
+        const needsBackfill =
+          originalContent.includes("data-agent-native-node-id=") &&
+          !originalContent.includes("data-an-primitive=");
+
+        if (needsBackfill) {
+          const backfilledContent =
+            backfillBoardPrimitiveMarkers(originalContent);
+          const now = new Date().toISOString();
+          await db
+            .update(schema.designFiles)
+            .set({ content: backfilledContent, updatedAt: now })
+            .where(eq(schema.designFiles.id, existingBoardFileId));
+
+          // Best-effort collab re-seed.
+          try {
+            await seedFromText(existingBoardFileId, backfilledContent);
+          } catch {
+            // Non-fatal.
+          }
+
+          return {
+            designId,
+            migrated: false,
+            boardFileId: existingBoardFileId,
+            reason:
+              "boardFileId already set — backfilled missing data-an-primitive markers.",
+          };
+        }
+      }
+
       return {
         designId,
         migrated: false,
-        boardFileId: parsed["boardFileId"] as string,
+        boardFileId: existingBoardFileId,
         reason: "boardFileId already set — migration already complete.",
       };
     }

package/corpus/templates/design/actions/navigate.ts

@@ -10,12 +10,11 @@
  *   pnpm action navigate --view=editor --designId=abc123 --filename=checkout.html
  *   pnpm action navigate --view=design-systems
  *   pnpm action navigate --view=design-systems --designSystemId=abc123
- *   pnpm action navigate --view=templates
  *   pnpm action navigate --view=settings
  *   pnpm action navigate --path=/some/route
  *
  * Options:
- *   --view       View name (list, editor, design-systems, present, templates, settings)
+ *   --view       View name (list, editor, design-systems, present, settings)
  *   --designId   Design ID (for editor/present views)
  *   --editorView Editor mode for designs: single or overview
  *   --inspectorTab Inspector tab for designs: design or tweaks (extensions opens Tools for compatibility)
@@ -58,19 +57,11 @@ const designLeftPanelSchema = z.enum([
 
 export default defineAction({
   description:
-    "Navigate the UI to a specific view or path. Views: list, editor, design-systems, present, templates, settings. Use --designId with editor/present views and --designSystemId with design-systems. For designs, use editorView=overview to show the infinite screens canvas, or editorView=single with fileId/filename/screen to focus a screen. Use leftPanel=file|agent|assets|tools|tokens to focus the Figma-style left rail. Legacy inspectorTab=extensions opens Tools. Use tool to activate a design editor tool.",
+    "Navigate the UI to a specific view or path. Views: list, editor, design-systems, present, settings. Use --designId with editor/present views and --designSystemId with design-systems. For designs, use editorView=overview to show the infinite screens canvas, or editorView=single with fileId/filename/screen to focus a screen. Use leftPanel=file|agent|assets|tools|tokens to focus the Figma-style left rail. Legacy inspectorTab=extensions opens Tools. Use tool to activate a design editor tool.",
   schema: z
     .object({
       view: z
-        .enum([
-          "list",
-          "editor",
-          "design-systems",
-          "present",
-          "templates",
-          "examples",
-          "settings",
-        ])
+        .enum(["list", "editor", "design-systems", "present", "settings"])
         .optional()
         .describe("View name to navigate to"),
       designId: z.string().optional().describe("Design ID for editor/present"),

package/corpus/templates/design/actions/open-visual-edit.ts

@@ -0,0 +1,341 @@
+import crypto from "node:crypto";
+
+import { defineAction, embedApp } from "@agent-native/core";
+import { writeAppState } from "@agent-native/core/application-state";
+import { buildDeepLink } from "@agent-native/core/server";
+import { eq } from "drizzle-orm";
+import { z } from "zod";
+
+import { getDb, schema } from "../server/db/index.js";
+import {
+  DESIGN_BRIDGE_OPERATIONS,
+  makeLocalhostRouteId,
+  titleFromRoutePath,
+} from "../shared/source-mode.js";
+import addLocalhostScreensAction, {
+  pathFromUrl,
+  routeUrl,
+} from "./add-localhost-screens.js";
+import connectLocalhostAction from "./connect-localhost.js";
+import createDesignAction from "./create-design.js";
+import navigateAction from "./navigate.js";
+
+const connectionRouteSchema = z.object({
+  id: z.string().optional(),
+  path: z.string().min(1),
+  title: z.string().optional(),
+  sourceFile: z.string().optional(),
+  sourceKind: z.enum(["react-router", "html", "manual"]).optional(),
+  screenshotUrl: z.string().optional(),
+  metadata: z.record(z.string(), z.unknown()).optional(),
+});
+
+const screenRouteSchema = z.object({
+  routeId: z.string().optional(),
+  path: z.string().optional(),
+  url: z.string().optional(),
+  title: z.string().optional(),
+  sourceFile: z.string().optional(),
+  width: z.number().positive().optional(),
+  height: z.number().positive().optional(),
+  x: z.number().optional(),
+  y: z.number().optional(),
+  z: z.number().optional(),
+});
+
+const capabilitySchema = z.object({
+  operation: z.enum(DESIGN_BRIDGE_OPERATIONS),
+  status: z.enum(["available", "planned", "disabled"]),
+  reason: z.string().optional(),
+});
+
+const routeManifestSchema = z.object({
+  version: z.literal(1).optional().default(1),
+  sourceType: z.literal("localhost").optional().default("localhost"),
+  devServerUrl: z.string().optional(),
+  rootPath: z.string().optional(),
+  routes: z.array(connectionRouteSchema),
+  generatedAt: z.string().optional(),
+});
+
+const jsonArray = <T extends z.ZodTypeAny>(schema: T) =>
+  z.preprocess(
+    (value) => (typeof value === "string" ? JSON.parse(value) : value),
+    schema,
+  );
+
+function normalizeBaseUrl(value: string): string {
+  const raw = value.trim();
+  const withProtocol = /^[a-z]+:\/\//i.test(raw) ? raw : `http://${raw}`;
+  const parsed = new URL(withProtocol);
+  if (parsed.protocol !== "http:" && parsed.protocol !== "https:") {
+    throw new Error("devServerUrl must be an http(s) URL");
+  }
+  parsed.hash = "";
+  return parsed.toString().replace(/\/$/, "");
+}
+
+function isLoopbackUrl(value: string): boolean {
+  const hostname = new URL(value).hostname.toLowerCase();
+  if (hostname === "localhost" || hostname === "::1" || hostname === "[::1]") {
+    return true;
+  }
+  const parts = hostname.split(".");
+  return (
+    parts.length === 4 &&
+    parts[0] === "127" &&
+    parts.every((part) => /^\d+$/.test(part) && Number(part) <= 255)
+  );
+}
+
+function stableConnectionId(devServerUrl: string, rootPath?: string) {
+  const hash = crypto
+    .createHash("sha256")
+    .update(`${devServerUrl}\n${rootPath ?? ""}`)
+    .digest("base64url")
+    .slice(0, 16);
+  return `localhost_${hash}`;
+}
+
+function designOverviewDeepLink(designId: string): string {
+  return buildDeepLink({
+    app: "design",
+    view: "editor",
+    params: { designId, editorView: "overview" },
+    to: `/design/${encodeURIComponent(designId)}?editorView=overview`,
+  });
+}
+
+function routeManifestFromScreens(args: {
+  devServerUrl: string;
+  routes?: Array<z.infer<typeof screenRouteSchema>>;
+  paths?: string[];
+}) {
+  const screenInputs: Array<z.infer<typeof screenRouteSchema>> = args.routes
+    ?.length
+    ? args.routes
+    : (args.paths?.map((path) => ({ path })) ?? []);
+  if (screenInputs.length === 0) return undefined;
+
+  return screenInputs.map((input) => {
+    const url = routeUrl(args.devServerUrl, {
+      path: input.path,
+      url: input.url,
+    });
+    const path = pathFromUrl(args.devServerUrl, url, input.path ?? "/");
+    return {
+      id: input.routeId ?? makeLocalhostRouteId(path),
+      path,
+      title: input.title ?? titleFromRoutePath(path),
+      sourceFile: input.sourceFile,
+      sourceKind: "manual" as const,
+    };
+  });
+}
+
+export default defineAction({
+  description:
+    "Open or refresh a running localhost app in Design overview mode in one authenticated step. Registers the local bridge, creates or reuses a design, places URL-backed screens, stores the active visual-edit context, and navigates the current Design session to the canvas. Use this for /visual-edit launches and follow-up requests like adding a mobile-size screen.",
+  schema: z.object({
+    designId: z
+      .string()
+      .optional()
+      .describe(
+        "Existing Design project to update. Omit to create a new visual-edit design.",
+      ),
+    connectionId: z
+      .string()
+      .optional()
+      .describe(
+        "Existing localhost connection. Omit to reuse a stable connection for devServerUrl + rootPath.",
+      ),
+    title: z
+      .string()
+      .optional()
+      .describe("Title for a newly created design project."),
+    description: z.string().optional(),
+    devServerUrl: z
+      .string()
+      .describe("Running local app URL, for example http://localhost:5173"),
+    bridgeUrl: z
+      .string()
+      .optional()
+      .describe("Local bridge URL printed by agent-native design connect."),
+    rootPath: z.string().optional().describe("Repository root for the app."),
+    name: z.string().optional().describe("Human-readable connection name."),
+    routeManifest: jsonArray(routeManifestSchema)
+      .optional()
+      .describe("Route manifest from the local Design bridge."),
+    capabilities: jsonArray(z.array(capabilitySchema))
+      .optional()
+      .describe("Bridge operation capabilities."),
+    bridgeToken: z
+      .string()
+      .optional()
+      .describe(
+        "Real bridge token from the running bridge. Stored server-side only; never returned.",
+      ),
+    routes: jsonArray(z.array(screenRouteSchema))
+      .optional()
+      .describe(
+        "Screens to place. Each route may include path, url, title, viewport width/height, and x/y/z.",
+      ),
+    paths: jsonArray(z.array(z.string()))
+      .optional()
+      .describe("Shortcut for routes when only paths/URLs are needed."),
+    defaultWidth: z
+      .number()
+      .positive()
+      .optional()
+      .describe("Default screen width. Defaults to 1280 when omitted."),
+    defaultHeight: z
+      .number()
+      .positive()
+      .optional()
+      .describe("Default screen height. Defaults to 900 when omitted."),
+    startX: z.number().optional().default(0),
+    startY: z.number().optional().default(0),
+    gap: z.number().optional().default(160),
+    navigate: z
+      .boolean()
+      .optional()
+      .default(true)
+      .describe("Write a navigate app-state command to open overview mode."),
+    publicReadOnly: z
+      .boolean()
+      .optional()
+      .default(true)
+      .describe(
+        "For newly created loopback localhost designs, make the design public viewer-access so existing browser sessions do not see a false 404. Writes still require editor access.",
+      ),
+  }),
+  mcpApp: {
+    compactCatalog: true,
+    resource: embedApp({
+      title: "Local visual edit",
+      description: "Open local URL-backed screens in Design overview mode.",
+      iframeTitle: "Agent-Native Design",
+      openLabel: "Open overview",
+      height: 680,
+    }),
+  },
+  run: async (args) => {
+    const devServerUrl = normalizeBaseUrl(args.devServerUrl);
+    const routeManifest = args.routeManifest
+      ? {
+          ...args.routeManifest,
+          devServerUrl: args.routeManifest.devServerUrl ?? devServerUrl,
+          rootPath: args.routeManifest.rootPath ?? args.rootPath,
+        }
+      : {
+          version: 1 as const,
+          sourceType: "localhost" as const,
+          devServerUrl,
+          rootPath: args.rootPath,
+          routes:
+            routeManifestFromScreens({
+              devServerUrl,
+              routes: args.routes,
+              paths: args.paths,
+            }) ?? [],
+          generatedAt: new Date().toISOString(),
+        };
+    const connectionId =
+      args.connectionId ?? stableConnectionId(devServerUrl, args.rootPath);
+
+    const connection = await connectLocalhostAction.run({
+      id: connectionId,
+      name: args.name,
+      devServerUrl,
+      bridgeUrl: args.bridgeUrl,
+      rootPath: routeManifest.rootPath ?? args.rootPath,
+      routeManifest,
+      capabilities: args.capabilities,
+      bridgeToken: args.bridgeToken,
+      status: "connected",
+    });
+
+    let designId = args.designId;
+    let createdDesign = false;
+    let publicReadOnly = false;
+    if (!designId) {
+      const design = await createDesignAction.run({
+        title: args.title ?? `${new URL(devServerUrl).host} visual edit`,
+        description:
+          args.description ??
+          "URL-backed localhost screens prepared by visual-edit.",
+        projectType: "prototype",
+      });
+      designId = design.id;
+      createdDesign = true;
+      if (args.publicReadOnly && isLoopbackUrl(devServerUrl)) {
+        publicReadOnly = true;
+        await getDb()
+          .update(schema.designs)
+          .set({ visibility: "public" })
+          .where(eq(schema.designs.id, designId));
+      }
+    }
+
+    const screens = await addLocalhostScreensAction.run({
+      designId,
+      connectionId: connection.id,
+      routes: args.routes,
+      paths: args.paths,
+      defaultWidth: args.defaultWidth,
+      defaultHeight: args.defaultHeight,
+      startX: args.startX,
+      startY: args.startY,
+      gap: args.gap,
+    });
+
+    const urlPath = `/design/${encodeURIComponent(
+      designId,
+    )}?editorView=overview`;
+    await writeAppState("visual-edit", {
+      designId,
+      connectionId: connection.id,
+      devServerUrl,
+      bridgeUrl: connection.bridgeUrl,
+      rootPath: connection.rootPath,
+      urlPath,
+      screens: screens.screens,
+      updatedAt: new Date().toISOString(),
+    });
+
+    if (args.navigate) {
+      await navigateAction.run({
+        view: "editor",
+        designId,
+        editorView: "overview",
+        path: urlPath,
+      });
+    }
+
+    return {
+      designId,
+      connectionId: connection.id,
+      createdDesign,
+      publicReadOnly,
+      devServerUrl,
+      bridgeUrl: connection.bridgeUrl,
+      rootPath: connection.rootPath,
+      screenCount: screens.screenCount,
+      screens: screens.screens,
+      placedFrames: screens.placedFrames,
+      overview: true,
+      urlPath,
+      openUrl: designOverviewDeepLink(designId),
+    };
+  },
+  link: ({ result }) => {
+    if (!result || typeof result !== "object") return null;
+    const designId = (result as { designId?: string }).designId;
+    if (!designId) return null;
+    return {
+      url: designOverviewDeepLink(designId),
+      label: "Open overview",
+      view: "editor",
+    };
+  },
+});

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 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.",
+    "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, 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 () => {