@marimo-team/islands 0.23.6-dev31 → 0.23.6-dev32

package/dist/{code-visibility-tF2qI5eL.js → code-visibility-CyBvO931.js}

@@ -25507,7 +25507,7 @@ ${_}`,
       return Logger.warn("Failed to get version from mount config"), null;
     }
   }
-  marimoVersionAtom = atom(getVersionFromMountConfig() || "0.23.6-dev31");
+  marimoVersionAtom = atom(getVersionFromMountConfig() || "0.23.6-dev32");
   showCodeInRunModeAtom = atom(true);
   atom(null);
   var import_compiler_runtime = require_compiler_runtime();

package/dist/main.js

@@ -26,7 +26,7 @@ import { $ as useCellActions, At as DeferredRequestRegistry, B as safeExtractSet
 import { __tla as __tla_1 } from "./chunk-5FQGJX7Z-CO1e63h_.js";
 import { o as useSize, s as Root$3, u as createLucideIcon } from "./dist-ESg7xyoD.js";
 import { A as SquareFunction, C as DEFAULT_COLOR_SCHEME, D as SCALE_TYPE_DESCRIPTIONS, E as EMPTY_VALUE$1, O as TIME_UNIT_DESCRIPTIONS, S as DEFAULT_AGGREGATION, T as DEFAULT_TIME_UNIT, _ as AGGREGATION_TYPE_DESCRIPTIONS, a as AGGREGATION_FNS$1, b as COLOR_SCHEMES, c as COLOR_BY_FIELDS, d as NONE_VALUE, f as SELECTABLE_DATA_TYPES, g as TIME_UNITS, h as STRING_AGGREGATION_FNS, i as convertDataTypeToSelectable, j as ChartColumn, k as escapeFieldName, l as COMBINED_TIME_UNITS, m as SORT_TYPES, n as createSpecWithoutData, o as BIN_AGGREGATION, p as SINGLE_TIME_UNITS, r as isFieldSet, s as CHART_TYPES, t as augmentSpecWithData, u as ChartType, v as AGGREGATION_TYPE_ICON, w as DEFAULT_MAX_BINS_FACET, x as COUNT_FIELD, y as CHART_TYPE_ICON } from "./spec-DSIuqd3f.js";
-import { $ as getPageIndexForRow, A as contextAwarePanelType, At as EyeOff, B as TableHead, Bt as ArrowDownWideNarrow, C as useInternalStateWithSync, Ct as RenderTextWithLinks, D as PANEL_TYPES, Dt as TextWrap, E as ContextAwarePanelItem, Et as EmotionCacheProvider, F as Fill, Ft as ChevronsUpDown, G as inferFieldTypes, H as TableRow, I as Provider$1, It as ChevronsRight, J as ColumnChartSpecModel, K as renderCellValue, L as Table, Lt as ChevronsLeft, M as SlotNames, Mt as Ellipsis, N as slotsController, Nt as Download, O as contextAwarePanelOpen, Ot as GripHorizontal, P as Toggle, Pt as Code, Q as filtersToFilterGroup, R as TableBody, Rt as ChevronsDownUp, S as prettifyRowCount, St as useOverflowDetection, T as ComboboxItem, Tt as HtmlOutput, U as NAMELESS_COLUMN_PREFIX, V as TableHeader, W as generateColumns, X as useIntersectionObserver, Y as DelayMount, Z as usePrevious$1, _ as downloadBlob, _t as TabsTrigger, at as toFieldTypes, b as Filenames, bt as ChartLoadingState, c as Slide, ct as CommandEmpty, d as JsonOutput, dt as CommandList, et as loadTableAndRawData, f as OutputArea, ft as CommandSeparator, g as ADD_PRINTING_CLASS, gt as TabsList, h as InstallPackageButton, ht as TabsContent, it as TOO_MANY_ROWS, j as isCellAwareAtom, k as contextAwarePanelOwner, kt as Funnel, l as RadioGroup, lt as CommandInput, m as DataTable, mt as Tabs, n as marimoVersionAtom, nt as INDEX_COLUMN_NAME, o as SLIDE_TYPE_OPTIONS_BY_VALUE, ot as getMimeValues, p as OutputRenderer, pt as Maps, q as ColumnChartContext, r as showCodeInRunModeAtom, rt as SELECT_COLUMN_ID, st as Command, t as useNotebookCodeAvailable, tt as loadTableData, u as RadioGroupItem, ut as CommandItem, v as downloadByURL, vt as ChartErrorState, w as Combobox, wt as Kbd, x as prettifyRowColumnCount, xt as LazyVegaEmbed, y as downloadHTMLAsImage, yt as ChartInfoState, z as TableCell, zt as ChevronLeft, __tla as __tla_2 } from "./code-visibility-tF2qI5eL.js";
+import { $ as getPageIndexForRow, A as contextAwarePanelType, At as EyeOff, B as TableHead, Bt as ArrowDownWideNarrow, C as useInternalStateWithSync, Ct as RenderTextWithLinks, D as PANEL_TYPES, Dt as TextWrap, E as ContextAwarePanelItem, Et as EmotionCacheProvider, F as Fill, Ft as ChevronsUpDown, G as inferFieldTypes, H as TableRow, I as Provider$1, It as ChevronsRight, J as ColumnChartSpecModel, K as renderCellValue, L as Table, Lt as ChevronsLeft, M as SlotNames, Mt as Ellipsis, N as slotsController, Nt as Download, O as contextAwarePanelOpen, Ot as GripHorizontal, P as Toggle, Pt as Code, Q as filtersToFilterGroup, R as TableBody, Rt as ChevronsDownUp, S as prettifyRowCount, St as useOverflowDetection, T as ComboboxItem, Tt as HtmlOutput, U as NAMELESS_COLUMN_PREFIX, V as TableHeader, W as generateColumns, X as useIntersectionObserver, Y as DelayMount, Z as usePrevious$1, _ as downloadBlob, _t as TabsTrigger, at as toFieldTypes, b as Filenames, bt as ChartLoadingState, c as Slide, ct as CommandEmpty, d as JsonOutput, dt as CommandList, et as loadTableAndRawData, f as OutputArea, ft as CommandSeparator, g as ADD_PRINTING_CLASS, gt as TabsList, h as InstallPackageButton, ht as TabsContent, it as TOO_MANY_ROWS, j as isCellAwareAtom, k as contextAwarePanelOwner, kt as Funnel, l as RadioGroup, lt as CommandInput, m as DataTable, mt as Tabs, n as marimoVersionAtom, nt as INDEX_COLUMN_NAME, o as SLIDE_TYPE_OPTIONS_BY_VALUE, ot as getMimeValues, p as OutputRenderer, pt as Maps, q as ColumnChartContext, r as showCodeInRunModeAtom, rt as SELECT_COLUMN_ID, st as Command, t as useNotebookCodeAvailable, tt as loadTableData, u as RadioGroupItem, ut as CommandItem, v as downloadByURL, vt as ChartErrorState, w as Combobox, wt as Kbd, x as prettifyRowColumnCount, xt as LazyVegaEmbed, y as downloadHTMLAsImage, yt as ChartInfoState, z as TableCell, zt as ChevronLeft, __tla as __tla_2 } from "./code-visibility-CyBvO931.js";
 import { c as Calendar, i as createReducerAndAtoms, n as useOnUnmount, o as ToggleLeft, t as useOnMount } from "./useLifecycle-CjMjllqy.js";
 import { n as $fb18d541ea1ad717$export$ad991b66133851cf, r as $5a387cc49350e6db$export$722debc0e56fea39, t as $896ba0a80a8f4d36$export$85fd5fdf27bacc79 } from "./useDateFormatter-B3mCQMP3.js";
 import { t as Check } from "./check-CFM2mVDr.js";
@@ -44649,7 +44649,7 @@ ${c}
     if (l && l !== "slide") return l;
     if (c == null ? void 0 : c.has(e)) return "skip";
   }
-  var LazySlidesComponent = import_react.lazy(() => import("./reveal-component-Bdl6U1k_.js"));
+  var LazySlidesComponent = import_react.lazy(() => import("./reveal-component-_FaJp0v-.js"));
   const SlidesLayoutPlugin = {
     type: "slides",
     name: "Slides",

package/dist/{reveal-component-Bdl6U1k_.js → reveal-component-_FaJp0v-.js}

@@ -8,7 +8,7 @@ import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
 import "./html-to-image-Gawx981h.js";
 import "./chunk-5FQGJX7Z-CO1e63h_.js";
-import { At as EyeOff, Pt as Code, a as DEFAULT_SLIDE_TYPE, c as Slide, i as DEFAULT_DECK_TRANSITION, jt as Expand, s as SlideSidebar, t as useNotebookCodeAvailable } from "./code-visibility-tF2qI5eL.js";
+import { At as EyeOff, Pt as Code, a as DEFAULT_SLIDE_TYPE, c as Slide, i as DEFAULT_DECK_TRANSITION, jt as Expand, s as SlideSidebar, t as useNotebookCodeAvailable } from "./code-visibility-CyBvO931.js";
 import "./input-BAOe64zx.js";
 import "./toDate-CGmcCn8J.js";
 import "./react-dom-BWRJ_g_k.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marimo-team/islands",
-  "version": "0.23.6-dev31",
+  "version": "0.23.6-dev32",
   "main": "dist/main.js",
   "types": "dist/index.d.ts",
   "type": "module",

package/src/components/editor/chrome/wrapper/footer-items/pyodide-status.tsx

@@ -0,0 +1,47 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { useAtomValue } from "jotai";
+import { AlertCircleIcon } from "lucide-react";
+import type React from "react";
+import { Spinner } from "@/components/icons/spinner";
+import { Tooltip } from "@/components/ui/tooltip";
+import { wasmInitializationAtom, wasmInitStatusAtom } from "@/core/wasm/state";
+import { isWasm } from "@/core/wasm/utils";
+
+/**
+ * Footer indicator that surfaces Pyodide initialization progress. Mirrors
+ * the "Kernel" indicator but tracks the WASM runtime instead of the server
+ * connection. Hides itself once Pyodide is ready.
+ */
+export const PyodideStatus: React.FC = () => {
+  const status = useAtomValue(wasmInitStatusAtom);
+  const message = useAtomValue(wasmInitializationAtom);
+
+  if (!isWasm() || status === "ready") {
+    return null;
+  }
+
+  const icon =
+    status === "error" ? (
+      <AlertCircleIcon className="w-4 h-4 text-destructive" />
+    ) : (
+      <Spinner size="small" />
+    );
+
+  const tooltip = status === "error" ? "Pyodide failed to initialize" : message;
+
+  return (
+    <Tooltip
+      content={<div className="text-sm whitespace-pre-line">{tooltip}</div>}
+      data-testid="footer-pyodide-status"
+    >
+      <div
+        className="p-1 hover:bg-accent rounded flex items-center gap-1.5 text-xs text-muted-foreground"
+        data-testid="pyodide-status"
+      >
+        {icon}
+        <span>Pyodide</span>
+      </div>
+    </Tooltip>
+  );
+};

package/src/components/editor/chrome/wrapper/footer.tsx

@@ -18,6 +18,7 @@ import {
 } from "./footer-items/backend-status";
 import { CopilotStatusIcon } from "./footer-items/copilot-status";
 import { MachineStats } from "./footer-items/machine-stats";
+import { PyodideStatus } from "./footer-items/pyodide-status";
 import { RTCStatus } from "./footer-items/rtc-status";
 import { RuntimeSettings } from "./footer-items/runtime-settings";
 import { useSetDependencyPanelTab } from "./useDependencyPanelTab";
@@ -85,6 +86,7 @@ export const Footer: React.FC = () => {
 
       <div className="mx-auto" />
 
+      <PyodideStatus />
       <ConnectingKernelIndicatorItem />
 
       <ShowInKioskMode>

package/src/core/run-app.tsx

@@ -10,7 +10,11 @@ import { buttonVariants } from "@/components/ui/button";
 import { DelayMount } from "@/components/utils/delay-mount";
 import { cn } from "@/utils/cn";
 import { CellsRenderer } from "../components/editor/renderers/cells-renderer";
-import { notebookIsRunningAtom, useCellActions } from "./cells/cells";
+import {
+  hasCellsAtom,
+  notebookIsRunningAtom,
+  useCellActions,
+} from "./cells/cells";
 import type { AppConfig } from "./config/config-schema";
 import { RuntimeState } from "./kernel/RuntimeState";
 import { getSessionId } from "./kernel/session";
@@ -42,10 +46,13 @@ export const RunApp: React.FC<AppProps> = ({ appConfig }) => {
 
   const isRunning = useAtomValue(notebookIsRunningAtom);
   const isConnecting = isAppConnecting(connection.state);
+  // Skip the "Connecting..." gate when we already have cells to show — from
+  // an embedded snapshot or a prior connection.
+  const hasExistingCells = useAtomValue(hasCellsAtom);
 
   const renderCells = () => {
     // If we are connecting for more than 2 seconds, show a spinner
-    if (isConnecting) {
+    if (isConnecting && !hasExistingCells) {
       return (
         <DelayMount milliseconds={2000} fallback={null}>
           <Spinner className="mx-auto" />

package/src/core/wasm/PyodideLoader.tsx

@@ -3,13 +3,18 @@
 import { useAtomValue } from "jotai";
 import type React from "react";
 import type { PropsWithChildren } from "react";
+import { useEffect, useRef } from "react";
 import { LargeSpinner } from "@/components/icons/large-spinner";
+import { toast } from "@/components/ui/use-toast";
+import { hasCellsAtom } from "@/core/cells/cells";
 import { showCodeInRunModeAtom } from "@/core/meta/state";
 import { store } from "@/core/state/jotai";
 import { useAsyncData } from "@/hooks/useAsyncData";
+import { prettyError } from "@/utils/errors";
+import { Logger } from "@/utils/Logger";
 import { hasQueryParam } from "@/utils/urls";
 import { KnownQueryParams } from "../constants";
-import { getInitialAppMode } from "../mode";
+import { type AppMode, getInitialAppMode } from "../mode";
 import { PyodideBridge } from "./bridge";
 import { hasAnyOutputAtom, wasmInitializationAtom } from "./state";
 import { isWasm } from "./utils";
@@ -26,30 +31,44 @@ export const PyodideLoader: React.FC<PropsWithChildren> = ({ children }) => {
 };
 
 const PyodideLoaderInner: React.FC<PropsWithChildren> = ({ children }) => {
-  // isPyodide() is constant, so this is safe
-  const { isPending, error } = useAsyncData(async () => {
+  // Don't block render on Pyodide: a hydrated snapshot can paint immediately
+  // while Pyodide downloads in the background.
+  const { error } = useAsyncData(async () => {
     await PyodideBridge.INSTANCE.initialized.promise;
     return true;
   }, []);
 
+  const hasCells = useAtomValue(hasCellsAtom);
   const hasOutput = useAtomValue(hasAnyOutputAtom);
+  const nothingToShow = shouldShowSpinner({
+    hasCells,
+    hasOutput,
+    mode: getInitialAppMode(),
+    codeHidden: isCodeHidden(),
+  });
 
-  if (isPending) {
-    return <WasmSpinner />;
-  }
+  const didToastErrorRef = useRef(false);
+  useEffect(() => {
+    // With snapshot content on-screen, toast instead of throwing so the
+    // snapshot stays readable. The ref ensures we only toast once even if
+    // nothingToShow toggles later.
+    if (error && !nothingToShow && !didToastErrorRef.current) {
+      didToastErrorRef.current = true;
+      Logger.error("Pyodide failed to initialize", error);
+      toast({
+        title: "Failed to start the notebook runtime",
+        description: prettyError(error),
+        variant: "danger",
+      });
+    }
+  }, [error, nothingToShow]);
 
-  // If ALL are true:
-  // - are in read mode
-  // - we are not showing the code
-  // - and there is no output
-  // then show the spinner
-  if (!hasOutput && getInitialAppMode() === "read" && isCodeHidden()) {
-    return <WasmSpinner />;
+  if (error && nothingToShow) {
+    throw error;
   }
 
-  // Propagate back up to our error boundary
-  if (error) {
-    throw error;
+  if (nothingToShow) {
+    return <WasmSpinner />;
   }
 
   return children;
@@ -65,6 +84,25 @@ function isCodeHidden() {
   );
 }
 
+/**
+ * Pure predicate: should the WASM loader render a spinner instead of its
+ * children? We block render only when nothing user-visible would appear:
+ *   - no cells have been hydrated (Pyodide hasn't parsed the notebook), or
+ *   - we are in headless run mode (code hidden) with no outputs to display.
+ */
+export function shouldShowSpinner(input: {
+  hasCells: boolean;
+  hasOutput: boolean;
+  mode: AppMode;
+  codeHidden: boolean;
+}): boolean {
+  const { hasCells, hasOutput, mode, codeHidden } = input;
+  if (!hasCells) {
+    return true;
+  }
+  return !hasOutput && mode === "read" && codeHidden;
+}
+
 export const WasmSpinner: React.FC<PropsWithChildren> = ({ children }) => {
   const wasmInitialization = useAtomValue(wasmInitializationAtom);
 

package/src/core/wasm/__tests__/PyodideLoader.test.ts

@@ -0,0 +1,72 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { describe, expect, it } from "vitest";
+import { shouldShowSpinner } from "../PyodideLoader";
+
+describe("shouldShowSpinner", () => {
+  it("shows the spinner when there are no cells yet (Pyodide hasn't parsed)", () => {
+    expect(
+      shouldShowSpinner({
+        hasCells: false,
+        hasOutput: false,
+        mode: "read",
+        codeHidden: false,
+      }),
+    ).toBe(true);
+
+    expect(
+      shouldShowSpinner({
+        hasCells: false,
+        hasOutput: true,
+        mode: "edit",
+        codeHidden: false,
+      }),
+    ).toBe(true);
+  });
+
+  it("renders children once cells exist with code visible", () => {
+    // run mode, code visible, no outputs yet — the user can read the code
+    expect(
+      shouldShowSpinner({
+        hasCells: true,
+        hasOutput: false,
+        mode: "read",
+        codeHidden: false,
+      }),
+    ).toBe(false);
+  });
+
+  it("renders children once cells exist with cached outputs (snapshot case)", () => {
+    expect(
+      shouldShowSpinner({
+        hasCells: true,
+        hasOutput: true,
+        mode: "read",
+        codeHidden: true,
+      }),
+    ).toBe(false);
+  });
+
+  it("keeps the spinner up in headless run mode with no outputs", () => {
+    // read mode + code hidden + no outputs = nothing visible to render
+    expect(
+      shouldShowSpinner({
+        hasCells: true,
+        hasOutput: false,
+        mode: "read",
+        codeHidden: true,
+      }),
+    ).toBe(true);
+  });
+
+  it("never blocks edit mode once cells exist", () => {
+    expect(
+      shouldShowSpinner({
+        hasCells: true,
+        hasOutput: false,
+        mode: "edit",
+        codeHidden: true,
+      }),
+    ).toBe(false);
+  });
+});

package/src/core/wasm/bridge.ts

@@ -37,7 +37,7 @@ import type { IConnectionTransport } from "../websocket/transports/transport";
 import { PyodideRouter } from "./router";
 import { getWorkerRPC } from "./rpc";
 import { createShareableLink } from "./share";
-import { wasmInitializationAtom } from "./state";
+import { wasmInitializationAtom, wasmInitStatusAtom } from "./state";
 import { fallbackFileStore, notebookFileStore } from "./store";
 import { isWasm } from "./utils";
 import type { SaveWorkerSchema } from "./worker/save-worker";
@@ -119,13 +119,15 @@ export class PyodideBridge implements RunRequests, EditRequests {
       // By initializing after, we get hits on cached network requests
       this.saveRpc = this.getSaveWorker();
       this.setInterruptBuffer();
+      store.set(wasmInitStatusAtom, "ready");
       this.initialized.resolve();
     });
     this.rpc.addMessageListener("initializingMessage", ({ message }) => {
       store.set(wasmInitializationAtom, message);
     });
     this.rpc.addMessageListener("initializedError", ({ error }) => {
-      // If already resolved, show a toast
+      // If already initialized, surface as a toast and leave the deferred /
+      // init status alone — the worker is healthy, this is a runtime error.
       if (this.initialized.status === "resolved") {
         Logger.error(error);
         toast({
@@ -133,7 +135,9 @@ export class PyodideBridge implements RunRequests, EditRequests {
           description: error,
           variant: "danger",
         });
+        return;
       }
+      store.set(wasmInitStatusAtom, "error");
       this.initialized.reject(new Error(error));
     });
     this.rpc.addMessageListener("kernelMessage", ({ message }) => {

package/src/core/wasm/state.ts

@@ -5,6 +5,9 @@ import { isOutputEmpty } from "../cells/outputs";
 
 export const wasmInitializationAtom = atom<string>("Initializing...");
 
+export type WasmInitStatus = "loading" | "ready" | "error";
+export const wasmInitStatusAtom = atom<WasmInitStatus>("loading");
+
 export const hasAnyOutputAtom = atom<boolean>((get) => {
   const notebook = get(notebookAtom);
   const runtimeStates = Object.values(notebook.cellRuntime);