@marimo-team/islands 0.25.3-dev266 → 0.25.3-dev268

package/src/core/cells/cells.ts

@@ -6,6 +6,11 @@ import { atomFamily, selectAtom, splitAtom } from "jotai/utils";
 import { createRef, type ReducerWithoutAction } from "react";
 import type { CellHandle } from "@/components/editor/notebook-cell";
 import type { EditableDocument, Placement } from "@/core/notebook/document";
+import {
+  cellExecutionInputsAtom,
+  cellExecutionView,
+  withdrawCells,
+} from "@/core/executions";
 import type { CellColumnId } from "./layout";
 import { invariant } from "@/utils/invariant";
 import { Logger } from "@/utils/Logger";
@@ -21,7 +26,7 @@ import { isErrorMime } from "../mime";
 import type { CellConfig } from "../network/types";
 import { createDeepEqualAtom, store } from "../state/jotai";
 import { isWasm } from "../wasm/utils";
-import { prepareCellForExecution, transitionCell } from "./cell";
+import { transitionCell } from "./cell";
 import { applyDocument } from "./document";
 import { isCodeHidden, shownHiddenCodeAtom } from "./editor";
 import { type CellId, SCRATCH_CELL_ID } from "./ids";
@@ -40,9 +45,7 @@ import {
   disabledCellIds,
   enabledCellIds,
   getUndoLabel,
-  notebookIsRunning,
   notebookNeedsRun,
-  notebookQueueOrRunningCount,
 } from "./utils";
 
 /** A deleted cell as it was, with where it went in the document. */
@@ -190,9 +193,7 @@ const {
     const newState = updateCellRuntimeState({
       state,
       cellId: action.cellId,
-      cellReducer: (cell) => {
-        return prepareCellForExecution(cell);
-      },
+      cellReducer: (cell) => ({ ...cell, debuggerActive: false }),
     });
     return updateCellData({
       state: newState,
@@ -286,13 +287,7 @@ const {
     });
   },
   /** Record what the kernel last ran for each cell. */
-  setLastRun: (
-    state,
-    action: {
-      lastCodeRun: Record<CellId, string>;
-      lastExecutionTime: Record<CellId, number>;
-    },
-  ) => {
+  setLastRun: (state, action: { lastCodeRun: Record<CellId, string> }) => {
     const cellData = { ...state.cellData };
     for (const cellId of state.cellIds) {
       const cell = state.cellData[cellId];
@@ -300,7 +295,6 @@ const {
       cellData[cellId] = {
         ...cell,
         lastCodeRun,
-        lastExecutionTime: action.lastExecutionTime[cellId] ?? null,
         // A cell the kernel never ran is not stale on load.
         edited: lastCodeRun !== null && isEdited(lastCodeRun, cell.code),
       };
@@ -497,7 +491,9 @@ export const canUndoDeletesAtom = atom((get) =>
 
 export const undoLabelAtom = atom((get) => getUndoLabel(get(notebookAtom)));
 
-export const needsRunAtom = atom((get) => notebookNeedsRun(get(notebookAtom)));
+export const needsRunAtom = atom((get) =>
+  notebookNeedsRun(get(notebookAtom), get(cellExecutionInputsAtom)),
+);
 
 export const cellErrorsAtom = atom((get) => {
   const { cellIds, cellRuntime, cellData } = get(notebookAtom);
@@ -629,19 +625,6 @@ export const useCellDataAtoms = () => useAtom(cellDataAtoms);
 
 export const cellsRuntimeAtom = atom((get) => get(notebookAtom).cellRuntime);
 
-export const notebookIsRunningAtom = atom((get) =>
-  notebookIsRunning(get(notebookAtom)),
-);
-export const onlyScratchpadIsRunningAtom = atom((get) => {
-  const { cellRuntime } = get(notebookAtom);
-  return Object.entries(cellRuntime).every(
-    ([id, rt]) => rt.status !== "running" || id === SCRATCH_CELL_ID,
-  );
-});
-export const notebookQueuedOrRunningCountAtom = atom((get) =>
-  notebookQueueOrRunningCount(get(notebookAtom)),
-);
-
 export const hasCellsAtom = atom((get) => get(notebookAtom).cellIds.length > 0);
 export const cellDataAtom = atomFamily((cellId: CellId) =>
   atom((get) => get(notebookAtom).cellData[cellId]),
@@ -666,6 +649,7 @@ export function releaseCellAtoms(cellId: CellId) {
   cellDataAtom.remove(cellId);
   cellRuntimeAtom.remove(cellId);
   cellHandleAtom.remove(cellId);
+  withdrawCells(store, [cellId]);
 }
 
 /** Subscribes to reactive updates of the cell's data. */
@@ -726,7 +710,8 @@ export function createTracebackInfoAtom(
       return undefined;
     }
 
-    if (data.status === "queued" || data.status === "running") {
+    const { status } = cellExecutionView(get(cellExecutionInputsAtom), cellId);
+    if (status === "queued" || status === "running") {
       return undefined;
     }
 

package/src/core/cells/document.ts

@@ -5,7 +5,7 @@
  * both. Edits go the other way through the document model directly: the
  * cell operations write it, and each cell editor is bound to its cell.
  *
- * TODO(MO-8028): Delete this module once components read cells from the
+ * TODO(MO-8349): Delete this module once components read cells from the
  * document model and `notebookAtom` holds only runtime and editor state.
  */
 
@@ -64,7 +64,7 @@ function followCell(current: CellData, cell: EditableCell): CellData {
  * Returns the same state when nothing differs, so a local edit that the
  * document already reflects changes nothing.
  *
- * TODO(MO-8028): Delete with `reconcileDocument` once cells are read from
+ * TODO(MO-8349): Delete with `reconcileDocument` once cells are read from
  * the document model.
  */
 export function applyDocument(
@@ -134,7 +134,7 @@ export function applyDocument(
  * Reconcile the model's document and name its columns, now and on each
  * change, until the signal aborts.
  *
- * TODO(MO-8028): Delete with `applyDocument`.
+ * TODO(MO-8349): Delete with `applyDocument`.
  */
 export function followDocument({
   store,

package/src/core/cells/focus.ts

@@ -3,7 +3,13 @@
 import type { EditorView } from "@codemirror/view";
 import { atom, useAtomValue } from "jotai";
 import { createReducerAndAtoms } from "@/utils/createReducer";
-import type { CellConfig, RuntimeState } from "../network/types";
+import {
+  type CellExecutionInputs,
+  type CellRunStatus,
+  cellExecutionInputsAtom,
+  cellExecutionView,
+} from "@/core/executions";
+import type { CellConfig } from "../network/types";
 import { type NotebookState, notebookAtom } from "./cells";
 import type { CellId } from "./ids";
 import { SCRATCH_CELL_ID } from "./ids";
@@ -75,7 +81,8 @@ export const lastFocusedCellAtom = atom<{
   name: string;
   config: CellConfig;
   cellId: CellId;
-  status: RuntimeState;
+  status: CellRunStatus;
+  blocked: boolean;
   getEditorView: () => EditorView | null;
   hasOutput: boolean;
   hasConsoleOutput: boolean;
@@ -89,16 +96,28 @@ export const lastFocusedCellAtom = atom<{
     return null;
   }
 
-  return cellFocusDetails(cellId, get(notebookAtom));
+  return cellFocusDetails(
+    cellId,
+    get(notebookAtom),
+    get(cellExecutionInputsAtom),
+  );
 });
 
 export function cellFocusDetailsAtom(cellId: CellId) {
   return atom((get) => {
-    return cellFocusDetails(cellId, get(notebookAtom));
+    return cellFocusDetails(
+      cellId,
+      get(notebookAtom),
+      get(cellExecutionInputsAtom),
+    );
   });
 }
 
-function cellFocusDetails(cellId: CellId, notebookState: NotebookState) {
+function cellFocusDetails(
+  cellId: CellId,
+  notebookState: NotebookState,
+  executions: CellExecutionInputs,
+) {
   const { cellData, cellHandles, cellRuntime } = notebookState;
   const data = cellData[cellId];
   const runtime = cellRuntime[cellId];
@@ -107,12 +126,14 @@ function cellFocusDetails(cellId: CellId, notebookState: NotebookState) {
     return null;
   }
   const getEditorView = () => handle.editorViewOrNull;
+  const execution = cellExecutionView(executions, cellId);
 
   return {
     cellId,
     name: data.name,
     config: data.config,
-    status: runtime ? runtime.status : "idle",
+    status: execution.status,
+    blocked: execution.blocked,
     getEditorView: getEditorView,
     hasOutput: runtime?.output != null,
     hasConsoleOutput: runtime?.consoleOutputs != null,

package/src/core/cells/layout.ts

@@ -140,7 +140,7 @@ export function deriveLayout(
  * The layout of the notebook's cells: the document's order and columns,
  * this browser's column ids and folds, and the kernel's outlines.
  *
- * TODO(MO-8028): Outlines come from executions later.
+ * TODO(MO-8404): Outlines come from the host.
  */
 export const layoutAtom = atom((get): Layout => {
   const model = get(activeDocumentModelAtom);

package/src/core/cells/pending-delete-service.ts

@@ -7,6 +7,7 @@ import {
 } from "@/components/editor/cell/useDeleteCell";
 import { notebookAtom } from "@/core/cells/cells";
 import type { CellId } from "@/core/cells/ids";
+import { cellExecutionInputsAtom, cellExecutionView } from "@/core/executions";
 import type { JotaiStore } from "@/core/state/jotai";
 import { variablesAtom } from "@/core/variables/state";
 import type { VariableName } from "@/core/variables/types";
@@ -46,6 +47,7 @@ const { valueAtom: pendingDeleteStateAtom, useActions } = createReducerAndAtoms(
     ) => {
       const { cellIds, deleteCell, deleteManyCells, store } = action;
       const notebook = store.get(notebookAtom);
+      const executions = store.get(cellExecutionInputsAtom);
       const variables = store.get(variablesAtom);
 
       const emptyCells = new Set(
@@ -62,8 +64,6 @@ const { valueAtom: pendingDeleteStateAtom, useActions } = createReducerAndAtoms(
           continue;
         }
 
-        const runtimeInfo = notebook.cellRuntime[cellId];
-
         // Build defs map for this cell
         const defs = new Map<VariableName, readonly CellId[]>();
         for (const variable of Object.values(variables)) {
@@ -77,11 +77,9 @@ const { valueAtom: pendingDeleteStateAtom, useActions } = createReducerAndAtoms(
         }
 
         let executionDurationMs: number | undefined;
-        if (
-          runtimeInfo?.runElapsedTimeMs &&
-          runtimeInfo.runElapsedTimeMs > 2000
-        ) {
-          executionDurationMs = runtimeInfo.runElapsedTimeMs;
+        const { duration } = cellExecutionView(executions, cellId);
+        if (duration !== null && duration > 2000) {
+          executionDurationMs = duration;
         }
 
         if (defs.size === 0 && executionDurationMs === undefined) {

package/src/core/cells/scrollCellIntoView.ts

@@ -160,3 +160,9 @@ export function scrollCellIntoView(cellId: CellId): void {
     );
   }
 }
+
+export function scrollToCell(cellId: CellId): HTMLElement | null {
+  const cell = document.getElementById(HTMLCellId.create(cellId));
+  cell?.scrollIntoView({ behavior: "smooth", block: "center" });
+  return cell;
+}

package/src/core/cells/types.ts

@@ -1,8 +1,7 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
-import type { Milliseconds, Seconds } from "@/utils/time";
 import type { OutputMessage } from "../kernel/messages";
-import type { CellConfig, RuntimeState } from "../network/types";
+import type { CellConfig } from "../network/types";
 import type { CellId } from "./ids";
 import { DEFAULT_CELL_NAME } from "./names";
 import type { Outline } from "./outline";
@@ -11,7 +10,7 @@ import type { Outline } from "./outline";
  * Whether a cell's code has changed since it last ran. A cell that never ran
  * is edited once it has code. Whitespace at the ends does not count.
  *
- * TODO(MO-8028): Temporary until staleness comes from the host's executions.
+ * TODO(MO-8403): Delete with `lastCodeRun`.
  */
 export function isEdited(lastCodeRun: string | null, code: string): boolean {
   return lastCodeRun === null
@@ -27,7 +26,6 @@ export function createCell({
   name = DEFAULT_CELL_NAME,
   code = "",
   lastCodeRun = null,
-  lastExecutionTime = null,
   edited = false,
   config,
 }: Partial<CellData> & { id: CellId }): CellData {
@@ -43,7 +41,6 @@ export function createCell({
     code: code,
     edited: edited,
     lastCodeRun: lastCodeRun,
-    lastExecutionTime: lastExecutionTime,
   };
 }
 
@@ -64,14 +61,7 @@ export function createCellRuntimeState(
     outline: null,
     output: null,
     consoleOutputs: [],
-    status: "idle" as RuntimeState,
     staleInputs: false,
-    interrupted: false,
-    errored: false,
-    stopped: false,
-    runElapsedTimeMs: null,
-    runStartTimestamp: null,
-    lastRunStartTimestamp: null,
     debuggerActive: false,
     ...state,
   };
@@ -90,41 +80,28 @@ export interface CellData {
   edited: boolean;
   /** snapshot of code that was last run */
   lastCodeRun: string | null;
-  /** execution time on session start / resume */
-  lastExecutionTime: number | null;
   /** cell configuration */
   config: CellConfig;
 }
 
+/**
+ * What the kernel's cell-ops still own. Status, timing, and how a cell last
+ * ended come from the host's executions (see `@/core/executions`).
+ *
+ * TODO(MO-8407): Delete.
+ */
 export interface CellRuntimeState {
-  /** a message encoding the cell's output */
+  /** a message encoding the cell's output. TODO(MO-8404) */
   output: OutputMessage | null;
-  /** TOC outline */
+  /** TOC outline. TODO(MO-8404) */
   outline: Outline | null;
-  /** messages encoding the cell's console outputs. */
+  /** messages encoding the cell's console outputs. TODO(MO-8405) */
   consoleOutputs: ConsoleOutputMessage[];
-  /** current status of the cell */
-  status: RuntimeState;
-  /** whether the cell has stale inputs*/
+  /** whether the cell has stale inputs. TODO(MO-8403) */
   staleInputs: boolean;
-  /** whether this cell has been interrupted since its last run */
-  interrupted: boolean;
-  /** whether this cell was stopped with mo.stop */
-  stopped: boolean;
-  /**
-   * whether marimo encountered an error when trying to register or run
-   * this cell (such as a multiple definition error)
-   */
-  errored: boolean;
-  /** run start time, as seconds since epoch */
-  runStartTimestamp: Seconds | null;
-  /** run elapsed time, in milliseconds */
-  runElapsedTimeMs: Milliseconds | null;
-  /** last run timestamp, as seconds since epoch */
-  lastRunStartTimestamp: Seconds | null;
   /** debugger active */
   debuggerActive: boolean;
-  /** serialization message */
+  /** serialization message. TODO(MO-8414) */
   serialization?: string | null;
 }
 

package/src/core/cells/utils.ts

@@ -1,27 +1,22 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
 import type { EditorView } from "@codemirror/view";
+import {
+  type CellExecutionInputs,
+  type CellExecutionView,
+  cellExecutionView,
+} from "@/core/executions";
 import { Objects } from "@/utils/objects";
 import type { MarimoError, OutputMessage } from "../kernel/messages";
 import { isErrorMime } from "../mime";
-import type { RuntimeState } from "../network/types";
 import type { NotebookState } from "./cells";
 import type { CellId } from "./ids";
 
-export function notebookIsRunning(state: NotebookState) {
-  return Object.values(state.cellRuntime).some(
-    (cell) => cell.status === "running",
-  );
-}
-
-export function notebookQueueOrRunningCount(state: NotebookState) {
-  return Object.values(state.cellRuntime).filter(
-    (cell) => cell.status === "running" || cell.status === "queued",
-  ).length;
-}
-
-export function notebookNeedsRun(state: NotebookState) {
-  return staleCellIds(state).length > 0;
+export function notebookNeedsRun(
+  state: NotebookState,
+  executions: CellExecutionInputs,
+) {
+  return staleCellIds(state, executions).length > 0;
 }
 
 export function notebookCells(state: NotebookState) {
@@ -84,16 +79,16 @@ export function getUndoLabel(state: NotebookState): string {
  */
 export function getDescendantsStatus(
   state: NotebookState,
+  executions: CellExecutionInputs,
   descendants: readonly CellId[],
 ) {
+  const views = descendants.map((id) => cellExecutionView(executions, id));
   const stale = descendants.some(
     (id) => state.cellRuntime[id]?.staleInputs || state.cellData[id]?.edited,
   );
-  const errored = descendants.some((id) => state.cellRuntime[id]?.errored);
-  const runningOrQueued = descendants.some(
-    (id) =>
-      state.cellRuntime[id]?.status === "running" ||
-      state.cellRuntime[id]?.status === "queued",
+  const errored = views.some((view) => view.outcome === "error");
+  const runningOrQueued = views.some(
+    (view) => view.status === "running" || view.status === "queued",
   );
 
   return {
@@ -106,54 +101,30 @@ export function getDescendantsStatus(
 /**
  * Cells that are stale and can be run.
  */
-export function staleCellIds(state: NotebookState) {
+export function staleCellIds(
+  state: NotebookState,
+  executions: CellExecutionInputs,
+) {
   const { cellIds, cellData, cellRuntime } = state;
-  return cellIds.filter(
-    (cellId) =>
-      isUninstantiated({
-        // runElapstedTimeMs is what we've seen in this session
-        executionTime:
-          cellRuntime[cellId].runElapsedTimeMs ??
-          // lastExecutionTime is what was seen on session start/resume
-          cellData[cellId].lastExecutionTime,
-        status: cellRuntime[cellId].status,
-        errored: cellRuntime[cellId].errored,
-        interrupted: cellRuntime[cellId].interrupted,
-        stopped: cellRuntime[cellId].stopped,
-      }) ||
+  return cellIds.filter((cellId) => {
+    const execution = cellExecutionView(executions, cellId);
+    return (
+      isUninstantiated(execution) ||
       cellData[cellId].edited ||
-      cellRuntime[cellId].interrupted ||
+      execution.outcome === "interrupted" ||
       (cellRuntime[cellId].staleInputs &&
         // if a cell is disabled, it can't be run ...
-        !(
-          cellRuntime[cellId].status === "disabled-transitively" ||
-          cellData[cellId].config.disabled
-        )),
-  );
+        !(execution.blocked || cellData[cellId].config.disabled))
+    );
+  });
 }
 
+/** Whether a cell has never run: no result to show and nothing in flight. */
 export function isUninstantiated({
-  executionTime,
   status,
-  errored,
-  interrupted,
-  stopped,
-}: {
-  executionTime: number | null;
-  status: RuntimeState;
-  errored: boolean;
-  interrupted: boolean;
-  stopped: boolean;
-}) {
-  return (
-    // hasn't run ...
-    executionTime === null &&
-    // isn't currently queued/running &&
-    status !== "queued" &&
-    status !== "running" &&
-    // and isn't in an error state.
-    !(errored || interrupted || stopped)
-  );
+  outcome,
+}: Pick<CellExecutionView, "status" | "outcome">) {
+  return outcome === null && status !== "queued" && status !== "running";
 }
 
 /**
@@ -166,17 +137,15 @@ export function cellNeedsRun({
   interrupted,
   staleInputs,
   disabled,
-  status,
+  blocked,
 }: {
   edited: boolean;
   interrupted: boolean;
   staleInputs: boolean;
   disabled: boolean | undefined;
-  status: RuntimeState;
+  blocked: boolean;
 }): boolean {
-  const disabledOrAncestorDisabled =
-    disabled || status === "disabled-transitively";
-  return edited || interrupted || (staleInputs && !disabledOrAncestorDisabled);
+  return edited || interrupted || (staleInputs && !(disabled || blocked));
 }
 
 export function cellStatusClasses({
@@ -184,20 +153,20 @@ export function cellStatusClasses({
   errored,
   stopped,
   disabled,
-  status,
+  blocked,
 }: {
   needsRun: boolean;
   errored: boolean;
   stopped: boolean;
   disabled: boolean | undefined;
-  status: RuntimeState;
+  blocked: boolean;
 }) {
   return {
     "needs-run": needsRun,
     "has-error": errored,
     stopped,
     disabled: disabled ?? false,
-    stale: status === "disabled-transitively",
+    stale: blocked,
   };
 }
 

package/src/core/codemirror/placeholder/__tests__/extensions.test.ts

@@ -145,4 +145,63 @@ describe("clickablePlaceholderExtension", () => {
 
     view.destroy();
   });
+
+  describe("caret coordinates", () => {
+    const original = Range.prototype.getClientRects;
+    let rects: Array<Pick<DOMRect, "left" | "right" | "top" | "bottom">>;
+
+    beforeEach(() => {
+      rects = [{ left: 10, right: 50, top: 2, bottom: 18 }];
+      Range.prototype.getClientRects = () => rects as unknown as DOMRectList;
+    });
+
+    afterEach(() => {
+      Range.prototype.getClientRects = original;
+    });
+
+    function renderWidget(beforeText: string) {
+      const view = new EditorView({
+        state: EditorState.create({
+          doc: "",
+          extensions: clickablePlaceholderExtension({
+            beforeText,
+            linkText: "here",
+            afterText: "",
+            onClick: vi.fn(),
+          }),
+        }),
+      });
+      const widget = view.state
+        .facet(EditorView.decorations)
+        .flatMap((deco) => (typeof deco === "function" ? [deco(view)] : [deco]))
+        .map((set) => set.iter().value?.spec.widget)
+        .find(Boolean);
+      const dom = widget.toDOM(view);
+      document.body.append(dom);
+      return { view, widget, dom };
+    }
+
+    it("collapses the caret to the start of the first line of text", () => {
+      const { view, widget, dom } = renderWidget("Type or ");
+      expect(widget.coordsAt(dom, 0, 1)).toEqual({
+        left: 10,
+        right: 10,
+        top: 2,
+        bottom: 18,
+      });
+      dom.style.direction = "rtl";
+      expect(widget.coordsAt(dom, 0, 1)).toMatchObject({ left: 50, right: 50 });
+      dom.remove();
+      view.destroy();
+    });
+
+    it("skips empty text and falls back when nothing is laid out", () => {
+      const { view, widget, dom } = renderWidget("");
+      expect(widget.coordsAt(dom, 0, 1)).toMatchObject({ left: 10 });
+      rects = [];
+      expect(widget.coordsAt(dom, 0, 1)).toBeNull();
+      dom.remove();
+      view.destroy();
+    });
+  });
 });

package/src/core/codemirror/placeholder/extensions.ts

@@ -90,6 +90,29 @@ export function clickablePlaceholderExtension(opts: {
       return wrapper;
     }
 
+    public override coordsAt(dom: HTMLElement) {
+      // A wrapped placeholder must not make the caret span every line.
+      const walker = document.createTreeWalker(dom, NodeFilter.SHOW_TEXT);
+      let text = walker.nextNode();
+      while (text && !text.textContent) {
+        text = walker.nextNode();
+      }
+      if (!text) {
+        return null;
+      }
+      const range = document.createRange();
+      range.selectNodeContents(text);
+      const rect = range.getClientRects()[0];
+      if (!rect) {
+        return null;
+      }
+      const left =
+        window.getComputedStyle(dom).direction === "rtl"
+          ? rect.right
+          : rect.left;
+      return { left, right: left, top: rect.top, bottom: rect.bottom };
+    }
+
     public override ignoreEvent(event: Event) {
       return (
         event.target instanceof Element &&

package/src/core/edit-app.tsx

@@ -27,7 +27,8 @@ import { useSetOutputsExpanded } from "../components/editor/actions/useSetOutput
 import { CellArray } from "../components/editor/renderers/cell-array";
 import { CellsRenderer } from "../components/editor/renderers/cells-renderer";
 import { useHotkey } from "../hooks/useHotkey";
-import { hasCellsAtom, notebookIsRunningAtom } from "./cells/cells";
+import { hasCellsAtom } from "./cells/cells";
+import { notebookIsRunningAtom } from "./executions";
 import { numColumnsAtom } from "./cells/layout";
 import { useCellActions } from "./cells/actions";
 import type { AppConfig, UserConfig } from "./config/config-schema";