@marimo-team/islands 0.23.17-dev8 → 0.24.0

package/src/core/dom/outline.ts

@@ -63,13 +63,36 @@ function getOutline(html: string): Outline | null {
   return { items };
 }
 
+function toXPathStringLiteral(value: string): string {
+  if (!value.includes('"')) {
+    return `"${value}"`;
+  }
+  if (!value.includes("'")) {
+    return `'${value}'`;
+  }
+
+  const segments = value.split('"');
+  const literals: string[] = [];
+  for (const [index, segment] of segments.entries()) {
+    if (segment) {
+      literals.push(`"${segment}"`);
+    }
+    if (index < segments.length - 1) {
+      literals.push(`'"'`);
+    }
+  }
+  return `concat(${literals.join(", ")})`;
+}
+
 export function headingToIdentifier(heading: Element): OutlineItem["by"] {
   const id = heading.id;
   if (id) {
     return { id };
   }
-  const name = heading.textContent;
-  return { path: `//${heading.tagName}[contains(., "${name}")]` };
+  const name = heading.textContent ?? "";
+  return {
+    path: `//${heading.tagName}[contains(., ${toXPathStringLiteral(name)})]`,
+  };
 }
 
 export function mergeOutlines(outlines: (Outline | null)[]): Outline {

package/src/core/hotkeys/hotkeys.ts

@@ -393,11 +393,13 @@ const DEFAULT_HOT_KEY = {
     name: "Collapse all sections",
     group: "Editing",
     key: "Mod-Shift-\\",
+    additionalKeywords: ["fold", "headers"],
   },
   "global.expandAllSections": {
     name: "Expand all sections",
     group: "Editing",
     key: "Mod-Shift-/",
+    additionalKeywords: ["unfold", "headers"],
   },
   "global.toggleMinimap": {
     name: "Toggle Minimap",

package/src/core/mode.ts

@@ -55,20 +55,22 @@ export async function runDuringPresentMode(
   fn: () => void | Promise<void>,
 ): Promise<void> {
   const state = store.get(viewStateAtom);
-  if (state.mode === "present") {
+  if (state.mode !== "edit") {
     await fn();
     return;
   }
 
   store.set(viewStateAtom, { ...state, mode: "present" });
-  // Wait 100ms to allow the page to render
-  await new Promise((resolve) => setTimeout(resolve, 100));
-  // Wait 2 frames
-  await new Promise((resolve) => requestAnimationFrame(resolve));
-  await new Promise((resolve) => requestAnimationFrame(resolve));
-  await fn();
-  store.set(viewStateAtom, { ...state, mode: "edit" });
-  return undefined;
+  try {
+    // Wait 100ms to allow the page to render
+    await new Promise((resolve) => setTimeout(resolve, 100));
+    // Wait 2 frames
+    await new Promise((resolve) => requestAnimationFrame(resolve));
+    await new Promise((resolve) => requestAnimationFrame(resolve));
+    await fn();
+  } finally {
+    store.set(viewStateAtom, state);
+  }
 }
 
 export const viewStateAtom = atom<ViewState>({

package/src/core/network/__tests__/api.test.ts

@@ -105,7 +105,10 @@ describe("API", () => {
     });
 
     await expect(
-      API.handleExportResponse({ data: "markdown", response }),
+      API.handleExportResponse(
+        { data: "markdown", response },
+        { defaultFilename: "download.md" },
+      ),
     ).resolves.toEqual({
       contents: "markdown",
       filename: "résumé.qmd",
@@ -113,27 +116,139 @@ describe("API", () => {
     });
   });
 
-  it("rejects export responses without a filename", async () => {
+  it("parses quoted Content-Disposition filenames", async () => {
+    const response = new Response("html", {
+      headers: {
+        "Content-Disposition": 'inline; filename="notebook.html"',
+        "Content-Type": "text/html; charset=utf-8",
+      },
+    });
+
     await expect(
-      API.handleExportResponse({
-        data: "markdown",
-        response: new Response(null, {
-          headers: { "Content-Type": "text/plain" },
-        }),
-      }),
-    ).rejects.toThrow("Export response is missing a filename");
+      API.handleExportResponse(
+        { data: "html", response },
+        { defaultFilename: "download.html" },
+      ),
+    ).resolves.toEqual({
+      contents: "html",
+      filename: "notebook.html",
+      mediaType: "text/html; charset=utf-8",
+    });
+  });
+
+  it("parses unquoted Content-Disposition filenames", async () => {
+    const response = new Response("pdf", {
+      headers: {
+        "Content-Disposition": "attachment; filename=notebook.pdf",
+        "Content-Type": "application/pdf",
+      },
+    });
+
+    await expect(
+      API.handleExportResponse(
+        { data: "pdf", response },
+        { defaultFilename: "download.pdf" },
+      ),
+    ).resolves.toEqual({
+      contents: "pdf",
+      filename: "notebook.pdf",
+      mediaType: "application/pdf",
+    });
+  });
+
+  it("prefers RFC 5987 filenames over quoted fallbacks", async () => {
+    const response = new Response("markdown", {
+      headers: {
+        "Content-Disposition":
+          "attachment; filename=\"wrong.md\"; filename*=UTF-8''notebook.md",
+        "Content-Type": "text/plain; charset=utf-8",
+      },
+    });
+
+    await expect(
+      API.handleExportResponse(
+        { data: "markdown", response },
+        { defaultFilename: "download.md" },
+      ),
+    ).resolves.toEqual({
+      contents: "markdown",
+      filename: "notebook.md",
+      mediaType: "text/plain; charset=utf-8",
+    });
+  });
+
+  it("falls back to a default filename when headers are missing", async () => {
+    const response = new Response("markdown", {
+      headers: {
+        "Content-Type": "text/plain; charset=utf-8",
+      },
+    });
+
+    await expect(
+      API.handleExportResponse(
+        { data: "markdown", response },
+        { defaultFilename: "download.md" },
+      ),
+    ).resolves.toEqual({
+      contents: "markdown",
+      filename: "download.md",
+      mediaType: "text/plain; charset=utf-8",
+    });
+  });
+
+  it("falls back to a default filename when Content-Disposition is unparsable", async () => {
+    const response = new Response("markdown", {
+      headers: {
+        "Content-Disposition": "attachment",
+        "Content-Type": "text/plain; charset=utf-8",
+      },
+    });
+
+    await expect(
+      API.handleExportResponse(
+        { data: "markdown", response },
+        { defaultFilename: "download.md" },
+      ),
+    ).resolves.toEqual({
+      contents: "markdown",
+      filename: "download.md",
+      mediaType: "text/plain; charset=utf-8",
+    });
+  });
+
+  it("falls back to a default filename when RFC 5987 encoding is malformed", async () => {
+    const response = new Response("markdown", {
+      headers: {
+        "Content-Disposition": "attachment; filename*=UTF-8''%E0%A4%A",
+        "Content-Type": "text/plain; charset=utf-8",
+      },
+    });
+
+    await expect(
+      API.handleExportResponse(
+        { data: "markdown", response },
+        { defaultFilename: "download.md" },
+      ),
+    ).resolves.toEqual({
+      contents: "markdown",
+      filename: "download.md",
+      mediaType: "text/plain; charset=utf-8",
+    });
   });
 
   it("rejects export responses without a media type", async () => {
     await expect(
-      API.handleExportResponse({
-        data: "markdown",
-        response: new Response(null, {
-          headers: {
-            "Content-Disposition": "attachment; filename*=UTF-8''notebook.md",
-          },
-        }),
-      }),
+      API.handleExportResponse(
+        {
+          data: "markdown",
+          response: new Response(null, {
+            headers: {
+              "Content-Disposition": "attachment; filename*=UTF-8''notebook.md",
+            },
+          }),
+        },
+        { defaultFilename: "download.md" },
+      ),
     ).rejects.toThrow("Export response is missing a media type");
   });
 });

package/src/core/network/__tests__/export-filename.test.ts

@@ -0,0 +1,43 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { beforeEach, describe, expect, it } from "vitest";
+import { filenameAtom } from "@/core/saving/file-state";
+import { store } from "@/core/state/jotai";
+import {
+  getDefaultExportFilename,
+  getDefaultMarkdownExportFilename,
+} from "../export-filename";
+
+describe("default export filenames", () => {
+  beforeEach(() => {
+    store.set(filenameAtom, "folder/my_notebook.py");
+  });
+
+  it("derives filenames from the notebook name", () => {
+    expect(getDefaultExportFilename("html")).toBe("my_notebook.html");
+    expect(getDefaultExportFilename("pdf")).toBe("my_notebook.pdf");
+  });
+
+  it("handles Windows-style notebook paths", () => {
+    store.set(filenameAtom, "C:\\Users\\me\\my_notebook.py");
+    expect(getDefaultExportFilename("html")).toBe("my_notebook.html");
+  });
+
+  it("derives markdown filenames from the selected flavor", () => {
+    expect(getDefaultMarkdownExportFilename("qmd")).toBe("my_notebook.qmd");
+    expect(getDefaultMarkdownExportFilename("mystmd")).toBe(
+      "my_notebook.myst.md",
+    );
+  });
+
+  it("derives script export filenames from the notebook name", () => {
+    expect(getDefaultExportFilename("script.py")).toBe("my_notebook.script.py");
+  });
+
+  it("falls back to download.* when the notebook is unnamed", () => {
+    store.set(filenameAtom, null);
+    expect(getDefaultExportFilename("html")).toBe("download.html");
+    expect(getDefaultMarkdownExportFilename("qmd")).toBe("download.qmd");
+    expect(getDefaultExportFilename("script.py")).toBe("download.script.py");
+  });
+});

package/src/core/network/__tests__/requests-lazy.test.ts

@@ -84,6 +84,7 @@ describe("createLazyRequests", () => {
           format: "ipynb",
           dependenciesAvailable: false,
           missingPackages: ["nbformat"],
+          missingSetup: [],
         },
       ],
     };

package/src/core/network/api.ts

@@ -16,13 +16,45 @@ function getBaseUriWithoutQueryParams(): string {
   return url.toString();
 }
 
-function getExportFilename(response: Response): string {
-  const contentDisposition = response.headers.get("Content-Disposition");
-  const match = contentDisposition?.match(/filename\*=UTF-8''([^;]+)/i);
-  if (!match) {
-    throw new Error("Export response is missing a filename");
+function parseContentDispositionFilename(
+  contentDisposition: string | null,
+): string | undefined {
+  if (!contentDisposition) {
+    return undefined;
   }
-  return decodeURIComponent(match[1]);
+
+  const rfc5987Match = contentDisposition.match(/filename\*=UTF-8''([^;]+)/i);
+  if (rfc5987Match) {
+    try {
+      return decodeURIComponent(rfc5987Match[1]);
+    } catch {
+      return undefined;
+    }
+  }
+
+  const quotedMatch = contentDisposition.match(/filename="([^"]+)"/i);
+  if (quotedMatch) {
+    return quotedMatch[1];
+  }
+
+  const unquotedMatch = contentDisposition.match(/filename=([^;]+)/i);
+  if (unquotedMatch) {
+    return unquotedMatch[1].trim();
+  }
+
+  return undefined;
+}
+
+function getExportFilename(response: Response): string | undefined {
+  const filename = parseContentDispositionFilename(
+    response.headers.get("Content-Disposition"),
+  );
+  if (!filename) {
+    Logger.warn(
+      "Export response is missing a readable Content-Disposition filename",
+    );
+  }
+  return filename;
 }
 
 /**
@@ -129,11 +161,14 @@ export const API = {
     }
     return Promise.resolve(response.data as T);
   },
-  handleExportResponse: async <T extends BlobPart>(response: {
-    data?: T | undefined;
-    error?: Record<string, unknown>;
-    response: Response;
-  }): Promise<ExportedFile<T>> => {
+  handleExportResponse: async <T extends BlobPart>(
+    response: {
+      data?: T | undefined;
+      error?: Record<string, unknown>;
+      response: Response;
+    },
+    opts: { defaultFilename: string },
+  ): Promise<ExportedFile<T>> => {
     const contents = await API.handleResponse<T>(response);
     const mediaType = response.response.headers.get("Content-Type");
     if (!mediaType) {
@@ -142,7 +177,7 @@ export const API = {
 
     return {
       contents,
-      filename: getExportFilename(response.response),
+      filename: getExportFilename(response.response) ?? opts.defaultFilename,
       mediaType,
     };
   },

package/src/core/network/export-filename.ts

@@ -0,0 +1,37 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { filenameAtom } from "@/core/saving/file-state";
+import { store } from "@/core/state/jotai";
+import { Filenames } from "@/utils/filenames";
+import { Paths } from "@/utils/paths";
+import {
+  DEFAULT_MARKDOWN_FLAVOR,
+  MARKDOWN_EXTENSIONS,
+} from "./markdown-export";
+import type { ExportAsMarkdownRequest } from "./types";
+
+const DEFAULT_EXPORT_FILENAME = "download";
+
+function getNotebookStem(): string | undefined {
+  const filename = store.get(filenameAtom);
+  if (!filename) {
+    return undefined;
+  }
+  const basename = Paths.basename(filename);
+  return Filenames.withoutExtension(basename);
+}
+
+export function getDefaultExportFilename(extension: string): string {
+  const stem = getNotebookStem();
+  if (stem) {
+    return `${stem}.${extension}`;
+  }
+  return `${DEFAULT_EXPORT_FILENAME}.${extension}`;
+}
+
+export function getDefaultMarkdownExportFilename(
+  flavor: ExportAsMarkdownRequest["flavor"],
+): string {
+  const extension = MARKDOWN_EXTENSIONS[flavor ?? DEFAULT_MARKDOWN_FLAVOR];
+  return getDefaultExportFilename(extension);
+}

package/src/core/network/markdown-export.ts

@@ -0,0 +1,19 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import type { MarkdownExportFlavor } from "./types";
+
+export const MARKDOWN_EXTENSIONS = {
+  pymdown: "md",
+  qmd: "qmd",
+  mystmd: "myst.md",
+  mdx: "mdx",
+} satisfies Record<MarkdownExportFlavor, string>;
+export const MARKDOWN_SUFFIXES = [
+  ".myst.md",
+  ".markdown",
+  ".qmd",
+  ".mdx",
+  ".md",
+];
+
+export const DEFAULT_MARKDOWN_FLAVOR: MarkdownExportFlavor = "pymdown";

package/src/core/network/requests-network.ts

@@ -3,6 +3,10 @@
 import { once } from "@/utils/once";
 import { getRuntimeManager } from "../runtime/config";
 import { API, createClientWithRuntimeManager } from "./api";
+import {
+  getDefaultExportFilename,
+  getDefaultMarkdownExportFilename,
+} from "./export-filename";
 import {
   waitForConnectionOpen,
   waitForConnectionOpenIfNotebook,
@@ -426,7 +430,11 @@ export function createNetworkRequests(): EditRequests & RunRequests {
           parseAs: "text",
           params: getParams(),
         })
-        .then(handleExportResponse);
+        .then((response) =>
+          handleExportResponse(response, {
+            defaultFilename: getDefaultExportFilename("html"),
+          }),
+        );
     },
     exportAsMarkdown: async (request) => {
       return getClient()
@@ -435,7 +443,11 @@ export function createNetworkRequests(): EditRequests & RunRequests {
           parseAs: "text",
           params: getParams(),
         })
-        .then(handleExportResponse);
+        .then((response) =>
+          handleExportResponse(response, {
+            defaultFilename: getDefaultMarkdownExportFilename(request.flavor),
+          }),
+        );
     },
     exportAsScript: async (request) => {
       return getClient()
@@ -444,7 +456,11 @@ export function createNetworkRequests(): EditRequests & RunRequests {
           parseAs: "text",
           params: getParams(),
         })
-        .then(handleExportResponse);
+        .then((response) =>
+          handleExportResponse(response, {
+            defaultFilename: getDefaultExportFilename("script.py"),
+          }),
+        );
     },
     exportAsIPYNB: async (request) => {
       return getClient()
@@ -453,7 +469,11 @@ export function createNetworkRequests(): EditRequests & RunRequests {
           parseAs: "text",
           params: getParams(),
         })
-        .then(handleExportResponse);
+        .then((response) =>
+          handleExportResponse(response, {
+            defaultFilename: getDefaultExportFilename("ipynb"),
+          }),
+        );
     },
     exportAsPDF: async (request) => {
       return getClient()
@@ -462,7 +482,11 @@ export function createNetworkRequests(): EditRequests & RunRequests {
           parseAs: "blob",
           params: getParams(),
         })
-        .then(handleExportResponse);
+        .then((response) =>
+          handleExportResponse(response, {
+            defaultFilename: getDefaultExportFilename("pdf"),
+          }),
+        );
     },
     autoExportAsHTML: async (request) => {
       return getClient()

package/src/core/network/types.ts

@@ -22,6 +22,9 @@ export type AutoExportAsMarkdownRequest =
   schemas["AutoExportAsMarkdownRequest"];
 export type ExportAsHTMLRequest = schemas["ExportAsHTMLRequest"];
 export type ExportAsMarkdownRequest = schemas["ExportAsMarkdownRequest"];
+export type MarkdownExportFlavor = NonNullable<
+  ExportAsMarkdownRequest["flavor"]
+>;
 export type ExportAsIPYNBRequest = schemas["ExportAsIPYNBRequest"];
 export type ExportAsScriptRequest = schemas["ExportAsScriptRequest"];
 export type ExportAsPDFRequest = schemas["ExportAsPDFRequest"];
@@ -128,6 +131,7 @@ export type OpenTutorialRequest = schemas["OpenTutorialRequest"];
 export type TutorialId = OpenTutorialRequest["tutorialId"];
 export type InvokeAiToolRequest = schemas["InvokeAiToolRequest"];
 export type InvokeAiToolResponse = schemas["InvokeAiToolResponse"];
+export type ChatOptions = schemas["ChatOptions"];
 export type ClearCacheRequest = schemas["ClearCacheRequest"];
 export type GetCacheInfoRequest = schemas["GetCacheInfoRequest"];
 export type LspHealthResponse = schemas["LspHealthResponse"];

package/src/core/storage/types.ts

@@ -61,5 +61,6 @@ export type KnownStorageProtocol =
   | "http"
   | "file"
   | "gdrive"
+  | "hf"
   | "in-memory"
   | "github";

package/src/css/app/codemirror.css

@@ -1,14 +1,18 @@
 @reference "../globals.css";
 
 .light .cm-selectionBackground {
-  /* This is the background for selected text when focused,
-  but we want to use it when not in focus either because we
-  will often lose focus during find/replace or in another editor */
-  background-color: #d7d4f0 !important;
+  /* Keep drawn selections visible when focus moves to find/replace or another editor. */
+  background-color: var(
+    --cm-selection-background,
+    var(--cm-selection-background-light)
+  ) !important;
 }
 
 .dark .cm-selectionBackground {
-  background-color: #1177cc80 !important;
+  background-color: var(
+    --cm-selection-background,
+    var(--cm-selection-background-dark)
+  ) !important;
 }
 
 .cm-focused.cm-focused {
@@ -125,7 +129,7 @@
 /* -- Codeium -- */
 
 .cm-codeium-cycle {
-  font-size: 9px;
+  font-size: 0.5625rem;
   background-color: var(--sky-3);
   padding: 2px;
   border-radius: 2px;
@@ -133,7 +137,7 @@
 }
 
 .cm-codeium-cycle-key {
-  font-size: 9px;
+  font-size: 0.5625rem;
   font-family: monospace;
   display: inline-block;
   padding: 2px;

package/src/css/globals.css

@@ -107,6 +107,14 @@
     /* Codemirror editor */
     --cm-background: light-dark(var(--background), #282c34);
     --cm-comment: light-dark(#708090, #6b7280);
+    --cm-selection-background-light: #d7d4f0;
+    --cm-selection-background-dark: #1177cc80;
+    --cm-reactive-reference-color-light: #005f87;
+    --cm-reactive-reference-color-dark: #2a7aa5;
+    --cm-reactive-reference-border-color: #bad3de;
+    --cm-search-match-background-light: #99ff7780;
+    --cm-search-match-background-dark: #22bb0070;
+    --cm-search-match-selected-background-dark: #6199ff88;
   }
 
   .dark,

package/src/plugins/impl/DataEditorPlugin.tsx

@@ -8,10 +8,10 @@ import { LoadingTable } from "@/components/data-table/loading-table";
 import { type FieldTypes, toFieldTypes } from "@/components/data-table/types";
 import { Alert, AlertTitle } from "@/components/ui/alert";
 import { DelayMount } from "@/components/utils/delay-mount";
-import { DATA_TYPES } from "@/core/kernel/messages";
 import { useAsyncData } from "@/hooks/useAsyncData";
 import { createPlugin } from "../core/builder";
 import type { Setter } from "../types";
+import { columnToFieldTypesSchema } from "./data-frames/schema";
 import {
   BulkEdit,
   type DataEditorProps,
@@ -44,14 +44,7 @@ export const DataEditorPlugin = createPlugin<Edits>("marimo-data-editor", {
       }),
       label: z.string().nullable(),
       data: z.union([z.string(), z.array(z.object({}).passthrough())]),
-      fieldTypes: z
-        .array(
-          z.tuple([
-            z.coerce.string(),
-            z.tuple([z.enum(DATA_TYPES), z.string()]),
-          ]),
-        )
-        .nullish(),
+      fieldTypes: columnToFieldTypesSchema.nullish(),
       editableColumns: z.union([z.array(z.string()), z.literal("all")]),
       columnSizingMode: z.enum(["auto", "fit"]).default("auto"), // TODO: Remove this
     }),

package/src/plugins/impl/__tests__/DataEditorPlugin.test.ts

@@ -0,0 +1,18 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { describe, expect, it } from "vitest";
+import { DataEditorPlugin } from "../DataEditorPlugin";
+
+describe("DataEditorPlugin", () => {
+  it("normalizes an unrecognized field type", () => {
+    const result = DataEditorPlugin.validator.parse({
+      initialValue: { edits: [] },
+      label: null,
+      data: [],
+      fieldTypes: [["geom", ["geometry", "geometry"]]],
+      editableColumns: "all",
+    });
+
+    expect(result.fieldTypes).toEqual([["geom", ["unknown", "geometry"]]]);
+  });
+});