@marimo-team/islands 0.20.5-dev8 → 0.20.5-dev87

package/src/core/hotkeys/hotkeys.ts

@@ -27,11 +27,13 @@ export interface Hotkey {
    * @default true
    */
   editable?: boolean;
+  additionalKeywords?: string[];
 }
 
 interface ResolvedHotkey {
   name: string;
   key: string;
+  additionalKeywords?: string[];
 }
 
 type ModKey = "Cmd" | "Ctrl";
@@ -110,6 +112,7 @@ const DEFAULT_HOT_KEY = {
     name: "Run",
     group: "Running Cells",
     key: "Mod-Enter",
+    additionalKeywords: ["execute", "submit"],
   },
   "cell.runAndNewBelow": {
     name: "Run and new below",
@@ -132,6 +135,7 @@ const DEFAULT_HOT_KEY = {
     name: "Format cell",
     group: "Editing",
     key: "Mod-b",
+    additionalKeywords: ["lint"],
   },
   "cell.viewAsMarkdown": {
     name: "View as Markdown",
@@ -201,6 +205,7 @@ const DEFAULT_HOT_KEY = {
     name: "Delete cell",
     group: "Editing",
     key: "Shift-Backspace",
+    additionalKeywords: ["remove"],
   },
   "cell.hideCode": {
     name: "Hide cell code",
@@ -320,6 +325,7 @@ const DEFAULT_HOT_KEY = {
     name: "Save file",
     group: "Other",
     key: "Mod-s",
+    additionalKeywords: ["write", "persist"],
   },
   "global.commandPalette": {
     name: "Show command palette",
@@ -485,23 +491,26 @@ export class HotkeyProvider implements IHotkeyProvider {
   }
 
   getHotkey(action: HotkeyAction): ResolvedHotkey {
-    const { name, key } = this.hotkeys[action];
+    const { name, key, additionalKeywords } = this.hotkeys[action];
     if (typeof key === "string") {
       return {
         name,
         key: key.replace("Mod", this.mod),
+        additionalKeywords,
       };
     }
     if (key === NOT_SET) {
       return {
         name,
         key: "",
+        additionalKeywords,
       };
     }
     const platformKey = key[this.platform] || key.main;
     return {
       name,
       key: platformKey.replace("Mod", this.mod),
+      additionalKeywords,
     };
   }
 
@@ -535,10 +544,27 @@ export class OverridingHotkeyProvider extends HotkeyProvider {
 
   override getHotkey(action: HotkeyAction): ResolvedHotkey {
     const base = super.getHotkey(action);
-    const key = this.overrides[action] || base.key;
+    const override = this.overrides[action];
     return {
       name: base.name,
-      key,
+      key: override ? normalizeKeyString(override) : base.key,
+      additionalKeywords: base.additionalKeywords,
     };
   }
 }
+
+const MODIFIER_RE = /^(cmd|ctrl|alt|shift|meta|mod)$/i;
+
+/**
+ * Capitalize multi-character base key names so they match the
+ * casing that KeyboardEvent.key (and therefore CodeMirror) uses.
+ * e.g. "Shift-enter" → "Shift-Enter", "Cmd-backspace" → "Cmd-Backspace"
+ */
+export function normalizeKeyString(key: string): string {
+  const parts = key.split("-");
+  const last = parts[parts.length - 1];
+  if (last.length > 1 && !MODIFIER_RE.test(last)) {
+    parts[parts.length - 1] = last.charAt(0).toUpperCase() + last.slice(1);
+  }
+  return parts.join("-");
+}

package/src/core/islands/bridge.ts

@@ -181,6 +181,7 @@ export class IslandsPyodideBridge implements RunRequests, EditRequests {
   sendFileDetails = throwNotImplemented;
   openTutorial = throwNotImplemented;
   exportAsHTML = throwNotImplemented;
+  exportAsIPYNB = throwNotImplemented;
   exportAsMarkdown = throwNotImplemented;
   exportAsPDF = throwNotImplemented;
   autoExportAsHTML = throwNotImplemented;

package/src/core/islands/components/web-components.tsx

@@ -6,6 +6,7 @@ import ReactDOM, { type Root } from "react-dom/client";
 import { ErrorBoundary } from "@/components/editor/boundary/ErrorBoundary";
 import { TooltipProvider } from "@/components/ui/tooltip";
 import { notebookAtom } from "@/core/cells/cells";
+import { OBJECT_ID_ATTR } from "@/core/dom/ui-element-constants";
 import { UI_ELEMENT_REGISTRY } from "@/core/dom/uiregistry";
 import { LocaleProvider } from "@/core/i18n/locale-provider";
 import { renderHTML } from "@/plugins/core/RenderHTML";
@@ -60,7 +61,7 @@ export class MarimoIslandElement extends HTMLElement {
     const codeCallback: () => string = optionalEditor
       ? () =>
           `${UI_ELEMENT_REGISTRY.lookupValue(
-            optionalEditor.props["object-id"],
+            optionalEditor.props[OBJECT_ID_ATTR],
           )}`
       : () => code;
 

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

@@ -113,5 +113,22 @@ describe("createNetworkRequests", () => {
         }),
       );
     });
+
+    it("exportAsIPYNB should call the new endpoint as text", async () => {
+      const requests = createNetworkRequests();
+      await requests.exportAsIPYNB({
+        download: false,
+      } as any);
+
+      expect(mockClient.POST).toHaveBeenCalledWith(
+        "/api/export/ipynb",
+        expect.objectContaining({
+          body: expect.objectContaining({
+            download: false,
+          }),
+          parseAs: "text",
+        }),
+      );
+    });
   });
 });

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

@@ -49,6 +49,7 @@ const ACTIONS: Record<keyof AllRequests, Action> = {
 
   // Export operations start a connection
   exportAsHTML: "startConnection",
+  exportAsIPYNB: "startConnection",
   exportAsMarkdown: "startConnection",
   exportAsPDF: "startConnection",
   readCode: "startConnection",

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

@@ -381,6 +381,15 @@ export function createNetworkRequests(): EditRequests & RunRequests {
         })
         .then(handleResponse);
     },
+    exportAsIPYNB: async (request) => {
+      return getClient()
+        .POST("/api/export/ipynb", {
+          body: request,
+          parseAs: "text",
+          params: getParams(),
+        })
+        .then(handleResponse);
+    },
     exportAsPDF: async (request) => {
       return getClient()
         .POST("/api/export/pdf", {

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

@@ -75,6 +75,7 @@ export function createStaticRequests(): EditRequests & RunRequests {
     getRunningNotebooks: throwNotInEditMode,
     shutdownSession: throwNotInEditMode,
     exportAsHTML: throwNotInEditMode,
+    exportAsIPYNB: throwNotInEditMode,
     exportAsMarkdown: throwNotInEditMode,
     exportAsPDF: throwNotInEditMode,
     autoExportAsHTML: throwNotInEditMode,

package/src/core/network/requests-toasting.tsx

@@ -60,6 +60,7 @@ export function createErrorToastingRequests(
     getRunningNotebooks: "Failed to get running notebooks",
     shutdownSession: "Failed to shutdown session",
     exportAsHTML: "Failed to export HTML",
+    exportAsIPYNB: "Failed to export ipynb",
     exportAsMarkdown: "Failed to export Markdown",
     exportAsPDF: "Failed to export PDF",
     autoExportAsHTML: "", // No toast

package/src/core/network/types.ts

@@ -180,6 +180,7 @@ export interface EditRequests {
   ) => Promise<RunningNotebooksResponse>;
   // Export requests
   exportAsHTML: (request: ExportAsHTMLRequest) => Promise<string>;
+  exportAsIPYNB: (request: ExportAsIPYNBRequest) => Promise<string>;
   exportAsMarkdown: (request: ExportAsMarkdownRequest) => Promise<string>;
   exportAsPDF: (request: ExportAsPDFRequest) => Promise<Blob>;
   autoExportAsHTML: (request: ExportAsHTMLRequest) => Promise<null>;

package/src/core/runtime/__tests__/runtime.test.ts

@@ -1,6 +1,7 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
 import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { Mocks } from "@/__mocks__/common";
 import type { SessionId } from "@/core/kernel/session";
 import { Logger } from "@/utils/Logger";
 import { RuntimeManager } from "../runtime";
@@ -11,14 +12,7 @@ vi.mock("@/core/kernel/session", () => ({
   getSessionId: () => "test-session-id" as SessionId,
 }));
 
-// Mock the Logger module
-vi.mock("@/utils/Logger", () => ({
-  Logger: {
-    debug: vi.fn(),
-    error: vi.fn(),
-    warn: vi.fn(),
-  },
-}));
+vi.mock("@/utils/Logger", () => ({ Logger: Mocks.quietLogger() }));
 
 describe("RuntimeManager", () => {
   const mockConfig: RuntimeConfig = {

package/src/core/storage/__tests__/state.test.ts

@@ -10,6 +10,7 @@ function makeNamespace(
   overrides: Partial<StorageNamespace> & { name: string },
 ): StorageNamespace {
   return {
+    backendType: overrides.backendType ?? "obstore",
     displayName: overrides.displayName ?? overrides.name,
     name: overrides.name,
     protocol: overrides.protocol ?? "s3",

package/src/core/wasm/bridge.ts

@@ -587,6 +587,7 @@ export class PyodideBridge implements RunRequests, EditRequests {
   getWorkspaceFiles = throwNotImplemented;
   getRunningNotebooks = throwNotImplemented;
   shutdownSession = throwNotImplemented;
+  exportAsIPYNB = throwNotImplemented;
   exportAsPDF = throwNotImplemented;
   autoExportAsHTML = throwNotImplemented;
   autoExportAsMarkdown = throwNotImplemented;

package/src/core/websocket/useMarimoKernelConnection.tsx

@@ -317,6 +317,8 @@ export function useMarimoKernelConnection(opts: {
           codes: msg.data.codes,
           ids: msg.data.cell_ids as CellId[],
           codeIsStale: msg.data.code_is_stale,
+          names: msg.data.names,
+          configs: msg.data.configs,
         });
         return;
       case "update-cell-ids":

package/src/plugins/impl/DataTablePlugin.tsx

@@ -60,7 +60,11 @@ import { ContextAwarePanelItem } from "@/components/editor/chrome/panels/context
 import { Alert, AlertTitle } from "@/components/ui/alert";
 import { Button } from "@/components/ui/button";
 import { DelayMount } from "@/components/utils/delay-mount";
-import { type CellId, findCellId } from "@/core/cells/ids";
+import { type CellId, findCellId, UIElementId } from "@/core/cells/ids";
+import {
+  OBJECT_ID_ATTR,
+  RANDOM_ID_ATTR,
+} from "@/core/dom/ui-element-constants";
 import { slotsController } from "@/core/slots/slots";
 import { store } from "@/core/state/jotai";
 import { isStaticNotebook } from "@/core/static/static-state";
@@ -361,6 +365,7 @@ export const DataTablePlugin = createPlugin<S>("marimo-table")
         <LazyDataTableComponent
           isLazy={props.data.lazy}
           preload={props.data.preload}
+          host={props.host}
         >
           <LoadingDataTableComponent
             {...props.data}
@@ -377,21 +382,66 @@ export const DataTablePlugin = createPlugin<S>("marimo-table")
     );
   });
 
+/**
+ * Tracks which lazy tables have been previewed across remounts (e.g. tab switches).
+ * Keyed by uiElementId (stable across remounts) with randomId as value
+ * (changes on cell re-execution, so stale entries are naturally invalidated).
+ */
+const previewedTables = new Map<UIElementId, string>();
+
+function wasTablePreviewed(
+  uiElementId: UIElementId | null | undefined,
+  randomId: string | null | undefined,
+): boolean {
+  return (
+    uiElementId != null &&
+    randomId != null &&
+    previewedTables.get(uiElementId) === randomId
+  );
+}
+
+function markTablePreviewed(
+  uiElementId: UIElementId | null | undefined,
+  randomId: string | null | undefined,
+): void {
+  if (uiElementId != null && randomId != null) {
+    previewedTables.set(uiElementId, randomId);
+  }
+}
+
 const LazyDataTableComponent = ({
   isLazy: initialIsLazy,
   children,
   preload,
+  host,
 }: {
   isLazy: boolean;
   children: React.ReactNode;
   preload: boolean;
+  host: HTMLElement;
 }) => {
-  const [isLazy, setIsLazy] = useState(initialIsLazy && !preload);
+  const parentElement = host.closest(`[${OBJECT_ID_ATTR}]`);
+  const uiElementId = parentElement ? UIElementId.parse(parentElement) : null;
+
+  const randomId = host
+    .closest(`[${RANDOM_ID_ATTR}]`)
+    ?.getAttribute(RANDOM_ID_ATTR);
+
+  const [isLazy, setIsLazy] = useState(
+    initialIsLazy && !preload && !wasTablePreviewed(uiElementId, randomId),
+  );
 
   if (isLazy) {
     return (
       <div className="flex h-20 items-center justify-center">
-        <Button variant="outline" size="xs" onClick={() => setIsLazy(false)}>
+        <Button
+          variant="outline"
+          size="xs"
+          onClick={() => {
+            markTablePreviewed(uiElementId, randomId);
+            setIsLazy(false);
+          }}
+        >
           <Table2Icon className="mr-2 h-4 w-4" />
           Preview data
         </Button>

package/src/plugins/impl/FileBrowserPlugin.tsx

@@ -4,10 +4,10 @@ import { CornerLeftUp } from "lucide-react";
 import { type JSX, useEffect, useState } from "react";
 import { z } from "zod";
 import {
-  FILE_TYPE_ICONS,
-  type FileType,
-  guessFileType,
-} from "@/components/editor/file-tree/types";
+  FILE_ICON as FILE_TYPE_ICONS,
+  type FileIconType as FileType,
+  guessFileIconType as guessFileType,
+} from "@/components/editor/file-tree/file-icons";
 import { Spinner } from "@/components/icons/spinner";
 import { Button } from "@/components/ui/button";
 import { Checkbox } from "@/components/ui/checkbox";
@@ -15,6 +15,7 @@ import { Label } from "@/components/ui/label";
 import { NativeSelect } from "@/components/ui/native-select";
 import { Table, TableBody, TableCell, TableRow } from "@/components/ui/table";
 import { toast } from "@/components/ui/use-toast";
+import { RANDOM_ID_ATTR } from "@/core/dom/ui-element-constants";
 import { useAsyncData } from "@/hooks/useAsyncData";
 import { useInternalStateWithSync } from "@/hooks/useInternalStateWithSync";
 import { cn } from "@/utils/cn";
@@ -150,7 +151,9 @@ export const FileBrowser = ({
 
   // HACK: use the random-id of the host element to force a re-render
   // when the random-id changes, this means the cell was re-rendered
-  const randomId = host.closest("[random-id]")?.getAttribute("random-id");
+  const randomId = host
+    .closest(`[${RANDOM_ID_ATTR}]`)
+    ?.getAttribute(RANDOM_ID_ATTR);
 
   const { data, error, isPending } = useAsyncData(() => {
     return list_directory({ path: path });

package/src/plugins/impl/__tests__/DataTablePlugin.test.tsx

@@ -4,6 +4,7 @@ import { TooltipProvider } from "@radix-ui/react-tooltip";
 import { act, render, screen, waitFor } from "@testing-library/react";
 import { Provider } from "jotai";
 import { beforeAll, describe, expect, it, vi } from "vitest";
+import { SetupMocks } from "@/__mocks__/common";
 import type { DownloadAsArgs } from "@/components/data-table/schemas";
 import type { FieldTypesWithExternalType } from "@/components/data-table/types";
 import { store } from "@/core/state/jotai";
@@ -14,17 +15,7 @@ import {
 } from "../DataTablePlugin";
 
 beforeAll(() => {
-  global.ResizeObserver = class ResizeObserver {
-    observe() {
-      // do nothing
-    }
-    unobserve() {
-      // do nothing
-    }
-    disconnect() {
-      // do nothing
-    }
-  };
+  SetupMocks.resizeObserver();
 });
 
 describe("LoadingDataTableComponent", () => {

package/src/plugins/impl/__tests__/DropdownPlugin.test.tsx

@@ -3,23 +3,14 @@
 import { fireEvent, render, screen } from "@testing-library/react";
 import { beforeAll, describe, expect, it, vi } from "vitest";
 import type { z } from "zod";
+import { SetupMocks } from "@/__mocks__/common";
 import { initialModeAtom } from "@/core/mode";
 import { store } from "@/core/state/jotai";
 import type { IPluginProps } from "../../types";
 import { DropdownPlugin } from "../DropdownPlugin";
 
 beforeAll(() => {
-  global.ResizeObserver = class ResizeObserver {
-    observe() {
-      // do nothing
-    }
-    unobserve() {
-      // do nothing
-    }
-    disconnect() {
-      // do nothing
-    }
-  };
+  SetupMocks.resizeObserver();
   global.HTMLDivElement.prototype.scrollIntoView = () => {
     // do nothing
   };

package/src/plugins/impl/anywidget/AnyWidgetPlugin.tsx

@@ -4,6 +4,7 @@
 import type { AnyWidget } from "@anywidget/types";
 import { useEffect, useRef } from "react";
 import { z } from "zod";
+import { RANDOM_ID_ATTR } from "@/core/dom/ui-element-constants";
 import { useAsyncData } from "@/hooks/useAsyncData";
 import type { HTMLElementNotDerivedFromRef } from "@/hooks/useEventListener";
 import { createPlugin } from "@/plugins/core/builder";
@@ -145,7 +146,9 @@ const AnyWidgetSlot = (props: IPluginProps<ModelIdRef, Data>) => {
   }
 
   // Find the closest parent element with an attribute of `random-id`
-  const randomId = props.host.closest("[random-id]")?.getAttribute("random-id");
+  const randomId = props.host
+    .closest(`[${RANDOM_ID_ATTR}]`)
+    ?.getAttribute(RANDOM_ID_ATTR);
   const key = randomId ?? jsUrl;
 
   return (