@agent-native/core 0.141.6 → 0.144.0

package/corpus/templates/slides/app/components/onboarding/FirstDeckOnboardingFlow.tsx

@@ -15,7 +15,10 @@ import {
   uploadPromptFiles,
   type UploadedFile,
 } from "@/components/editor/PromptDialog";
-import { useDecks } from "@/context/DeckContext";
+import {
+  describeDeckPersistenceFailure,
+  useDecks,
+} from "@/context/DeckContext";
 import { useAgentGenerating } from "@/hooks/use-agent-generating";
 import { useDesignSystems } from "@/hooks/use-design-systems";
 import { useWorkspaceDefaults } from "@/hooks/use-workspace-defaults";
@@ -26,6 +29,8 @@ import {
   type RecentReference,
 } from "@/lib/recent-references";
 
+import { MAX_REFERENCE_FILE_BYTES } from "../../../shared/upload-types";
+
 type FirstDeckStep = "prompt" | "references";
 
 export function FirstDeckOnboardingFlow({
@@ -141,12 +146,15 @@ export function FirstDeckOnboardingFlow({
         onUnauthenticated: () => {
           toast.error(t("home.signInTitle"));
         },
-        onPersistenceFailure: (failedPrompt) => {
+        onPersistenceFailure: (failedPrompt, _failedFiles, failure) => {
           setPromptInitialText(failedPrompt);
           setPromptInitialTextKey(Date.now());
           setStep("prompt");
           toast.error(t("home.generationStartFailed"), {
-            description: t("home.generationStartFailedDescription"),
+            description: describeDeckPersistenceFailure(
+              failure,
+              t("home.generationStartFailedDescription"),
+            ),
           });
         },
       });
@@ -297,6 +305,8 @@ export function FirstDeckOnboardingFlow({
             className="mt-8"
             autoFocus
             attachmentsEnabled
+            maxDocumentAttachmentBytes={MAX_REFERENCE_FILE_BYTES}
+            documentAttachmentLimitLabel="Slides reference files"
             disabled={uploading}
             placeholder={t("home.newDeckPlaceholder")}
             onSubmit={handlePromptSubmit}

package/corpus/templates/slides/app/components/presentation/PresentationView.tsx

@@ -18,6 +18,7 @@ import type {
 import type { AspectRatio } from "@/lib/aspect-ratios";
 import {
   findLegacyAnimationContainer,
+  getElementPath,
   resolveSlideAnimationElement,
 } from "@/lib/slide-animation-elements";
 
@@ -43,6 +44,31 @@ function getAnimationSteps(slide: Slide): SlideAnimation[] | null {
     const doc = new DOMParser().parseFromString(slide.content, "text/html");
     const root = doc.querySelector(".fmd-slide");
     if (!root) return null;
+
+    const paragraphs = Array.from(
+      root.querySelectorAll(".fmd-pptx-text p[data-pptx-paragraph]"),
+    ).filter((paragraph) => {
+      const textBox = paragraph.closest(".fmd-pptx-text");
+      return (
+        (textBox?.querySelectorAll("p[data-pptx-paragraph]").length ?? 0) > 1
+      );
+    });
+    if (paragraphs.length > 1) {
+      return paragraphs.flatMap((paragraph, index) => {
+        const elementPath = getElementPath(root, paragraph);
+        return elementPath
+          ? [
+              {
+                id: `auto-paragraph-${index}`,
+                elementIndex: index,
+                elementPath,
+                type: "slide-up" as AnimationType,
+              },
+            ]
+          : [];
+      });
+    }
+
     const container = findLegacyAnimationContainer(root);
     if (!container) return null;
     return Array.from(container.children).map((_, i) => ({
@@ -103,7 +129,7 @@ function annotateStepsForPresentation(
     })
     .join("\n");
 
-  const styleTag = `<style>[data-pstep] { opacity: 0; pointer-events: none; }\n${styleLines}</style>`;
+  const styleTag = `<style>[data-pstep] { opacity: 0; pointer-events: none; visibility: visible !important; }\n${styleLines}</style>`;
   return styleTag + doc.body.innerHTML;
 }
 

package/corpus/templates/slides/app/context/DeckContext.tsx

@@ -138,6 +138,25 @@ export interface Deck {
   aspectRatio?: AspectRatio;
 }
 
+export type DeckPersistenceResult =
+  | { persisted: true }
+  | { persisted: false; reason: "request-failed"; error: unknown }
+  | { persisted: false; reason: "not-found" };
+
+export function describeDeckPersistenceFailure(
+  result: DeckPersistenceResult,
+  fallback: string,
+): string {
+  if (result.persisted || result.reason === "not-found") return fallback;
+  if (result.error instanceof Error && result.error.message.trim()) {
+    return result.error.message;
+  }
+  if (typeof result.error === "string" && result.error.trim()) {
+    return result.error;
+  }
+  return fallback;
+}
+
 interface DeckContextType {
   decks: Deck[];
   loading: boolean;
@@ -146,7 +165,7 @@ interface DeckContextType {
     title?: string,
     options?: { noDefaultSlides?: boolean; designSystemId?: string | null },
   ) => Deck;
-  ensureDeckPersisted: (id: string) => Promise<boolean>;
+  ensureDeckPersisted: (id: string) => Promise<DeckPersistenceResult>;
   /**
    * Optimistically duplicate a deck. Inserts a copy into local state with the
    * supplied `newId` immediately so the UI can navigate without awaiting the
@@ -167,6 +186,7 @@ interface DeckContextType {
   ) => void;
   reloadDecks: () => Promise<void>;
   reloadDecksWithStatus: () => Promise<DeckReloadStatus>;
+  refreshOpenDeck: (deckId: string) => Promise<Deck | null>;
   getDeck: (id: string) => Deck | undefined;
   addSlide: (
     deckId: string,
@@ -885,7 +905,22 @@ async function fetchDecksForCurrentRoute(): Promise<Deck[] | null> {
 }
 
 async function deleteDeckFromAPI(id: string): Promise<void> {
-  await callAction("delete-deck", { id }, { method: "DELETE" });
+  try {
+    await callAction("delete-deck", { id }, { method: "DELETE" });
+  } catch (error) {
+    // Deleting an optimistic deck is intentionally idempotent. A create can
+    // fail after the server committed the row, or before it created one.
+    if (
+      !(
+        error &&
+        typeof error === "object" &&
+        "status" in error &&
+        (error as { status?: unknown }).status === 404
+      )
+    ) {
+      throw error;
+    }
+  }
 }
 
 async function createDeckOnAPI(deck: Deck): Promise<void> {
@@ -1081,7 +1116,7 @@ export function DeckProvider({ children }: { children: ReactNode }) {
       const deletion = pendingCreate
         ? pendingCreate.then(
             () => deleteDeckFromAPI(deckId),
-            () => undefined,
+            () => deleteDeckFromAPI(deckId),
           )
         : deleteDeckFromAPI(deckId);
       void deletion.catch((err) => {
@@ -1267,11 +1302,11 @@ export function DeckProvider({ children }: { children: ReactNode }) {
   //   - Dirty deck / unsaved local create → additive merge only: surface
   //     agent-added slides without ever overwriting or dropping local slides.
   const refetchOpenDeckIfChanged = useCallback(
-    async (currentOpenId: string) => {
+    async (currentOpenId: string): Promise<Deck | null> => {
       const serverDeck = await fetchDeckFromAPI(currentOpenId);
       // Null means 404 (row not created yet), a transient failure, or a
       // still-pending create — nothing authoritative to reconcile.
-      if (!serverDeck) return;
+      if (!serverDeck) return null;
       const clientDeck = decksRef.current.find((d) => d.id === currentOpenId);
 
       const hasLocalEdits =
@@ -1281,7 +1316,7 @@ export function DeckProvider({ children }: { children: ReactNode }) {
       if (hasLocalEdits && clientDeck) {
         // Content-preserving: only ADD server slides missing locally.
         const merged = mergeServerAddedSlides(clientDeck, serverDeck);
-        if (merged === clientDeck) return; // nothing new to surface
+        if (merged === clientDeck) return serverDeck; // nothing new to surface
         lastExternalUpdateRef.current = Date.now();
         setDecks((prev) => {
           const idx = prev.findIndex((d) => d.id === currentOpenId);
@@ -1290,16 +1325,17 @@ export function DeckProvider({ children }: { children: ReactNode }) {
           next[idx] = merged;
           return next;
         });
-        return;
+        return serverDeck;
       }
 
       const changed =
         !clientDeck ||
         clientDeck.updatedAt !== serverDeck.updatedAt ||
-        clientDeck.slides.length !== serverDeck.slides.length;
-      if (!changed) return;
+        deckContentSignature(clientDeck) !== deckContentSignature(serverDeck);
+      if (!changed) return serverDeck;
       lastExternalUpdateRef.current = Date.now();
       applyRemoteDeckUpdate(serverDeck);
+      return serverDeck;
     },
     [applyRemoteDeckUpdate],
   );
@@ -1728,19 +1764,33 @@ export function DeckProvider({ children }: { children: ReactNode }) {
     [noteLocalCreate, setDecksLocal],
   );
 
-  const ensureDeckPersisted = useCallback(async (id: string) => {
-    const pendingCreate = pendingCreatePromisesRef.current.get(id);
-    if (pendingCreate) {
-      try {
-        await pendingCreate;
-        return true;
-      } catch {
-        return false;
+  const ensureDeckPersisted = useCallback(
+    async (id: string): Promise<DeckPersistenceResult> => {
+      const pendingCreate = pendingCreatePromisesRef.current.get(id);
+      if (pendingCreate) {
+        try {
+          await pendingCreate;
+          return { persisted: true };
+        } catch (error) {
+          return { persisted: false, reason: "request-failed", error };
+        }
       }
-    }
 
-    return (await fetchDeckFromAPI(id)) !== null;
-  }, []);
+      try {
+        const result = await callAction<unknown>(
+          "get-deck",
+          { id },
+          { method: "GET" },
+        );
+        return normalizeActionDeck(result)
+          ? { persisted: true }
+          : { persisted: false, reason: "not-found" };
+      } catch (error) {
+        return { persisted: false, reason: "request-failed", error };
+      }
+    },
+    [],
+  );
 
   const duplicateDeck = useCallback(
     (sourceDeckId: string, newId: string, title?: string): Deck | null => {
@@ -2150,6 +2200,7 @@ export function DeckProvider({ children }: { children: ReactNode }) {
         updateDeck,
         reloadDecks,
         reloadDecksWithStatus,
+        refreshOpenDeck: refetchOpenDeckIfChanged,
         getDeck,
         addSlide,
         updateSlide,

package/corpus/templates/slides/app/global.css

@@ -14,6 +14,12 @@
 
 @source "./**/*.{ts,tsx}";
 
+/* Keep the editable agent prompt readable even if the generated text utility
+   is missing or loses a cascade tie during the hosted build. */
+.agent-composer-root [data-agent-composer-slot="editor-input"] {
+  color: hsl(var(--foreground));
+}
+
 /* Hide the sidebar's built-in collapsed tab strip — AgentToggleButton in the
    toolbar serves this purpose instead, so we don't want a redundant bar. */
 button[title="Open agent sidebar"] {

package/corpus/templates/slides/app/i18n/en-US.ts

@@ -684,6 +684,7 @@ const messages = {
     googleSlidesReferenceConnect:
       "Connect Google Drive to import a Slides deck.",
     googleSlidesReferenceChoose: "Choose Google Slides deck",
+    googleSlidesReferenceUrl: "Paste a Google Slides link",
     googleSlidesReferencePicking: "Working...",
     googleSlidesReferenceConnected:
       "Connected. Choose a Google Slides deck to import as a reusable reference.",

package/corpus/templates/slides/app/lib/create-deck-generation.ts

@@ -4,7 +4,7 @@ import { flushSync } from "react-dom";
 
 import type { NewDeckReferenceSelection } from "@/components/editor/NewDeckReferenceStep";
 import type { UploadedFile } from "@/components/editor/PromptDialog";
-import type { Deck } from "@/context/DeckContext";
+import type { Deck, DeckPersistenceResult } from "@/context/DeckContext";
 import { createDeckAgentMessage } from "@/lib/agent-visible-message";
 
 interface DesignSystemGenerationContextResult {
@@ -100,7 +100,7 @@ function describeUploadedFilesForAgent(
     "",
     "File handling rules:",
     `- PPTX files: call \`import-pptx --filePath \"<path>\" --deckId ${deckId}\` before adding or editing slides.`,
-    `- PDF and DOCX files: call \`import-file --filePath \"<path>\" --format auto --deckId ${deckId}\` and use the returned extracted text as source material. The returned text is capped for reliability; re-run with maxChars only if more context is needed.`,
+    `- PDF and DOCX files: call \`import-file --filePath \"<path>\" --format auto --deckId ${deckId}\` and use the returned extracted text as source material. For a visual PDF whose original layout should be preserved, pass \`--importIntoDeck true\` instead of rebuilding the pages from extracted text.`,
     "- Text-like files: use the uploaded-text-file blocks already included in the prompt; do not call import-file for them.",
     '- Image files with an embeddable URL can be inserted directly into slide HTML as `<img src="...">` or used as visual references.',
     "- Image files without a URL are visual/reference assets only; do not claim to have processed a PPTX/PDF/DOCX unless the relevant import action succeeds.",
@@ -150,13 +150,17 @@ export interface StartDeckGenerationOptions {
   selectedReferenceDeckId?: string | null;
   designSystems: Array<{ id: string; title: string }>;
   createDeck: CreateDeck;
-  ensureDeckPersisted: (id: string) => Promise<boolean>;
+  ensureDeckPersisted: (id: string) => Promise<DeckPersistenceResult>;
   deleteDeck: (id: string) => void;
   navigate: Navigate;
   agentSubmit: SubmitAgent;
   onPromptClosed: () => void;
   onUnauthenticated: (prompt: string, hadFiles: boolean) => void;
-  onPersistenceFailure: (prompt: string, files: UploadedFile[]) => void;
+  onPersistenceFailure: (
+    prompt: string,
+    files: UploadedFile[],
+    failure: DeckPersistenceResult,
+  ) => void;
 }
 
 /** Create the optimistic deck, hydrate references, and start the agent run. */
@@ -214,8 +218,8 @@ export async function startDeckGeneration({
   onPromptClosed();
 
   const persisted = await ensureDeckPersisted(deck.id);
-  if (!persisted) {
-    onPersistenceFailure(prompt, filesForGeneration);
+  if (!persisted.persisted) {
+    onPersistenceFailure(prompt, filesForGeneration, persisted);
     deleteDeck(deckId);
     return "failed";
   }

package/corpus/templates/slides/app/lib/deck-preview-frame.ts

@@ -0,0 +1,15 @@
+import { getAspectRatioDims, type AspectRatio } from "./aspect-ratios";
+
+const LISTING_FRAME_RATIO = 16 / 9;
+
+export function getDeckListingPreviewFrameStyle(aspectRatio?: AspectRatio) {
+  const dimensions = getAspectRatioDims(aspectRatio);
+  const isListingRatio =
+    dimensions.width / dimensions.height >= LISTING_FRAME_RATIO;
+
+  return {
+    aspectRatio: `${dimensions.width} / ${dimensions.height}`,
+    height: "100%",
+    width: isListingRatio ? "100%" : "auto",
+  };
+}

package/corpus/templates/slides/app/lib/deck-share-links.ts

@@ -0,0 +1,9 @@
+export type DeckShareLinkKind = "editor" | "presentation";
+
+export function getDeckShareLinkOrder(
+  visibility?: "private" | "org" | "public",
+): { primary: DeckShareLinkKind; secondary: DeckShareLinkKind } {
+  return visibility === "public"
+    ? { primary: "presentation", secondary: "editor" }
+    : { primary: "editor", secondary: "presentation" };
+}

package/corpus/templates/slides/app/lib/export-pptx-client.ts

@@ -313,6 +313,94 @@ function widenNoWrapTextElements(root: HTMLElement) {
   }
 }
 
+/**
+ * dom-to-pptx serializes CSS gradients as one malformed diagonal SVG. Imported
+ * slides use a repeated master grid, so materialize that grid as a transparent
+ * image before handing the clone to the exporter and leave the real text and
+ * image objects editable.
+ */
+function materializeImportedBackgroundGrid(root: HTMLElement) {
+  const slideRoot = root.matches(".fmd-imported-pptx")
+    ? root
+    : root.querySelector<HTMLElement>(".fmd-imported-pptx");
+  if (!slideRoot) return;
+  const computed = window.getComputedStyle(slideRoot);
+  if (!computed.backgroundImage.includes("linear-gradient")) return;
+
+  const color = computed.backgroundImage.match(/rgb\([^)]*\)/)?.[0];
+  const size = computed.backgroundSize
+    .split(",")[0]
+    ?.trim()
+    .split(/\s+/)
+    .map((value) => Number.parseFloat(value));
+  const position = computed.backgroundPosition
+    .split(",")[0]
+    ?.trim()
+    .split(/\s+/)
+    .map((value) => Number.parseFloat(value));
+  const declaredLineWidth = computed.backgroundImage.match(
+    /\b0(?:px)?\s+([\d.]+)px\b/i,
+  )?.[1];
+  const lineWidth = declaredLineWidth
+    ? Number.parseFloat(declaredLineWidth)
+    : Number.NaN;
+  if (
+    !color ||
+    !size ||
+    size.length < 2 ||
+    !Number.isFinite(size[0]) ||
+    !Number.isFinite(size[1]) ||
+    size[0] <= 0 ||
+    size[1] <= 0 ||
+    !position ||
+    position.length < 2 ||
+    !Number.isFinite(position[0]) ||
+    !Number.isFinite(position[1]) ||
+    !Number.isFinite(lineWidth)
+  ) {
+    return;
+  }
+
+  const canvas = document.createElement("canvas");
+  canvas.width = Math.max(1, Math.round(slideRoot.clientWidth));
+  canvas.height = Math.max(1, Math.round(slideRoot.clientHeight));
+  const context = canvas.getContext("2d");
+  if (!context) return;
+  context.strokeStyle = color;
+  context.lineWidth = Math.max(0.5, lineWidth);
+
+  for (let x = position[0]; x < canvas.width; x += size[0]) {
+    context.beginPath();
+    context.moveTo(x + context.lineWidth / 2, 0);
+    context.lineTo(x + context.lineWidth / 2, canvas.height);
+    context.stroke();
+  }
+  for (let y = position[1]; y < canvas.height; y += size[1]) {
+    context.beginPath();
+    context.moveTo(0, y + context.lineWidth / 2);
+    context.lineTo(canvas.width, y + context.lineWidth / 2);
+    context.stroke();
+  }
+
+  const gridImage = document.createElement("img");
+  gridImage.alt = "";
+  gridImage.src = canvas.toDataURL("image/png");
+  Object.assign(gridImage.style, {
+    height: "100%",
+    left: "0",
+    pointerEvents: "none",
+    position: "absolute",
+    top: "0",
+    width: "100%",
+    zIndex: "0",
+  });
+  slideRoot.insertBefore(gridImage, slideRoot.firstChild);
+  slideRoot.style.backgroundImage = "none";
+  slideRoot.style.backgroundSize = "auto";
+  slideRoot.style.backgroundPosition = "0 0";
+  slideRoot.style.backgroundRepeat = "no-repeat";
+}
+
 export async function buildDeckPptxBlob(
   deckTitle: string,
   slides: PptxExportSlide[],
@@ -341,6 +429,7 @@ export async function buildDeckPptxBlob(
         height: dims.height,
       });
       exportClones.push(clone);
+      materializeImportedBackgroundGrid(clone.element);
       widenNoWrapTextElements(clone.element);
       await replaceInlineSvgsWithImages(clone.element);
       await preloadImagesWithCors(clone.element);

package/corpus/templates/slides/app/lib/slide-animation-elements.ts

@@ -118,6 +118,9 @@ export function animationElementKey(path: number[]): string {
 }
 
 export function findLegacyAnimationContainer(root: Element): Element | null {
+  const marked = root.querySelector(".fmd-animation-container");
+  if (marked && marked.children.length >= 1) return marked;
+
   const children = Array.from(root.children);
   for (let i = children.length - 1; i >= 0; i--) {
     if (children[i].children.length >= 2) return children[i];

package/corpus/templates/slides/app/pages/DeckEditor.tsx

@@ -155,6 +155,7 @@ export default function DeckEditor() {
     getDeck,
     reloadDecks,
     reloadDecksWithStatus,
+    refreshOpenDeck,
     updateDeck,
     updateSlide,
     deleteSlide,
@@ -396,6 +397,22 @@ export default function DeckEditor() {
     }
   }, [refetchOrg, reloadDecks]);
 
+  // The final generation write can race the last sync event. Pull the
+  // authoritative open deck when the run settles so a stale canvas does not
+  // require a browser refresh to reveal completed slides.
+  useEffect(() => {
+    if (
+      !id ||
+      !shouldClearNewDeckGeneratingState({
+        generating,
+        generationStarted: newDeckGenerationStarted.current,
+      })
+    ) {
+      return;
+    }
+    void refreshOpenDeck(id);
+  }, [generating, id, refreshOpenDeck]);
+
   // Clean up the generating URL param/ref when generation completes or when
   // the first slide lands, so partial progress is visible during long decks.
   useEffect(() => {