@marimo-team/islands 0.25.3-dev91 → 0.25.3-dev93

package/src/components/data-table/cell-selection/types.ts

@@ -30,7 +30,7 @@ export interface CellSelectionCell {
 }
 
 // These are additional properties add to the table instance in createTable
-export interface CellSelectionInstance<TData extends RowData> {
+export interface CellSelectionInstance {
   setCellSelection?: (updater: Updater<CellSelectionState>) => void;
 
   resetCellSelection?(defaultValue?: CellSelectionState): void;
@@ -44,7 +44,7 @@ declare module "@tanstack/react-table" {
     TData extends RowData,
   > extends CellSelectionOptions {}
 
-  interface Table<TData extends RowData> extends CellSelectionInstance<TData> {}
+  interface Table<TData extends RowData> extends CellSelectionInstance {}
 
   interface Cell<TData extends RowData, TValue> extends CellSelectionCell {}
 }

package/src/components/data-table/column-summary/column-summary.tsx

@@ -16,7 +16,7 @@ export const ColumnChartContext = React.createContext<
   ColumnChartSpecModel<unknown>
 >(ColumnChartSpecModel.EMPTY);
 
-interface Props<TData, TValue> {
+interface Props {
   columnId: string;
 }
 
@@ -24,9 +24,7 @@ interface Props<TData, TValue> {
 // for all calls with the same key.
 const batchedLoader = createBatchedLoader();
 
-export const TableColumnSummary = <TData, TValue>({
-  columnId,
-}: Props<TData, TValue>) => {
+export const TableColumnSummary = ({ columnId }: Props) => {
   const { locale } = useLocale();
 
   const chartSpecModel = React.use(ColumnChartContext);

package/src/components/datasources/__tests__/table-list.test.tsx

@@ -0,0 +1,118 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { render, screen, waitFor } from "@testing-library/react";
+import { Provider } from "jotai";
+import type React from "react";
+import { describe, expect, it } from "vitest";
+import { MockRequestClient } from "@/__mocks__/requests";
+import type { SQLTableContext } from "@/core/datasets/data-source-connections";
+import { PreviewSQLTableList } from "@/core/datasets/request-registry";
+import type { SQLTableListPreview } from "@/core/kernel/messages";
+import type { RequestId } from "@/core/network/DeferredRequestRegistry";
+import { requestClientAtom } from "@/core/network/requests";
+import { store } from "@/core/state/jotai";
+import { TableList } from "../datasources";
+
+const wrapper = ({ children }: { children: React.ReactNode }) => (
+  <Provider store={store}>{children}</Provider>
+);
+
+const sqlTableContext: SQLTableContext = {
+  engine: "my_engine",
+  database: "my_db",
+  schema: "public",
+  dialect: "postgres",
+  schemaPath: ["public"],
+};
+
+// The kernel answers table-list requests over the websocket, so the mock
+// settles the deferred request instead of returning the response directly.
+function renderDeferredTableList(settle?: (requestId: RequestId) => void) {
+  const client = MockRequestClient.create();
+  client.previewSQLTableList.mockImplementation(async ({ requestId }) => {
+    settle?.(requestId);
+    return null;
+  });
+  store.set(requestClientAtom, client);
+  render(
+    <TableList
+      tables={[]}
+      tablesResolved={false}
+      sqlTableContext={sqlTableContext}
+    />,
+    { wrapper },
+  );
+  return client;
+}
+
+describe("TableList deferred discovery", () => {
+  it("shows the error when the request rejects", async () => {
+    renderDeferredTableList((requestId) =>
+      PreviewSQLTableList.reject(requestId, new Error("engine offline")),
+    );
+
+    expect(screen.getByText("Loading tables...")).toBeInTheDocument();
+
+    await waitFor(() => {
+      expect(screen.getByText("engine offline")).toBeInTheDocument();
+    });
+    expect(screen.queryByText("Loading tables...")).toBeNull();
+  });
+
+  it("shows the error when the response has no tables field", async () => {
+    renderDeferredTableList((requestId) =>
+      PreviewSQLTableList.resolve(requestId, {} as SQLTableListPreview),
+    );
+
+    await waitFor(() => {
+      expect(screen.getByText("No tables available")).toBeInTheDocument();
+    });
+    expect(screen.queryByText("Loading tables...")).toBeNull();
+  });
+
+  it("shows the empty state for an empty table list", async () => {
+    renderDeferredTableList((requestId) =>
+      PreviewSQLTableList.resolve(requestId, {
+        tables: [],
+      } as unknown as SQLTableListPreview),
+    );
+
+    await waitFor(() => {
+      expect(screen.getByText("No tables found")).toBeInTheDocument();
+    });
+    expect(screen.queryByText("Loading tables...")).toBeNull();
+  });
+
+  it("requests the table list with the table context and waits for the kernel", async () => {
+    let pendingRequestId: RequestId | undefined;
+    const client = renderDeferredTableList((requestId) => {
+      pendingRequestId = requestId;
+    });
+
+    await waitFor(() => {
+      expect(client.previewSQLTableList).toHaveBeenCalledTimes(1);
+    });
+    expect(client.previewSQLTableList).toHaveBeenCalledWith(
+      expect.objectContaining({
+        engine: "my_engine",
+        database: "my_db",
+        schema: "public",
+        schemaPath: ["public"],
+      }),
+    );
+    expect(screen.getByText("Loading tables...")).toBeInTheDocument();
+
+    // Settle the request so the process-wide registry does not keep the entry.
+    expect(pendingRequestId).toBeDefined();
+    PreviewSQLTableList.resolve(
+      pendingRequestId as RequestId,
+      {
+        tables: [],
+      } as unknown as SQLTableListPreview,
+    );
+    await waitFor(() => {
+      expect(screen.queryByText("Loading tables...")).toBeNull();
+    });
+    expect(PreviewSQLTableList.requests.size).toBe(0);
+  });
+});

package/src/components/datasources/datasources.tsx

@@ -702,7 +702,40 @@ const SchemaNode: React.FC<SchemaNodeProps> = (props) => {
   );
 };
 
-const TableList: React.FC<{
+// Kept outside the component because the React Compiler does not yet
+// support try/finally inside component bodies.
+async function loadTableList(
+  sqlTableContext: SQLTableContext,
+  addTableList: ReturnType<typeof useDataSourceActions>["addTableList"],
+  setLoading: (loading: boolean) => void,
+) {
+  setLoading(true);
+  try {
+    const { engine, database, schema, schemaPath } = sqlTableContext;
+    const previewTableList = await PreviewSQLTableList.request({
+      engine: engine,
+      database: database,
+      schema: schema,
+      schemaPath: schemaPath ?? [],
+    });
+
+    if (!previewTableList?.tables) {
+      throw new Error("No tables available");
+    }
+
+    addTableList({
+      tables: previewTableList.tables,
+      sqlTableContext: sqlTableContext,
+    });
+  } finally {
+    setLoading(false);
+  }
+}
+
+/**
+ * This is exported for testing purposes only.
+ */
+export const TableList: React.FC<{
   tables: DataTable[];
   sqlTableContext?: SQLTableContext;
   searchValue?: string;
@@ -731,26 +764,7 @@ const TableList: React.FC<{
   // resets tablesResolved to false).
   const { isPending, error } = useAsyncData(async () => {
     if (!tablesResolved && sqlTableContext) {
-      setTablesLoading(true);
-
-      const { engine, database, schema, schemaPath } = sqlTableContext;
-      const previewTableList = await PreviewSQLTableList.request({
-        engine: engine,
-        database: database,
-        schema: schema,
-        schemaPath: schemaPath ?? [],
-      });
-
-      if (!previewTableList?.tables) {
-        setTablesLoading(false);
-        throw new Error("No tables available");
-      }
-
-      addTableList({
-        tables: previewTableList.tables,
-        sqlTableContext: sqlTableContext,
-      });
-      setTablesLoading(false);
+      await loadTableList(sqlTableContext, addTableList, setTablesLoading);
     }
   }, [tablesResolved, sqlTableContext]);
 

package/src/components/editor/SortableCell.tsx

@@ -71,7 +71,6 @@ export const SortableCell = React.forwardRef(
     return (
       <SortableCellInternal
         ref={ref}
-        cellId={cellId}
         canMoveX={canMoveX}
         {...props}
         attributes={attributes}
@@ -86,7 +85,7 @@ export const SortableCell = React.forwardRef(
 );
 SortableCell.displayName = "SortableCell";
 
-interface SortableCellInternalProps extends Props {
+interface SortableCellInternalProps extends Omit<Props, "cellId"> {
   children: React.ReactNode;
   attributes: DraggableAttributes;
   listeners: SyntheticListenerMap | undefined;
@@ -99,7 +98,6 @@ interface SortableCellInternalProps extends Props {
 const SortableCellInternal = React.forwardRef(
   (
     {
-      cellId,
       canMoveX,
       children,
       attributes,

package/src/components/editor/chrome/wrapper/footer-items/runtime-settings.tsx

@@ -26,13 +26,7 @@ import { isWasm } from "@/core/wasm/utils";
 import { cn } from "@/utils/cn";
 import { FooterItem } from "../footer-item";
 
-interface RuntimeSettingsProps {
-  className?: string;
-}
-
-export const RuntimeSettings: React.FC<RuntimeSettingsProps> = ({
-  className,
-}) => {
+export const RuntimeSettings: React.FC = () => {
   const { saveUserConfig } = useRequestClient();
   const [config, setUserConfig] = useResolvedMarimoConfig();
 

package/src/components/editor/chrome/wrapper/storage.ts

@@ -15,7 +15,7 @@ let storedValue: string | null = null;
  */
 export function createStorage(location: "left" | "bottom"): PanelGroupStorage {
   return {
-    getItem(name) {
+    getItem(_name) {
       if (!storedValue) {
         return storedValue ?? null;
       }

package/src/components/editor/output/MarimoTracebackOutput.tsx

@@ -274,7 +274,7 @@ export const replaceTracebackFilenames = (domNode: DOMNode) => {
     return (
       <div
         className="inline-block cursor-pointer text-destructive hover:underline"
-        onClick={(_) => {
+        onClick={() => {
           getRequestClient().openFile({
             path: info.filePath,
             lineNumber: info.lineNumber,

package/src/components/icons/spinner.tsx

@@ -25,7 +25,7 @@ const spinnerVariants = cva("animate-spin", {
 const Spinner = React.forwardRef<
   SVGSVGElement,
   React.SVGProps<SVGSVGElement> & VariantProps<typeof spinnerVariants>
->(({ className, children, centered, size, ...props }, ref) => (
+>(({ className, children: _children, centered, size, ...props }, ref) => (
   <Loader2Icon
     ref={ref}
     className={cn(spinnerVariants({ centered, size }), className)}

package/src/components/ui/alert-dialog.tsx

@@ -28,7 +28,7 @@ AlertDialogPortal.displayName = AlertDialogPrimitive.Portal.displayName;
 const AlertDialogOverlay = React.forwardRef<
   React.ElementRef<typeof AlertDialogPrimitive.Overlay>,
   React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>
->(({ className, children, ...props }, ref) => (
+>(({ className, children: _children, ...props }, ref) => (
   <AlertDialogPrimitive.Overlay
     className={cn(
       "fixed inset-0 z-50 bg-background/80 backdrop-blur-xs transition-opacity animate-in fade-in",

package/src/core/ai/context/providers/datasource.ts

@@ -98,8 +98,12 @@ export class DatasourceContextProvider extends AIContextProvider<DatasourceConte
   public formatContext(item: DatasourceContextItem): string {
     const data = item.data;
     // Remove certain fields that are not needed in the context
-    const { name, display_name, source, ...filteredDatasource } =
-      data.connection;
+    const {
+      name,
+      display_name: _displayName,
+      source: _source,
+      ...filteredDatasource
+    } = data.connection;
 
     let datasource = filteredDatasource;
     const isInternalEngine = INTERNAL_SQL_ENGINES.has(name as ConnectionName);

package/src/core/cells/session.ts

@@ -56,7 +56,7 @@ function mergeSessionAndNotebookCells(
     return {
       cellIds,
       sessionCellData: new Map(
-        cellIds.map((id, idx) => [id, null] as [CellId, SessionCell | null]),
+        cellIds.map((id) => [id, null] as [CellId, SessionCell | null]),
       ),
       notebookCellData: new Map(
         cellIds.map(

package/src/core/codemirror/__tests__/setup.test.ts

@@ -100,7 +100,7 @@ function getDuplicateKeymaps(state: EditorState) {
     (keymap) => keymap,
   );
   const duplicates = Objects.fromEntries(
-    Object.entries(groupBy).filter(([key, value]) => value.length > 1),
+    Object.entries(groupBy).filter(([_key, value]) => value.length > 1),
   );
   return duplicates;
 }

package/src/core/codemirror/keymaps/vim.ts

@@ -369,7 +369,7 @@ class CodeMirrorVimSync {
       // We use onIdle to keep the focused editor snappy
       onIdle(() => {
         if (!skipBroadcast) {
-          this.broadcastModeChange(instance, e.mode, e.subMode);
+          this.broadcastModeChange(instance, e.mode);
         }
         this.isBroadcasting = false;
       });
@@ -380,11 +380,7 @@ class CodeMirrorVimSync {
     this.instances.delete(instance);
   }
 
-  public broadcastModeChange(
-    originInstance: EditorView,
-    mode: string,
-    subMode?: string,
-  ) {
+  public broadcastModeChange(originInstance: EditorView, mode: string) {
     invariant(
       "exitInsertMode" in Vim,
       "Vim does not have an exitInsertMode method",

package/src/core/codemirror/language/languages/markdown.ts

@@ -73,7 +73,7 @@ export class MarkdownLanguageAdapter implements LanguageAdapter<MarkdownLanguage
     _cellId: CellId,
     _completionConfig: CompletionConfig,
     hotkeys: HotkeyProvider,
-    _: PlaceholderType,
+    _placeholderType: PlaceholderType,
   ): Extension[] {
     const markdownLanguageData = markdown().language.data;
     let view: EditorView | undefined;

package/src/core/codemirror/language/languages/python.ts

@@ -157,7 +157,7 @@ const pylspClient = once((lspConfig: LSPConfig) => {
   return notebookClient;
 });
 
-const tyLspClient = once((_: LSPConfig) => {
+const tyLspClient = once((_config: LSPConfig) => {
   // oxlint-disable-next-line prefer-const -- reassigned after closure capture
   let resyncCallback: (() => Promise<void>) | undefined;
 
@@ -176,7 +176,7 @@ const tyLspClient = once((_: LSPConfig) => {
   const notebookClient = new NotebookLanguageServerClient(
     new LanguageServerClient({
       ...lspClientOpts,
-      getWorkspaceConfiguration: (_) => [{ disableLanguageServices: true }],
+      getWorkspaceConfiguration: () => [{ disableLanguageServices: true }],
     }),
     {},
   );
@@ -226,7 +226,7 @@ const pyreflyClient = once(
   },
 );
 
-const pyrightClient = once((_: LSPConfig) => {
+const pyrightClient = once((_config: LSPConfig) => {
   // oxlint-disable-next-line prefer-const -- reassigned after closure capture
   let resyncCallback: (() => Promise<void>) | undefined;
 

package/src/core/kernel/__tests__/RuntimeState.test.ts

@@ -25,7 +25,7 @@ describe("RuntimeState", () => {
 
   beforeEach(() => {
     vi.clearAllMocks();
-    mockSendComponentValues = vi.fn((args) => Promise.resolve(null));
+    mockSendComponentValues = vi.fn(() => Promise.resolve(null));
     uiElementRegistry = UIElementRegistry.INSTANCE;
     uiElementRegistry.entries.clear();
 

package/src/core/state/__tests__/jotai.test.tsx

@@ -0,0 +1,108 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { act, renderHook } from "@testing-library/react";
+import { atom, Provider } from "jotai";
+import type React from "react";
+import { describe, expect, it, vi } from "vitest";
+import { store, useJotaiEffect, waitFor } from "../jotai";
+
+const wrapper = ({ children }: { children: React.ReactNode }) => (
+  <Provider store={store}>{children}</Provider>
+);
+
+describe("waitFor function", () => {
+  it("should resolve when the atom satisfies the predicate", async () => {
+    const testAtom = atom(0);
+    store.set(testAtom, 10);
+
+    const result = await waitFor(testAtom, (value) => value === 10);
+    expect(result).toBe(10);
+  });
+
+  it("should resolve when the atom changes to satisfy the predicate", async () => {
+    const testAtom = atom(0);
+
+    setTimeout(() => store.set(testAtom, 15), 5);
+    setTimeout(() => store.set(testAtom, 20), 10);
+
+    const result = await waitFor(testAtom, (value) => value === 20);
+    expect(result).toBe(20);
+  });
+});
+
+describe("useJotaiEffect", () => {
+  it("calls the effect with the new and previous values", () => {
+    const testAtom = atom(0);
+    const effect = vi.fn();
+    renderHook(() => useJotaiEffect(testAtom, effect), { wrapper });
+
+    act(() => store.set(testAtom, 1));
+    act(() => store.set(testAtom, 2));
+
+    expect(effect.mock.calls).toEqual([
+      [1, 0],
+      [2, 1],
+    ]);
+  });
+
+  it("calls only the latest callback after a rerender", () => {
+    const testAtom = atom(0);
+    const first = vi.fn();
+    const second = vi.fn();
+    const { rerender } = renderHook(
+      ({ effect }) => useJotaiEffect(testAtom, effect),
+      { initialProps: { effect: first }, wrapper },
+    );
+
+    rerender({ effect: second });
+    act(() => store.set(testAtom, 1));
+
+    expect(first).not.toHaveBeenCalled();
+    expect(second).toHaveBeenCalledTimes(1);
+  });
+
+  it("subscribes once per rerender with an inline callback", () => {
+    const testAtom = atom(0);
+    const calls: number[] = [];
+    const { rerender } = renderHook(
+      () => useJotaiEffect(testAtom, (value) => calls.push(value)),
+      { wrapper },
+    );
+
+    rerender();
+    rerender();
+    act(() => store.set(testAtom, 1));
+
+    expect(calls).toEqual([1]);
+  });
+
+  it("stops listening to the previous atom when the atom changes", () => {
+    const firstAtom = atom(0);
+    const secondAtom = atom(0);
+    const effect = vi.fn();
+    const { rerender } = renderHook(
+      ({ target }) => useJotaiEffect(target, effect),
+      { initialProps: { target: firstAtom }, wrapper },
+    );
+
+    rerender({ target: secondAtom });
+    act(() => store.set(firstAtom, 1));
+    expect(effect).not.toHaveBeenCalled();
+
+    act(() => store.set(secondAtom, 1));
+    expect(effect).toHaveBeenCalledTimes(1);
+  });
+
+  it("unsubscribes on unmount", () => {
+    const testAtom = atom(0);
+    const effect = vi.fn();
+    const { unmount } = renderHook(() => useJotaiEffect(testAtom, effect), {
+      wrapper,
+    });
+
+    unmount();
+    act(() => store.set(testAtom, 1));
+
+    expect(effect).not.toHaveBeenCalled();
+  });
+});

package/src/core/state/jotai.ts

@@ -42,7 +42,7 @@ export function useJotaiEffect<T>(
   const store = useStore();
   useEffect(() => {
     let prevValue = store.get(atom);
-    store.sub(atom, () => {
+    return store.sub(atom, () => {
       const value = store.get(atom);
       effect(value, prevValue);
       prevValue = value;

package/src/core/wasm/bridge.ts

@@ -407,7 +407,7 @@ export class PyodideBridge implements RunRequests, EditRequests {
     return response as Snippets;
   };
 
-  public openFile: EditRequests["openFile"] = async ({ path }) => {
+  public openFile: EditRequests["openFile"] = async () => {
     const url = createShareableLink({
       code: null,
       baseUrl: window.location.origin,
@@ -451,7 +451,7 @@ export class PyodideBridge implements RunRequests, EditRequests {
     return null;
   };
 
-  public sendInstantiate: RunRequests["sendInstantiate"] = async (request) => {
+  public sendInstantiate: RunRequests["sendInstantiate"] = async () => {
     return null;
   };
 

package/src/core/wasm/store.ts

@@ -41,7 +41,7 @@ const urlFileStore: FileStore = {
 };
 
 export const domElementFileStore: FileStore = {
-  saveFile(contents: string) {
+  saveFile(_contents: string) {
     // Do nothing
   },
   readFile() {
@@ -54,7 +54,7 @@ export const domElementFileStore: FileStore = {
 };
 
 const remoteDefaultFileStore: FileStore = {
-  saveFile(contents: string) {
+  saveFile(_contents: string) {
     // Do nothing
   },
   readFile() {
@@ -79,7 +79,7 @@ export const mountConfigFileStore: FileStore = {
 };
 
 const emptyFileStore: FileStore = {
-  saveFile(contents: string) {
+  saveFile(_contents: string) {
     // Do nothing
   },
   readFile() {

package/src/core/wasm/worker/bootstrap.ts

@@ -85,7 +85,7 @@ export class DefaultWasmController implements WasmController {
         packages: [
           "micropip",
           "msgspec",
-          getMarimoWheel(opts.version),
+          getMarimoWheel(),
           "Markdown",
           "pymdown-extensions",
           "narwhals",

package/src/core/wasm/worker/getMarimoWheel.ts

@@ -1,6 +1,6 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
-export function getMarimoWheel(version: string) {
+export function getMarimoWheel() {
   if (import.meta.env.DEV && import.meta.env.VITE_WASM_MARIMO_PREBUILT_WHEEL) {
     return "marimo-base";
   }

package/src/plugins/impl/CodeEditorPlugin.tsx

@@ -71,7 +71,7 @@ const CodeEditorComponent = (props: CodeEditorComponentProps) => {
   });
 
   const handleChange = useEvent((newValue: string) => {
-    setLocalValue((_) => newValue);
+    setLocalValue(newValue);
     if (typeof props.debounce === "number") {
       setValueDebounced(newValue);
     } else if (!props.debounce) {

package/src/plugins/impl/RangeSliderPlugin.tsx

@@ -74,7 +74,6 @@ const RangeSliderComponent = ({
   start,
   stop,
   step,
-  steps,
   debounce,
   orientation,
   showValue,

package/src/plugins/impl/data-explorer/ConnectedDataExplorerComponent.tsx

@@ -47,7 +47,7 @@ const ConnectedDataExplorerComponent = (props: DataTableProps): JSX.Element => {
     // Subscribe to the store
     const unsub = store.sub(chartSpecAtom, () => {
       const value = store.get(chartSpecAtom);
-      const { schema, ...withoutSchema } = value;
+      const { schema: _schema, ...withoutSchema } = value;
       props.setValue(withoutSchema);
     });
 

package/src/plugins/impl/data-explorer/state/reducer.ts

@@ -47,7 +47,7 @@ const { valueAtom: chartSpecAtom, useActions } = createReducerAndAtoms(
     },
     set: (state, next: ChartSpec) => {
       // remove schema
-      const { schema, ...rest } = next;
+      const { schema: _schema, ...rest } = next;
       return { ...state, ...rest };
     },
   },

package/src/plugins/impl/data-frames/DataFramePlugin.tsx

@@ -192,7 +192,6 @@ const EMPTY: Transformations = {
 export const DataFrameComponent = memo(
   ({
     columns,
-    dataframeName,
     pageSize,
     showDownload,
     lazy,

package/src/plugins/impl/panel/PanelPlugin.tsx

@@ -78,7 +78,7 @@ type T = Record<string, unknown>;
 
 // oxlint-disable-next-line typescript/consistent-type-definitions
 type PluginFunctions = {
-  send_to_widget: <T>(req: {
+  send_to_widget: (req: {
     message?: unknown;
     buffers?: unknown;
   }) => Promise<null | undefined>;

package/src/plugins/impl/vega/make-selectable.ts

@@ -219,7 +219,7 @@ function removeSpecificParamsFromNestedSpecs(
     }
 
     if (filteredParams.length === 0) {
-      const { params, ...rest } = spec;
+      const { params: _params, ...rest } = spec;
       return rest as SpecWithParams;
     }