@agent-native/core 0.141.6 → 0.144.0

package/corpus/templates/slides/app/components/editor/SlideEditor.tsx

@@ -71,6 +71,7 @@ import {
   createSlidesCanvasGestureController,
   isWithinSlidesCanvasEdgeMoveBand,
   resolveSlidesCanvasPointerIntent,
+  resolveSlidesCanvasDragTarget,
   slidesCanvasInteractionCore,
 } from "./canvas-interactions";
 import ImageOverlay from "./ImageOverlay";
@@ -125,6 +126,12 @@ import {
 } from "./slide-object-interactions";
 import { getPassiveSlidePresenceUsers } from "./slide-presence";
 import { type SlideStylePatch, type SlideStyleSnapshot } from "./slide-style";
+import {
+  findSmartBlock,
+  isInlineTextElement,
+  isTextLeaf,
+  shouldStampBuilderId,
+} from "./slide-text-targets";
 import { SlideContextToolbar } from "./SlideContextToolbar";
 import { SlideOverflowWarning } from "./SlideOverflowWarning";
 import { SpeakerNotesPanel } from "./SpeakerNotesPanel";
@@ -145,6 +152,15 @@ function isPersistedFreeformObject(element: HTMLElement): boolean {
   );
 }
 
+function isSlideCanvasShell(element: HTMLElement): boolean {
+  return (
+    element.classList.contains("fmd-slide") ||
+    element.classList.contains("fmd-autofit-scale") ||
+    element.hasAttribute("data-fmd-autofit-content") ||
+    element.hasAttribute("data-slide-canvas")
+  );
+}
+
 function ensureBuilderId(element: HTMLElement): string {
   const existing = element.getAttribute("data-builder-id");
   if (existing) return existing;
@@ -153,12 +169,16 @@ function ensureBuilderId(element: HTMLElement): string {
   return id;
 }
 
-/** Stamp all elements inside a container with unique data-builder-id attributes */
+/** Stamp selectable elements inside a container with transient builder ids. */
 function stampBuilderIds(container: HTMLElement) {
   const elements = container.querySelectorAll("*");
   elements.forEach((el) => {
-    if ((el as HTMLElement).classList.contains("fmd-layout-spacer")) return;
-    ensureBuilderId(el as HTMLElement);
+    const element = el as HTMLElement;
+    if (!shouldStampBuilderId(element)) {
+      element.removeAttribute("data-builder-id");
+      return;
+    }
+    ensureBuilderId(element);
   });
 }
 
@@ -169,108 +189,9 @@ function getBuilderSelector(el: HTMLElement): string | null {
   return null;
 }
 
-/** Inline tags allowed inside a "text leaf" element */
-const INLINE_TAGS = new Set([
-  "SPAN",
-  "STRONG",
-  "EM",
-  "B",
-  "I",
-  "U",
-  "A",
-  "BR",
-  "CODE",
-  "SUB",
-  "SUP",
-  "MARK",
-  "SMALL",
-  "S",
-  "FONT",
-]);
-
 /** Block tags that can hold rich multi-paragraph content */
 const RICH_BLOCK_TAGS = new Set(["P", "DIV", "BLOCKQUOTE", "LI", "UL", "OL"]);
 
-/**
- * A "text leaf" is a block-level element whose children are only text nodes
- * or inline elements — i.e. it's safe to make contentEditable without
- * exposing layout containers to editing.
- */
-function isTextLeaf(el: HTMLElement): boolean {
-  if (!el || el.tagName === "IMG") return false;
-  if (el.classList.contains("fmd-img-placeholder")) return false;
-  // A user-placed text box stays editable even after its content is fully
-  // deleted, so an emptied box does not degrade into an unrecognized shape.
-  if (el.classList.contains("fmd-text-box")) return true;
-  // Must contain some text
-  if (!el.textContent?.trim()) return false;
-  for (const child of Array.from(el.children)) {
-    if (!INLINE_TAGS.has(child.tagName)) return false;
-  }
-  return true;
-}
-
-/**
- * A "smart group" is a container whose children are all text leaves OR
- * nested smart groups — i.e. a container that exists purely to hold text
- * chunks with no images / layout islands mixed in. These are safe to edit
- * as a single contentEditable region so users can work with multiple
- * chunks (bullet rows, stat pairs, bodies of paragraphs) at once.
- */
-function isSmartGroup(el: HTMLElement): boolean {
-  if (!el) return false;
-  if (el.tagName === "IMG") return false;
-  if (el.classList.contains("fmd-img-placeholder")) return false;
-  const children = Array.from(el.children);
-  if (children.length < 2) return false;
-  // Must contain some text overall
-  if (!el.textContent?.trim()) return false;
-  for (const child of children) {
-    const c = child as HTMLElement;
-    if (c.tagName === "IMG") return false;
-    if (c.classList.contains("fmd-img-placeholder")) return false;
-    if (!isTextLeaf(c) && !isSmartGroup(c)) return false;
-  }
-  return true;
-}
-
-/**
- * Find the "smart block" to edit for a given click target. A smart block is
- * either:
- *   - a text leaf (single line / single rich text block), or
- *   - a smart group that is itself inside the top-level fmd-slide wrapper —
- *     i.e. a logical grouping of text chunks (a bullet list, a pair of
- *     stat number + label, etc.).
- *
- * We walk up from the click target and prefer the DEEPEST meaningful block
- * so each double-click targets the most specific editable region. Users who
- * want to edit multiple chunks together can double-click the whitespace
- * between them, or double-click a group's border — the click will resolve
- * to the group element rather than any single child.
- */
-function findSmartBlock(
-  target: HTMLElement,
-  root: HTMLElement,
-): HTMLElement | null {
-  let el: HTMLElement | null = target;
-  while (el && root.contains(el)) {
-    if (isTextLeaf(el)) {
-      // A list item (native <li> or a styled bullet row) must be edited
-      // together with its siblings so Enter can add a new item — editing a
-      // single item in isolation traps Enter inside that one row.
-      const list = findEnclosingList(el, root);
-      if (list) return list;
-      return el;
-    }
-    // The click landed on a container (e.g. a flex wrapper around stat
-    // rows). If that container is a smart group, use IT as the block so
-    // the user gets multi-chunk editing of everything inside.
-    if (isSmartGroup(el)) return el;
-    el = el.parentElement;
-  }
-  return null;
-}
-
 /** Strip renderer/editor-only attributes from an HTML string before saving */
 function stripBuilderIds(html: string): string {
   let cleaned = html;
@@ -2485,16 +2406,19 @@ export default function SlideEditor({
   ]);
 
   /**
-   * Find the nearest meaningful "element" for multi-select from a click target.
-   * Walks up to the closest [data-builder-id] inside the slide content. Skips
-   * the slide-content root itself (clicking the slide background means
-   * "deselect / start marquee", not "select the whole slide").
+   * Find the nearest meaningful element for multi-select from a click target.
+   * Inline text markup is presentation only, so walk through it to the
+   * containing block. The slide-content root itself starts a marquee instead.
    */
   const findSelectableId = useCallback(
     (target: HTMLElement, slideContent: HTMLElement): string | null => {
       let el: HTMLElement | null = target;
       while (el && slideContent.contains(el) && el !== slideContent) {
         if (el.classList.contains("fmd-layout-spacer")) return null;
+        if (isInlineTextElement(el)) {
+          el = el.parentElement;
+          continue;
+        }
         const id = el.getAttribute("data-builder-id");
         if (id) return id;
         el = el.parentElement;
@@ -2509,6 +2433,10 @@ export default function SlideEditor({
       let el: HTMLElement | null = target;
       while (el && slideContent.contains(el) && el !== slideContent) {
         if (el.classList.contains("fmd-layout-spacer")) return null;
+        if (isInlineTextElement(el)) {
+          el = el.parentElement;
+          continue;
+        }
         if (el.getAttribute("data-builder-id")) return el;
         el = el.parentElement;
       }
@@ -2522,9 +2450,10 @@ export default function SlideEditor({
     (target: HTMLElement, slideContent: HTMLElement): boolean => {
       // The slide root itself, or a direct child container that has no text /
       // image content at the point of click. Simplest heuristic: target IS
-      // the slide-content element, OR it's the .fmd-slide wrapper.
-      if (target === slideContent) return true;
-      if (target.classList.contains("fmd-slide")) return true;
+      // the slide-content element, OR it's one of the renderer's structural
+      // shells. Those shells are not user objects and must remain marquee
+      // surfaces rather than becoming draggable freeform objects.
+      if (target === slideContent || isSlideCanvasShell(target)) return true;
       return false;
     },
     [],
@@ -2840,9 +2769,7 @@ export default function SlideEditor({
       const slideCanvas = element.closest(
         ".fmd-slide, [data-slide-canvas]",
       ) as HTMLElement | null;
-      if (!slideCanvas || getComputedStyle(element).position !== "absolute") {
-        return;
-      }
+      if (!slideCanvas) return;
 
       const slideRect = slideCanvas.getBoundingClientRect();
       const slideWidth = slideCanvas.offsetWidth;
@@ -2866,10 +2793,74 @@ export default function SlideEditor({
         suppressNextClickRef.current = true;
       }
 
-      const origin = getObjectGeometry(element);
+      const initiallyAbsolute =
+        getComputedStyle(element).position === "absolute";
+      let origin = initiallyAbsolute ? getObjectGeometry(element) : null;
       const originalObjectId = element.getAttribute("data-slide-object-id");
+      const originalClassName = element.className;
+      const originalStyle = element.getAttribute("style");
+      const originalContentEditable = element.getAttribute("contenteditable");
+      const originalEditingBlock = element.getAttribute("data-editing-block");
       let activeElement = element;
       let clone: HTMLElement | null = null;
+      let restoreMarkdownTree: (() => void) | undefined;
+      let promotedToFreeform = false;
+
+      const promoteForDrag = () => {
+        if (origin) return true;
+        const frozen = freezeElementForFreeformSelection(element);
+        if (!frozen) {
+          return false;
+        }
+        restoreMarkdownTree = frozen.restoreMarkdownTree;
+        if (getComputedStyle(element).position !== "absolute") {
+          restoreMarkdownTree?.();
+          restoreMarkdownTree = undefined;
+          return false;
+        }
+        promotedToFreeform = true;
+        origin = getObjectGeometry(element);
+        return true;
+      };
+
+      const removeFreeformLayoutSpacer = () => {
+        const objectId = element.getAttribute("data-slide-object-id");
+        if (!objectId) return;
+        const spacer = Array.from(
+          element.parentElement?.querySelectorAll<HTMLElement>(
+            "[data-slide-layout-spacer-for]",
+          ) ?? [],
+        ).find(
+          (candidate) =>
+            candidate.getAttribute("data-slide-layout-spacer-for") === objectId,
+        );
+        spacer?.remove();
+      };
+
+      const restorePromotedElement = () => {
+        removeFreeformLayoutSpacer();
+        restoreMarkdownTree?.();
+        if (!restoreMarkdownTree) {
+          element.className = originalClassName;
+          if (originalStyle === null) element.removeAttribute("style");
+          else element.setAttribute("style", originalStyle);
+          if (originalContentEditable === null) {
+            element.removeAttribute("contenteditable");
+          } else {
+            element.setAttribute("contenteditable", originalContentEditable);
+          }
+          if (originalEditingBlock === null) {
+            element.removeAttribute("data-editing-block");
+          } else {
+            element.setAttribute("data-editing-block", originalEditingBlock);
+          }
+        }
+        if (originalObjectId) {
+          element.setAttribute("data-slide-object-id", originalObjectId);
+        } else {
+          element.removeAttribute("data-slide-object-id");
+        }
+      };
 
       const stop = () => {
         window.removeEventListener("pointermove", onMove);
@@ -2883,13 +2874,16 @@ export default function SlideEditor({
       const restore = () => {
         if (clone) {
           clone.remove();
-        } else {
-          applyObjectGeometry(element, origin);
         }
-        if (originalObjectId) {
-          element.setAttribute("data-slide-object-id", originalObjectId);
+        if (promotedToFreeform) {
+          restorePromotedElement();
         } else {
-          element.removeAttribute("data-slide-object-id");
+          if (!clone && origin) applyObjectGeometry(element, origin);
+          if (originalObjectId) {
+            element.setAttribute("data-slide-object-id", originalObjectId);
+          } else {
+            element.removeAttribute("data-slide-object-id");
+          }
         }
         const selector = getBuilderSelector(element);
         if (selector) selectElementForStyling(element, selector);
@@ -2897,6 +2891,13 @@ export default function SlideEditor({
 
       const controller = createSlidesCanvasGestureController({
         preview: (gesture) => {
+          if (!promoteForDrag()) {
+            return { handled: false, reason: "unhandled" };
+          }
+          const dragOrigin = origin;
+          if (!dragOrigin) {
+            return { handled: false, reason: "unhandled" };
+          }
           // React still receives a click after a pointer drag. Suppress that
           // trailing click so a moved text box does not immediately reopen
           // inline editing.
@@ -2910,15 +2911,19 @@ export default function SlideEditor({
             activeElement = clone;
           }
           applyObjectGeometry(activeElement, {
-            ...origin,
-            x: origin.x + gesture.canvasDelta.x,
-            y: origin.y + gesture.canvasDelta.y,
+            ...dragOrigin,
+            x: dragOrigin.x + gesture.canvasDelta.x,
+            y: dragOrigin.y + gesture.canvasDelta.y,
           });
           const selector = getBuilderSelector(activeElement);
           if (selector) selectElementForStyling(activeElement, selector);
           return { handled: true };
         },
         commit: (gesture) => {
+          if (!origin) {
+            restore();
+            return { handled: false, reason: "unhandled" };
+          }
           // Keeping Option pressed is the explicit duplicate commit. If it
           // was released before drop, turn the gesture back into a normal move.
           if (clone && !gesture.duplicate) {
@@ -2927,6 +2932,15 @@ export default function SlideEditor({
             activeElement = element;
           }
           const html = readCurrentSlideContentHtml();
+          // Markdown slides temporarily move their ReactMarkdown children into
+          // an fmd canvas during promotion. Restore that live tree after
+          // serialization and before the state write so React can reconcile
+          // the switch to persisted raw HTML cleanly.
+          if (restoreMarkdownTree) {
+            removeFreeformLayoutSpacer();
+            restoreMarkdownTree();
+            restoreMarkdownTree = undefined;
+          }
           if (html !== null) {
             onUpdateSlideRef.current({ content: html }, undefined, {
               persistence: "immediate",
@@ -3441,7 +3455,7 @@ export default function SlideEditor({
       const selected = resolveSelectedElement();
       const shouldShowMoveCursor =
         selected !== null &&
-        getComputedStyle(selected).position === "absolute" &&
+        !isSlideCanvasShell(selected) &&
         isWithinSlidesCanvasEdgeMoveBand(
           selected.getBoundingClientRect(),
           e.clientX,
@@ -3490,29 +3504,32 @@ export default function SlideEditor({
       }
 
       const selected = resolveSelectedElement();
+      const clicked = findSelectableElement(target, slideContent);
+      const dragTarget = resolveSlidesCanvasDragTarget(
+        selected && !isSlideCanvasShell(selected) ? selected : null,
+        clicked && !isSlideCanvasShell(clicked) ? clicked : null,
+      );
       const pointerIntent = resolveSlidesCanvasPointerIntent({
-        hasSelectedObject:
-          selected !== null &&
-          getComputedStyle(selected).position === "absolute",
-        targetWithinSelectedObject: selected?.contains(target) ?? false,
-        targetContainsSelectedObject: selected
-          ? target.contains(selected)
+        hasSelectedObject: dragTarget !== null,
+        targetWithinSelectedObject: dragTarget?.contains(target) ?? false,
+        targetContainsSelectedObject: dragTarget
+          ? target.contains(dragTarget)
           : false,
         pointerWithinMoveBand:
-          selected !== null &&
+          dragTarget !== null &&
           isWithinSlidesCanvasEdgeMoveBand(
-            selected.getBoundingClientRect(),
+            dragTarget.getBoundingClientRect(),
             e.clientX,
             e.clientY,
           ),
         targetIsEditableText: Boolean(findSmartBlock(target, slideContent)),
       });
       if (
-        selected &&
+        dragTarget &&
         (pointerIntent === "move-object-body" ||
           pointerIntent === "move-object-perimeter")
       ) {
-        startElementDrag(e, selected, {
+        startElementDrag(e, dragTarget, {
           preserveClickWithoutMove: pointerIntent === "move-object-body",
         });
         return;
@@ -3598,6 +3615,7 @@ export default function SlideEditor({
       candidates.forEach((node) => {
         const el = node as HTMLElement;
         if (el.classList.contains("fmd-layout-spacer")) return;
+        if (isInlineTextElement(el)) return;
         const id = el.getAttribute("data-builder-id");
         if (!id) return;
         // Skip the slide-content root itself if it ever got stamped
@@ -3744,6 +3762,21 @@ export default function SlideEditor({
     ],
   );
 
+  const clearCanvasSelection = useCallback(() => {
+    if (editingEl) exitInlineEdit();
+    if (multiSelection.size > 0) clearMultiSelection();
+    setSelectedImg(null);
+    setImageOverlay(null);
+    clearSelectedElement();
+    syncSelectionToAppState(null);
+  }, [
+    clearMultiSelection,
+    clearSelectedElement,
+    editingEl,
+    exitInlineEdit,
+    multiSelection.size,
+  ]);
+
   const handleSlideClick = useCallback(
     (e: React.MouseEvent) => {
       if (suppressNextClickRef.current) {
@@ -3776,9 +3809,7 @@ export default function SlideEditor({
       // pointerdown already cleared it for non-additive drags, but a click
       // with zero movement won't trigger pointerup with a real rect).
       if (slideContent && isSlideWhitespaceTarget(target, slideContent)) {
-        if (multiSelection.size > 0) clearMultiSelection();
-        clearSelectedElement();
-        syncSelectionToAppState(null);
+        clearCanvasSelection();
         return;
       }
 
@@ -3834,7 +3865,7 @@ export default function SlideEditor({
       multiSelection,
       applyMultiSelection,
       clearMultiSelection,
-      clearSelectedElement,
+      clearCanvasSelection,
       selectElementForStyling,
       readOnly,
       isHtmlSlide,
@@ -3842,6 +3873,16 @@ export default function SlideEditor({
     ],
   );
 
+  const handleCanvasBackgroundPointerDown = useCallback(
+    (e: React.PointerEvent<HTMLDivElement>) => {
+      if (e.button !== 0) return;
+      const target = e.target instanceof Element ? e.target : null;
+      if (target && slideCanvasRef.current?.contains(target)) return;
+      clearCanvasSelection();
+    },
+    [clearCanvasSelection],
+  );
+
   const handleSlideContextMenu = useCallback(
     (e: React.MouseEvent) => {
       const target = e.target as HTMLElement;
@@ -4096,11 +4137,9 @@ export default function SlideEditor({
   const slideElementSelected =
     !!selectedImg || !!editingEl || !!selectedStyleSnapshot;
 
-  // Dragging is only offered for elements with position: absolute — our own
-  // placed text boxes, and any similarly-positioned shape. left/top on a
-  // position: relative element is an offset from its normal flow position
-  // rather than an absolute coordinate, so treating "not static" as
-  // draggable would move relative-positioned elements by the wrong amount.
+  // Resize handles are only offered for elements with position: absolute.
+  // Flow objects become absolute only after a real drag crosses the gesture
+  // threshold, so a stationary click keeps its existing edit/select behavior.
   const selectedForDrag =
     selectedElementRect && !editingEl ? resolveSelectedElement() : null;
   const isSelectedElementDraggable = selectedForDrag
@@ -4215,6 +4254,7 @@ export default function SlideEditor({
                 <div
                   ref={canvasTrackRef}
                   className="flex min-h-full w-max min-w-full items-center justify-center p-2 pt-14 sm:p-4 sm:pt-14 md:p-8 md:pt-16"
+                  onPointerDown={handleCanvasBackgroundPointerDown}
                 >
                   <div
                     ref={containerRef}
@@ -4232,6 +4272,7 @@ export default function SlideEditor({
                       onPointerDown={handleSlidePointerDown}
                       onPointerMove={handleSlidePointerMove}
                       onPointerLeave={clearEdgeMoveCursor}
+                      onDragStart={(event) => event.preventDefault()}
                       onDragOver={handleSlideDragOver}
                       onDrop={handleSlideDrop}
                     >

package/corpus/templates/slides/app/components/editor/canvas-interactions/index.ts

@@ -2,6 +2,7 @@ export {
   createSlidesCanvasGestureController,
   createSlidesCanvasInteractionCore,
   isWithinSlidesCanvasEdgeMoveBand,
+  resolveSlidesCanvasDragTarget,
   resolveSlidesCanvasPointerIntent,
   slidesCanvasInteractionCore,
   SLIDES_CANVAS_EDGE_MOVE_BAND,

package/corpus/templates/slides/app/components/editor/canvas-interactions/slides-canvas-adapter.ts

@@ -95,6 +95,24 @@ export type SlidesCanvasPointerIntent =
   | "move-object-perimeter"
   | "none";
 
+/** Prefer the current selection when the pointer is inside it; otherwise the
+ * object under the pointer becomes the drag candidate, including on the first
+ * press before its click has updated selection state. */
+export function resolveSlidesCanvasDragTarget(
+  selectedObject: HTMLElement | null,
+  pointerObject: HTMLElement | null,
+): HTMLElement | null {
+  if (
+    selectedObject &&
+    pointerObject &&
+    (selectedObject.contains(pointerObject) ||
+      pointerObject.contains(selectedObject))
+  ) {
+    return selectedObject;
+  }
+  return pointerObject ?? selectedObject;
+}
+
 /**
  * Slides supplies hit testing and this policy decision, while the shared
  * gesture controller owns threshold, coordinate, modifier, and resize math.

package/corpus/templates/slides/app/components/editor/slide-text-targets.ts

@@ -0,0 +1,85 @@
+import { findEnclosingList } from "./bullet-editing";
+
+/** Inline markup changes presentation, but does not create a canvas target. */
+const INLINE_TEXT_TAGS = new Set([
+  "SPAN",
+  "STRONG",
+  "EM",
+  "B",
+  "I",
+  "U",
+  "A",
+  "BR",
+  "CODE",
+  "SUB",
+  "SUP",
+  "MARK",
+  "SMALL",
+  "S",
+  "FONT",
+]);
+
+export function isInlineTextElement(element: Element): boolean {
+  return INLINE_TEXT_TAGS.has(element.tagName);
+}
+
+export function shouldStampBuilderId(element: HTMLElement): boolean {
+  return (
+    !element.classList.contains("fmd-layout-spacer") &&
+    !isInlineTextElement(element)
+  );
+}
+
+/**
+ * A text leaf is a block-level element whose children are text nodes or inline
+ * elements. Inline style runs are deliberately not text leaves themselves.
+ */
+export function isTextLeaf(element: HTMLElement): boolean {
+  if (!element || isInlineTextElement(element) || element.tagName === "IMG") {
+    return false;
+  }
+  if (element.classList.contains("fmd-img-placeholder")) return false;
+  // A user-placed text box stays editable after its content is deleted.
+  if (element.classList.contains("fmd-text-box")) return true;
+  if (!element.textContent?.trim()) return false;
+  for (const child of Array.from(element.children)) {
+    if (!isInlineTextElement(child)) return false;
+  }
+  return true;
+}
+
+/** A container made only of text leaves or nested text groups. */
+export function isSmartGroup(element: HTMLElement): boolean {
+  if (!element || isInlineTextElement(element) || element.tagName === "IMG") {
+    return false;
+  }
+  if (element.classList.contains("fmd-img-placeholder")) return false;
+  const children = Array.from(element.children);
+  if (children.length < 2) return false;
+  if (!element.textContent?.trim()) return false;
+  for (const child of children) {
+    const childElement = child as HTMLElement;
+    if (childElement.tagName === "IMG") return false;
+    if (childElement.classList.contains("fmd-img-placeholder")) return false;
+    if (!isTextLeaf(childElement) && !isSmartGroup(childElement)) return false;
+  }
+  return true;
+}
+
+/** Resolve a click inside inline markup to the containing editable text block. */
+export function findSmartBlock(
+  target: HTMLElement,
+  root: HTMLElement,
+): HTMLElement | null {
+  let element: HTMLElement | null = target;
+  while (element && root.contains(element)) {
+    if (isTextLeaf(element)) {
+      const list = findEnclosingList(element, root);
+      if (list) return list;
+      return element;
+    }
+    if (isSmartGroup(element)) return element;
+    element = element.parentElement;
+  }
+  return null;
+}

package/corpus/templates/slides/app/components/layout/Layout.tsx

@@ -12,6 +12,7 @@ import { useSidebarCollapsed } from "@/hooks/use-sidebar-collapsed";
 import { TAB_ID } from "@/lib/tab-id";
 import { cn } from "@/lib/utils";
 
+import { GoogleDriveConnectionCta } from "../editor/GoogleDriveConnectionCta";
 import { AgentWorkIndicator } from "./AgentWorkIndicator";
 import { Header } from "./Header";
 import {
@@ -117,7 +118,9 @@ export function Layout({ children }: LayoutProps) {
         scope={deckScope}
         browserTabId={TAB_ID}
         agentPageHref="/agent"
+        suppressFirstRunOnboarding={isSlidesEditorRoute(location.pathname)}
         composerSlot={<CreativeContextComposerChip />}
+        threadFooterSlot={<GoogleDriveConnectionCta />}
       >
         <div className="agent-layout-shell flex h-screen w-full overflow-hidden bg-background text-foreground">
           {sidebarOpen && (