@agent-native/core 0.153.10 → 0.154.1

package/corpus/templates/design/shared/html-integrity.ts

@@ -32,6 +32,8 @@ export type DesignHtmlIntegrityIssue =
   | "close-tag-orphaned"
   | "content-truncated"
   | "runtime-missing"
+  | "runtime-alpine-missing"
+  | "runtime-cloak-missing"
   | "url-backed-screen-replaced";
 
 /**
@@ -86,6 +88,10 @@ const DOCUMENT_SHAPE_MESSAGES: Partial<
     "an editor-managed <style>/<script> block appears more than once; there must be exactly one of each",
   "url-backed-screen-replaced":
     "this screen's content is its live route URL, and the write would replace it with document markup — that permanently unbinds the screen from the running app. Edit the app's own source instead",
+  "runtime-cloak-missing":
+    "this document uses x-cloak without the CSS rule that keeps Alpine-controlled content hidden before Alpine starts",
+  "runtime-alpine-missing":
+    "this document uses x-cloak but does not load Alpine.js, so the hidden state can never be removed",
 };
 
 export function describeDesignHtmlIntegrityIssue(
@@ -141,6 +147,19 @@ export function describeDesignHtmlIntegrityIssue(
         `<script src="…@tailwindcss/browser@4"> or a <style type="text/tailwindcss">). ` +
         `Utility classes will not apply and the design renders unstyled.`
       );
+    case "runtime-alpine-missing":
+      return (
+        `the document uses x-cloak on <${detail.tag ?? "element"}> at ${at}, ` +
+        `but no script source contains Alpine.js. The element will remain ` +
+        `hidden forever; load Alpine.js before relying on x-cloak.`
+      );
+    case "runtime-cloak-missing":
+      return (
+        `the document uses x-cloak on <${detail.tag ?? "element"}> at ${at}, ` +
+        `but no style block defines [x-cloak] { display: none !important; }. ` +
+        `Alpine-controlled overlays can flash or cover the entire screen before ` +
+        `Alpine starts. Add that exact hiding rule to the document.`
+      );
     default:
       return `the document structure is invalid (${detail.issue}) at ${at}.`;
   }
@@ -1077,6 +1096,85 @@ function collectManagedMarkerIssue(
   return null;
 }
 
+/**
+ * The selector may sit anywhere in a comma-separated list, and any of the three
+ * hidings below is a correct pre-Alpine hide. Matching only
+ * `[x-cloak] { display: none }` rejects documents that render perfectly.
+ */
+const X_CLOAK_RULE =
+  /\[x-cloak\][^{}]*\{[^}]*(?:display\s*:\s*none|visibility\s*:\s*hidden|@apply[^;}]*\bhidden\b)/i;
+const ALPINE_RUNTIME = /\balpinejs\b/i;
+const INLINE_PRE_HIDE = /(?:display\s*:\s*none|visibility\s*:\s*hidden)/i;
+
+/**
+ * `x-cloak` is an Alpine convention, not a runtime feature: it only works
+ * when the authored document also supplies the CSS rule that hides the node
+ * before Alpine initializes. A missing rule is especially dangerous for
+ * fixed overlays, which can make a correct screen look completely replaced.
+ */
+function collectInteractiveRuntimeIssues(
+  parsed: ParsedDocument,
+  locate: Locator,
+): DesignHtmlIntegrityIssueDetail[] {
+  const cloaked = parsed.elements.find((element) =>
+    element.attrs.some(
+      (attribute) => attribute.name.toLowerCase() === "x-cloak",
+    ),
+  );
+  if (!cloaked) return [];
+
+  const hasAlpineRuntime = parsed.elements.some(
+    (element) =>
+      element.tagName === "script" &&
+      ALPINE_RUNTIME.test(attributeOf(element, "src") ?? ""),
+  );
+
+  // A linked stylesheet is content this parser cannot read, so its rules are
+  // unknown — not missing. Reporting "no rule defined" here would be the
+  // coercion this whole module exists to prevent.
+  const hasUnreadableStylesheet = parsed.elements.some(
+    (element) =>
+      element.tagName === "link" &&
+      /\bstylesheet\b/i.test(attributeOf(element, "rel") ?? "") &&
+      (attributeOf(element, "href") ?? "").trim().length > 0,
+  );
+
+  const hasCloakRule =
+    hasUnreadableStylesheet ||
+    INLINE_PRE_HIDE.test(attributeOf(cloaked, "style") ?? "") ||
+    parsed.elements.some((element) => {
+      if (element.tagName !== "style") return false;
+      const css = childrenOf(element)
+        .filter((node) => node.nodeName === "#text")
+        .map((node) => (node as DefaultTreeAdapterTypes.TextNode).value)
+        .join("\n");
+      return X_CLOAK_RULE.test(css);
+    });
+
+  const attribute = cloaked.attrs.find(
+    (entry) => entry.name.toLowerCase() === "x-cloak",
+  );
+  const offset =
+    locationOf(cloaked)?.attrs?.[attribute?.name ?? ""]?.startOffset ??
+    locationOf(cloaked)?.startOffset ??
+    0;
+  const detail = {
+    line: locate(offset).line,
+    column: locate(offset).column,
+    excerpt: locate(offset).excerpt,
+    tag: cloaked.tagName,
+    attribute: "x-cloak",
+  };
+  return [
+    ...(hasAlpineRuntime
+      ? []
+      : [{ issue: "runtime-alpine-missing" as const, ...detail }]),
+    ...(hasCloakRule
+      ? []
+      : [{ issue: "runtime-cloak-missing" as const, ...detail }]),
+  ];
+}
+
 /**
  * Reported, never enforced: legitimate fragments and token-only screens carry no
  * runtime of their own, so blocking here would reject valid work.
@@ -1142,10 +1240,45 @@ export function inspectDesignHtmlDocumentIntegrity(
   const marker = collectManagedMarkerIssue(parsed);
   if (marker) return { valid: false, issue: marker };
 
+  const interactiveRuntime = collectInteractiveRuntimeIssues(parsed, locate);
+  if (interactiveRuntime.length > 0) {
+    return {
+      valid: false,
+      issue: interactiveRuntime[0]!.issue,
+      detail: interactiveRuntime,
+    };
+  }
+
   const advisory = collectAdvisoryIssues(parsed, locate);
   return advisory.length > 0 ? { valid: true, advisory } : { valid: true };
 }
 
+const RUNTIME_ISSUES: ReadonlySet<DesignHtmlIntegrityIssue> = new Set([
+  "runtime-alpine-missing",
+  "runtime-cloak-missing",
+]);
+
+/**
+ * The runtime issues are the one class an edit may carry forward. A screen
+ * saved before these checks existed still renders, and the person dragging on
+ * the canvas did not author its markup and cannot add a CSS rule — refusing
+ * their unrelated edit strands the screen. Block what the edit introduces;
+ * the create path still refuses to author the defect in the first place.
+ */
+function introducedRuntimeIssues(
+  next: DesignHtmlIntegrityIssueDetail[],
+  previousContent: string,
+): DesignHtmlIntegrityIssueDetail[] {
+  if (next.length === 0 || !previousContent.trim()) return next;
+  const inherited = new Set(
+    collectInteractiveRuntimeIssues(
+      parseDocument(previousContent),
+      createLocator(previousContent),
+    ).map((entry) => entry.issue),
+  );
+  return next.filter((entry) => !inherited.has(entry.issue));
+}
+
 /**
  * Fail closed only for document edits. Standalone Alpine fragments remain
  * supported. Existing malformed documents can still be repaired: a candidate
@@ -1186,6 +1319,19 @@ export function assertDesignHtmlEditIntegrity(args: {
         detail: structural,
       });
     }
+    const interactiveRuntime = introducedRuntimeIssues(
+      collectInteractiveRuntimeIssues(
+        parseDocument(args.nextContent),
+        createLocator(args.nextContent),
+      ),
+      args.previousContent,
+    );
+    if (interactiveRuntime.length > 0) {
+      throw new DesignHtmlIntegrityError(interactiveRuntime[0]!.issue, {
+        filename: args.filename,
+        detail: interactiveRuntime,
+      });
+    }
     return;
   }
   if (previousIsDocument && !nextIsDocument) {
@@ -1195,6 +1341,17 @@ export function assertDesignHtmlEditIntegrity(args: {
   }
   const result = inspectDesignHtmlDocumentIntegrity(args.nextContent);
   if (!result.valid) {
+    if (result.issue && RUNTIME_ISSUES.has(result.issue)) {
+      const introduced = introducedRuntimeIssues(
+        result.detail ?? [],
+        args.previousContent,
+      );
+      if (introduced.length === 0) return;
+      throw new DesignHtmlIntegrityError(introduced[0]!.issue, {
+        filename: args.filename,
+        detail: introduced,
+      });
+    }
     throw new DesignHtmlIntegrityError(result.issue ?? "document-root", {
       filename: args.filename,
       detail: result.detail,
@@ -1227,6 +1384,20 @@ export function assertDesignHtmlWellFormed(args: {
       detail: structural,
     });
   }
+  // Fragments are checked too, unlike the document-shape rules above: a screen
+  // is rendered as its own `srcdoc`, so nothing injects Alpine or a `[x-cloak]`
+  // rule around it. A sketch that omits them is broken exactly as a full
+  // document would be.
+  const interactiveRuntime = collectInteractiveRuntimeIssues(
+    parseDocument(args.content),
+    createLocator(args.content),
+  );
+  if (interactiveRuntime.length > 0) {
+    throw new DesignHtmlIntegrityError(interactiveRuntime[0]!.issue, {
+      filename: args.filename,
+      detail: interactiveRuntime,
+    });
+  }
 }
 
 export function assertDesignHtmlCreateIntegrity(args: {

package/corpus/templates/mail/app/lib/utils.ts

@@ -194,5 +194,5 @@ export function formatShortcut(key: string): string {
       if (lower === "space") return "Space";
       return token.length === 1 ? token.toUpperCase() : token;
     })
-    .join("+");
+    .join(" ");
 }

package/corpus/templates/slides/.agents/skills/design-systems/SKILL.md

@@ -72,12 +72,16 @@ Builder indexing flow.
 
 ### Source: connected code, GitHub, or `design.md`
 
-For any other reusable source — connected code, a GitHub repo, local
-code/design files, or an optional `design.md` — use Builder-backed DSI
-indexing through `index-design-system-with-builder`. Pass readable `design.md`
-content as `designMd`, and use the returned local design system id in the rest
-of the Slides flow. Call `get-design-system` before generation so Builder docs
-and tokens are hydrated when available.
+For any other reusable source - connected code, a GitHub repo, local
+code/design files, or an optional `design.md` - use Builder-backed DSI
+indexing through `index-design-system-with-builder`. Pass GitHub sources as one
+`githubSources` array; each source may pin a branch/tag/commit and include
+repository-relative files or folders. Pass readable `design.md` content as
+`designMd`, and use the returned local design system id in the rest of the
+Slides flow. Call `get-design-system` before generation so Builder docs and
+tokens are hydrated when available. For a saved GitHub-backed system, call
+`sync-design-system-with-builder --id <localDesignSystemId>` to replay its
+persisted source scope after upstream changes.
 
 Never create a duplicate local design system from raw Figma or code sources.
 Builder owns the indexed brand kit; a second local copy drifts from it and

package/corpus/templates/slides/actions/index-design-system-with-builder.ts

@@ -32,6 +32,30 @@ const codeFileSchema = z.object({
     ),
 });
 
+const githubSourceSchema = z.object({
+  repoUrl: z.string().trim().min(1).describe("GitHub repository URL"),
+  ref: z
+    .string()
+    .trim()
+    .min(1)
+    .optional()
+    .describe("Optional branch, tag, or commit"),
+  include: z
+    .array(z.string().trim().min(1))
+    .optional()
+    .describe("Optional repository-relative files or folders to include"),
+  exclude: z
+    .array(z.string().trim().min(1))
+    .optional()
+    .describe("Optional repository-relative files or folders to exclude"),
+  instructions: z
+    .string()
+    .trim()
+    .min(1)
+    .optional()
+    .describe("Optional indexing guidance for this repository"),
+});
+
 export default defineAction({
   description:
     "Start Builder DSI design-system indexing from connected code, a GitHub repository, code/design files, and optional design.md guidance. " +
@@ -49,7 +73,15 @@ export default defineAction({
     githubRepoUrl: z
       .string()
       .optional()
-      .describe("GitHub repository URL to index with Builder"),
+      .describe("Legacy single GitHub repository URL to index with Builder"),
+    githubSources: z
+      .array(githubSourceSchema)
+      .min(1)
+      .max(20)
+      .optional()
+      .describe(
+        "GitHub repositories to index in one design system. Each source may specify a branch/tag/commit and repository-relative files or folders.",
+      ),
     connectedProjectId: z
       .string()
       .optional()
@@ -69,6 +101,7 @@ export default defineAction({
     projectName,
     description,
     githubRepoUrl,
+    githubSources,
     connectedProjectId,
     codeFiles,
     designMd,
@@ -81,6 +114,7 @@ export default defineAction({
       projectName,
       description,
       githubRepoUrl,
+      githubRepos: githubSources,
       connectedProjectId,
       files,
     });
@@ -93,10 +127,13 @@ export default defineAction({
       orgId: getRequestOrgId(),
       projectName,
       description,
+      githubSources:
+        githubSources ?? (githubRepoUrl ? [{ repoUrl: githubRepoUrl }] : []),
       sourceKind:
-        githubRepoUrl && (codeFiles?.length || designMd)
+        (githubSources?.length || githubRepoUrl) &&
+        (codeFiles?.length || designMd)
           ? "mixed"
-          : githubRepoUrl
+          : githubSources?.length || githubRepoUrl
             ? "github"
             : codeFiles?.length || designMd
               ? "code"
@@ -107,6 +144,7 @@ export default defineAction({
       ...result,
       ...proxy,
       uploadedFileCount: files.length,
+      githubSourceCount: githubSources?.length ?? (githubRepoUrl ? 1 : 0),
     };
   },
 });

package/corpus/templates/slides/actions/patch-deck.ts

@@ -157,6 +157,14 @@ const AddSlideOp = z.object({
       notes: z.string().optional(),
       layout: z.string().optional(),
       background: z.string().optional(),
+      imageUrl: z.string().optional(),
+      imagePrompt: z.string().optional(),
+      excalidrawData: z.string().optional(),
+      transition: z
+        .enum(["instant", "none", "fade", "slide", "zoom"])
+        .optional(),
+      animations: z.array(z.unknown()).optional(),
+      splitByParagraph: z.boolean().optional(),
     })
     .passthrough(),
 });
@@ -382,7 +390,10 @@ export function applyOperation(deck: any, op: Operation): void {
       // Idempotency: if the slide already exists (duplicate delivery), skip.
       if (slides.some((s: { id: string }) => s.id === slideId)) return;
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      // Copy every provided field: a duplicated or undo-restored slide has to
+      // keep its transition, animations, and image data, not just its text.
       const newSlide: any = {
+        ...fields,
         id: slideId,
         content:
           typeof fields.content === "string"
@@ -391,9 +402,7 @@ export function applyOperation(deck: any, op: Operation): void {
         notes: fields.notes ?? "",
         layout: fields.layout ?? "content",
       };
-      if (fields.background !== undefined) {
-        newSlide.background = fields.background;
-      }
+      delete newSlide.imageLoading;
       const insertAfterIdx = afterSlideId
         ? slides.findIndex((s: { id: string }) => s.id === afterSlideId)
         : -1;

package/corpus/templates/slides/actions/sync-design-system-with-builder.ts

@@ -0,0 +1,64 @@
+import { defineAction } from "@agent-native/core";
+import {
+  parseBuilderDesignSystemProxyReference,
+  startBuilderDesignSystemIndex,
+} from "@agent-native/core/server";
+import { getRequestUserEmail } from "@agent-native/core/server/request-context";
+import { assertAccess, resolveAccess } from "@agent-native/core/sharing";
+import { z } from "zod";
+
+import "../server/db/index.js";
+import { upsertBuilderProxyDesignSystem } from "../server/lib/builder-design-system-proxy.js";
+
+export default defineAction({
+  description:
+    "Re-index a Builder-backed GitHub design system using its persisted repository, ref, and file/folder scope. Requires editor access.",
+  schema: z.object({
+    id: z.string().min(1).describe("Local design system id"),
+  }),
+  run: async ({ id }) => {
+    await assertAccess("design-system", id, "editor");
+    const access = await resolveAccess("design-system", id);
+    if (!access) throw new Error("Design system not found");
+
+    const reference = parseBuilderDesignSystemProxyReference(
+      access.resource.data,
+    );
+    if (!reference?.githubSources?.length) {
+      throw new Error(
+        "This design system has no persisted GitHub source scope to sync.",
+      );
+    }
+    if (reference.sourceKind === "mixed") {
+      throw new Error(
+        "This design system combines GitHub with non-replayable sources. Re-import all sources before syncing it.",
+      );
+    }
+
+    const result = await startBuilderDesignSystemIndex({
+      projectName: access.resource.title,
+      description: access.resource.description ?? undefined,
+      githubRepos: reference.githubSources,
+    });
+    const ownerEmail = getRequestUserEmail();
+    if (!ownerEmail) throw new Error("no authenticated user");
+
+    const proxy = await upsertBuilderProxyDesignSystem({
+      result,
+      ownerEmail: access.resource.ownerEmail,
+      orgId: access.resource.orgId,
+      projectName: access.resource.title,
+      description: access.resource.description ?? undefined,
+      sourceKind: reference.sourceKind,
+      githubSources: reference.githubSources,
+      localDesignSystemId: id,
+    });
+
+    return {
+      ...result,
+      ...proxy,
+      synced: true,
+      githubSourceCount: reference.githubSources.length,
+    };
+  },
+});

package/corpus/templates/slides/app/components/deck/DeckCard.tsx

@@ -189,7 +189,7 @@ export default function DeckCard({
           </DropdownMenuTrigger>
           <DropdownMenuContent
             align="end"
-            className="w-40"
+            className="w-56"
             onCloseAutoFocus={(e) => {
               if (pendingRenameRef.current) {
                 e.preventDefault();