@marimo-team/islands 0.24.3-dev5 → 0.24.3-dev52

package/src/components/chat/acp/agent-panel.tsx

@@ -902,6 +902,18 @@ const AgentPanel: React.FC = () => {
         return;
       }
 
+      let absoluteFilename: string;
+      try {
+        absoluteFilename = getAbsoluteFilename();
+      } catch {
+        toast({
+          title: "Notebook must be named",
+          description: "Please name the notebook to use the agent",
+          variant: "danger",
+        });
+        return;
+      }
+
       logger.debug("Submitting prompt to agent", {
         sessionId: activeSessionId,
       });
@@ -914,62 +926,51 @@ const AgentPanel: React.FC = () => {
         setSessionState((prev) => updateSessionTitle(prev, prompt));
       }
 
-      let absoluteFilename: string;
       try {
-        absoluteFilename = getAbsoluteFilename();
-      } catch {
-        toast({
-          title: "Notebook must be named",
-          description: "Please name the notebook to use the agent",
-          variant: "danger",
-        });
-        return;
-      }
-
-      const promptBlocks: ContentBlock[] = [{ type: "text", text: prompt }];
+        const promptBlocks: ContentBlock[] = [{ type: "text", text: prompt }];
 
-      // Parse context from the prompt
-      const { contextBlocks, attachmentBlocks } =
-        await parseContextFromPrompt(prompt);
-      promptBlocks.push(...contextBlocks, ...attachmentBlocks);
+        // Parse context from the prompt
+        const { contextBlocks, attachmentBlocks } =
+          await parseContextFromPrompt(prompt);
+        promptBlocks.push(...contextBlocks, ...attachmentBlocks);
 
-      // Add manually uploaded files as resource links
-      if (files && files.length > 0) {
-        const fileResourceLinks = await convertFilesToResourceLinks(files);
-        promptBlocks.push(...fileResourceLinks);
-      }
+        // Add manually uploaded files as resource links
+        if (files && files.length > 0) {
+          const fileResourceLinks = await convertFilesToResourceLinks(files);
+          promptBlocks.push(...fileResourceLinks);
+        }
 
-      const hasGivenRules = notifications.some(
-        (notification) =>
-          notification.type === "session_notification" &&
-          notification.data.update.sessionUpdate === "user_message_chunk",
-      );
-      if (!hasGivenRules) {
-        promptBlocks.push(
-          {
-            type: "resource_link",
-            uri: absoluteFilename,
-            mimeType: "text/x-python",
-            name: absoluteFilename,
-          },
-          {
-            type: "resource",
-            resource: {
-              uri: "marimo_rules.md",
-              mimeType: "text/plain",
-              text: getAgentPrompt(absoluteFilename),
-            },
-          },
+        const hasGivenRules = notifications.some(
+          (notification) =>
+            notification.type === "session_notification" &&
+            notification.data.update.sessionUpdate === "user_message_chunk",
         );
-      }
+        if (!hasGivenRules) {
+          promptBlocks.push(
+            {
+              type: "resource_link",
+              uri: absoluteFilename,
+              mimeType: "text/x-python",
+              name: absoluteFilename,
+            },
+            {
+              type: "resource",
+              resource: {
+                uri: "marimo_rules.md",
+                mimeType: "text/plain",
+                text: getAgentPrompt(absoluteFilename),
+              },
+            },
+          );
+        }
 
-      try {
         await agent.prompt({
           sessionId: activeSessionId,
           prompt: promptBlocks,
         });
       } catch (error) {
         logger.error("Failed to send prompt", { error });
+        setError(error instanceof Error ? error : String(error));
       } finally {
         setIsLoading(false);
       }

package/src/components/data-table/column-explorer-panel/column-explorer.tsx

@@ -10,7 +10,7 @@ import {
   EyeIcon,
   EyeOffIcon,
 } from "lucide-react";
-import { useMemo, useState } from "react";
+import { useState } from "react";
 import { useLocale } from "react-aria";
 import {
   AddDataframeChart,
@@ -98,11 +98,7 @@ export function ColumnExplorerPanel<TData>({
     hiddenColumns: hiddenColumnCount,
   } = getColumnCountForDisplay(table, totalColumns);
   const { visible: visibleColumnCount } = getUserColumnVisibilityCounts(table);
-  const columnVisibility = table.getState().columnVisibility;
-  const showOnlyColumnState = useMemo(
-    () => getShowOnlyColumnState(table),
-    [table, columnVisibility],
-  );
+  const showOnlyColumnState = getShowOnlyColumnState(table);
 
   const { rowsAndColumns, hiddenSuffix } = prettifyRowColumnCount({
     numRows: totalRows,

package/src/components/data-table/column-summary/chart-spec-model.tsx

@@ -573,7 +573,7 @@ export class ColumnChartSpecModel<T> {
         };
       }
       case "boolean": {
-        if (!stats?.true || !stats?.false) {
+        if (stats?.true == null || stats?.false == null) {
           return getLegacyBooleanSpec(column, base, MAX_BAR_HEIGHT);
         }
 

package/src/components/data-table/columns.tsx

@@ -20,7 +20,6 @@ import { Maps } from "@/utils/maps";
 import { maxFractionalDigits } from "@/utils/numbers";
 import { Objects } from "@/utils/objects";
 import { parseContent } from "@/utils/url-parser";
-import { EmotionCacheProvider } from "../editor/output/EmotionCacheProvider";
 import { JsonOutput } from "../editor/output/JsonOutput";
 import { CopyClipboardIcon } from "../icons/copy-icon";
 import { Button } from "../ui/button";
@@ -412,76 +411,74 @@ const PopoutColumn = ({
     : rawStringValue;
 
   return (
-    <EmotionCacheProvider container={null}>
-      <Popover>
-        <PopoverTrigger
-          ref={triggerRef}
-          className={cn(cellStyles, "max-w-fit outline-hidden")}
-          onClick={selectCell}
-          onMouseDown={(e) => {
-            // Prevent cell underneath from being selected
-            e.stopPropagation();
-          }}
-        >
-          <span
-            className={cn(
-              "cursor-pointer hover:text-link",
-              wrapped && COLUMN_WRAPPING_STYLES,
-            )}
-            title={rawStringValue}
-          >
-            {edges ? <WhitespaceMarkers value={edges.leading} /> : null}
-            {displayText}
-            {edges ? <WhitespaceMarkers value={edges.trailing} /> : null}
-          </span>
-        </PopoverTrigger>
-        <PopoverContent
+    <Popover>
+      <PopoverTrigger
+        ref={triggerRef}
+        className={cn(cellStyles, "max-w-fit outline-hidden")}
+        onClick={selectCell}
+        onMouseDown={(e) => {
+          // Prevent cell underneath from being selected
+          e.stopPropagation();
+        }}
+      >
+        <span
           className={cn(
-            contentClassName,
-            scrollable && "flex flex-col overflow-hidden",
+            "cursor-pointer hover:text-link",
+            wrapped && COLUMN_WRAPPING_STYLES,
           )}
-          align="start"
-          alignOffset={10}
-          onInteractOutside={(event) => {
-            // Radix sees the shadow host as the target. Resolve the original
-            // target so pointer-down does not dismiss before click toggles.
-            const target = Events.composedTarget(event.detail.originalEvent);
-            if (triggerRef.current?.contains(target)) {
-              event.preventDefault();
-            }
-          }}
+          title={rawStringValue}
         >
-          <div
-            className={cn(
-              "flex -mt-3 -mr-2",
-              scrollable ? "shrink-0 justify-end" : "float-right",
-            )}
-          >
-            <CopyClipboardIcon
-              value={rawStringValue}
-              className="size-3 hover:text-link"
-              buttonClassName="flex size-5 items-center justify-center"
-              tooltip={false}
-            />
-            <PopoverClose asChild={true}>
-              <Button
-                variant="link"
-                size="xs"
-                className={cn("size-5 p-0", !buttonText && "ml-1.5 mr-1")}
-                aria-label="Close"
-              >
-                {buttonText ?? "Close"}
-              </Button>
-            </PopoverClose>
-          </div>
-          {scrollable ? (
-            <div className="min-h-0 overflow-auto">{children}</div>
-          ) : (
-            children
+          {edges ? <WhitespaceMarkers value={edges.leading} /> : null}
+          {displayText}
+          {edges ? <WhitespaceMarkers value={edges.trailing} /> : null}
+        </span>
+      </PopoverTrigger>
+      <PopoverContent
+        className={cn(
+          contentClassName,
+          scrollable && "flex flex-col overflow-hidden",
+        )}
+        align="start"
+        alignOffset={10}
+        onInteractOutside={(event) => {
+          // Radix sees the shadow host as the target. Resolve the original
+          // target so pointer-down does not dismiss before click toggles.
+          const target = Events.composedTarget(event.detail.originalEvent);
+          if (triggerRef.current?.contains(target)) {
+            event.preventDefault();
+          }
+        }}
+      >
+        <div
+          className={cn(
+            "flex -mt-3 -mr-2",
+            scrollable ? "shrink-0 justify-end" : "float-right",
           )}
-        </PopoverContent>
-      </Popover>
-    </EmotionCacheProvider>
+        >
+          <CopyClipboardIcon
+            value={rawStringValue}
+            className="size-3 hover:text-link"
+            buttonClassName="flex size-5 items-center justify-center"
+            tooltip={false}
+          />
+          <PopoverClose asChild={true}>
+            <Button
+              variant="link"
+              size="xs"
+              className={cn("size-5 p-0", !buttonText && "ml-1.5 mr-1")}
+              aria-label="Close"
+            >
+              {buttonText ?? "Close"}
+            </Button>
+          </PopoverClose>
+        </div>
+        {scrollable ? (
+          <div className="min-h-0 overflow-auto">{children}</div>
+        ) : (
+          children
+        )}
+      </PopoverContent>
+    </Popover>
   );
 };
 

package/src/components/editor/RecoveryButton.tsx

@@ -60,6 +60,7 @@ const RecoveryModal = (props: {
   // NB: we use markdown class to have sane styling for list, paragraph
   return (
     <DialogContent className="w-fit">
+      {/* oxlint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- Handle Escape from any control within the recovery form. */}
       <form
         onSubmit={(e) => {
           e.preventDefault();

package/src/components/editor/__tests__/dynamic-favicon.test.tsx

@@ -1,6 +1,6 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
-import { render } from "@testing-library/react";
+import { render, waitFor } from "@testing-library/react";
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { useCellErrors } from "@/core/cells/cells";
 import { DynamicFavicon } from "../dynamic-favicon";
@@ -14,6 +14,10 @@ describe("DynamicFavicon", () => {
   let favicon: HTMLLinkElement;
 
   beforeEach(() => {
+    document
+      .querySelectorAll("link[rel~='icon']")
+      .forEach((element) => element.remove());
+
     // Mock favicon element
     favicon = document.createElement("link");
     favicon.rel = "icon";
@@ -28,7 +32,9 @@ describe("DynamicFavicon", () => {
   });
 
   afterEach(() => {
-    favicon.remove();
+    document
+      .querySelectorAll("link[rel~='icon']")
+      .forEach((element) => element.remove());
     vi.clearAllMocks();
     vi.useRealTimers();
   });
@@ -113,6 +119,34 @@ describe("DynamicFavicon", () => {
     expect(newFavicon).not.toBeNull();
   });
 
+  it("recreates a removed favicon when the window regains focus", async () => {
+    render(<DynamicFavicon isRunning={false} />);
+    favicon.remove();
+
+    window.dispatchEvent(new Event("focus"));
+
+    await waitFor(() => {
+      const currentFavicon =
+        document.querySelector<HTMLLinkElement>("link[rel~='icon']");
+      expect(currentFavicon?.href.endsWith("favicon.ico")).toBe(true);
+    });
+  });
+
+  it("resets the current favicon after the link is replaced", async () => {
+    render(<DynamicFavicon isRunning={false} />);
+    const replacement = document.createElement("link");
+    replacement.rel = "icon";
+    replacement.href = "./replacement.ico";
+    favicon.replaceWith(replacement);
+
+    window.dispatchEvent(new Event("focus"));
+
+    await waitFor(() => {
+      expect(replacement.href.endsWith("favicon.ico")).toBe(true);
+      expect(document.querySelector("link[rel~='icon']")).toBe(replacement);
+    });
+  });
+
   describe("notifications", () => {
     beforeEach(() => {
       vi.spyOn(document, "visibilityState", "get").mockReturnValue("hidden");

package/src/components/editor/actions/__tests__/pair-with-agent-commands.test.ts

@@ -10,10 +10,12 @@ import {
   maskToken,
 } from "../pair-with-agent-commands";
 import { shellQuote } from "@/utils/shell";
+import { PAIR_PREVIEW } from "@/__tests__/fixtures/pair-preview";
 
 const CONNECTION: ConnectionInfo = {
   url: "http://localhost:8000",
   file: "notebooks/example.py",
+  session: "s_ab12cd",
 };
 
 const CONNECTION_WITHOUT_FILE: ConnectionInfo = {
@@ -104,6 +106,61 @@ describe("getMarimoCommand", () => {
 });
 
 describe("getTerminalCommand", () => {
+  it("uses the preview launcher in production and quotes session-only targets", () => {
+    vi.stubEnv("DEV", false);
+    try {
+      expect(
+        getTerminalCommand(
+          "claude",
+          { url: "http://host:8000?a=1&b=2", session: "s_' {file}" },
+          false,
+          { ...PAIR_PREVIEW, command: "uvx marimo@latest" },
+        ),
+      ).toBe(
+        String.raw`claude "$(MARIMO_PAIR_NEXT=1 uvx marimo@latest pair prompt \
+  --url 'http://host:8000?a=1&b=2' \
+  --session 's_'"'"' {file}')"`,
+      );
+      expect(
+        getTerminalCommand(
+          "codex",
+          CONNECTION_WITHOUT_FILE,
+          false,
+          PAIR_PREVIEW,
+        ),
+      ).toBe(
+        String.raw`codex "$(MARIMO_PAIR_NEXT=1 uv run marimo pair prompt \
+  --url http://localhost:8000)"`,
+      );
+    } finally {
+      vi.unstubAllEnvs();
+    }
+  });
+
+  it.each([
+    ["claude", "claude"],
+    ["codex", "codex"],
+    ["opencode", "opencode --prompt"],
+  ] as const)(
+    "enables the preview inside the %s prompt command",
+    (agent, cli) => {
+      expect(
+        getTerminalCommand(
+          agent,
+          { ...CONNECTION, session: "s_ab12cd" },
+          true,
+          PAIR_PREVIEW,
+        ),
+      ).toBe(
+        String.raw`${cli} "$(MARIMO_PAIR_NEXT=1 uv run marimo pair prompt \
+  --url http://localhost:8000 \
+  --file notebooks/example.py \
+  --session s_ab12cd \
+  --with-token)"`,
+      );
+    },
+  );
+
   it("includes the url and file for each agent", () => {
     expect(getTerminalCommand("claude", CONNECTION, false)).toBe(
       `claude "$(uv run marimo pair prompt --url http://localhost:8000 --file notebooks/example.py --claude)"`,
@@ -169,6 +226,64 @@ describe("getTerminalCommand", () => {
 });
 
 describe("getRawPrompt", () => {
+  it("uses supplied templates without reinterpreting inserted values", () => {
+    expect(
+      getRawPrompt(
+        {
+          url: "http://host/{file}",
+          file: "{session}/it's.py",
+          session: "{command}",
+        },
+        "tok'en {file} $&",
+        {
+          ...PAIR_PREVIEW,
+          command: "custom marimo",
+          templates: {
+            ...PAIR_PREVIEW.templates,
+            prompt: "{command}\n{url}\n{file}{session}{authentication}",
+          },
+        },
+      ),
+    ).toBe(
+      "custom marimo\nhttp://host/{file}\nFile: {session}/it's.py\nSession: {command}\n" +
+        `\n\nFor authenticated Pair commands, set \`export MARIMO_TOKEN='tok'"'"'en {file} $&'\` in the shell that runs marimo.`,
+    );
+  });
+
+  it.each([
+    [CONNECTION_WITHOUT_FILE, ""],
+    [
+      { ...CONNECTION_WITHOUT_FILE, session: "s_ab12cd" },
+      "Session: s_ab12cd\n",
+    ],
+    [
+      { ...CONNECTION_WITHOUT_FILE, file: "notebook.py" },
+      "File: notebook.py\n",
+    ],
+  ])("omits absent preview fields for %j", (connection, fields) => {
+    expect(getRawPrompt(connection, null, PAIR_PREVIEW)).toBe(
+      "Pair with me on this running marimo notebook.\n\n" +
+        `URL: http://localhost:8000\n${fields}\n` +
+        "Run `uv run marimo pair --help` first.\n" +
+        "Use `uv run marimo` for all marimo commands.\n\n" +
+        "Once connected, send a fun toast using `mo.status.toast(...)` (`import marimo as mo`).",
+    );
+  });
+
+  it("renders the shared preview template with optional session context", () => {
+    expect(
+      getRawPrompt({ ...CONNECTION, session: "s_ab12cd" }, null, PAIR_PREVIEW),
+    ).toBe(
+      "Pair with me on this running marimo notebook.\n\n" +
+        "URL: http://localhost:8000\n" +
+        "File: notebooks/example.py\n" +
+        "Session: s_ab12cd\n\n" +
+        "Run `uv run marimo pair --help` first.\n" +
+        "Use `uv run marimo` for all marimo commands.\n\n" +
+        "Once connected, send a fun toast using `mo.status.toast(...)` (`import marimo as mo`).",
+    );
+  });
+
   it("references the file-scoped execute-code command", () => {
     const prompt = getRawPrompt(CONNECTION, null);
     expect(prompt).toContain(