@marimo-team/frontend 0.23.16-dev6 → 0.23.16-dev62

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

@@ -12,6 +12,8 @@ import type {
   EnvironmentInfo,
   ExportAsHTMLRequest,
   ExportAsMarkdownRequest,
+  ExportAsScriptRequest,
+  ExportedFile,
   FileCopyRequest,
   FileCopyResponse,
   FileCreateRequest,
@@ -96,8 +98,11 @@ export interface RawBridge {
   load_packages(request: string): Promise<string>;
   read_file(request: string): Promise<string>;
   set_interrupt_buffer(request: Uint8Array): Promise<string>;
-  export_html(request: ExportAsHTMLRequest): Promise<string>;
-  export_markdown(request: ExportAsMarkdownRequest): Promise<string>;
+  export_html(request: ExportAsHTMLRequest): Promise<ExportedFile<string>>;
+  export_markdown(
+    request: ExportAsMarkdownRequest,
+  ): Promise<ExportedFile<string>>;
+  export_script(request: ExportAsScriptRequest): Promise<ExportedFile<string>>;
 }
 
 export type BridgePayload<T extends keyof RawBridge> = T extends keyof RawBridge
@@ -105,9 +110,11 @@ export type BridgePayload<T extends keyof RawBridge> = T extends keyof RawBridge
   : undefined;
 
 export type SerializedBridge = {
-  [P in keyof RawBridge]: RawBridge[P] extends (
+  [P in Exclude<keyof RawBridge, "save">]: RawBridge[P] extends (
     payload: string,
   ) => Promise<unknown>
     ? (payload: string) => Promise<string>
     : RawBridge[P];
+} & {
+  save(payload: string): Promise<void>;
 };

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

@@ -250,13 +250,9 @@ const requestHandler = createRPCRequestHandler({
    * Save the notebook
    */
   saveNotebook: async (opts: SaveNotebookRequest) => {
-    // Partially duplicated from save-worker.ts
     await pyodideReadyPromise; // Make sure loading is done
-    const saveFile = self.pyodide.runPython(`
-      from marimo._pyodide.bootstrap import save_file
-      save_file
-    `);
-    await saveFile(JSON.stringify(opts), WasmFileSystem.NOTEBOOK_FILENAME);
+    const bridge = await bridgeReady.promise;
+    await bridge.save(JSON.stringify(opts));
   },
 
   /**
@@ -287,8 +283,11 @@ const requestHandler = createRPCRequestHandler({
         `);
     }
 
-    // Special case to lazily install PyYAML on export_markdown
-    if (functionName === "export_markdown") {
+    // Script export also parses Markdown frontmatter when present.
+    if (
+      functionName === "export_markdown" ||
+      functionName === "export_script"
+    ) {
       await self.pyodide.runPythonAsync(`
         import micropip
 

package/src/core/websocket/useMarimoKernelConnection.tsx

@@ -42,6 +42,7 @@ import { connectionTransportTypeAtom, useSetAppConfig } from "../config/config";
 import { useDataSourceActions } from "../datasets/data-source-connections";
 import type { ConnectionName } from "../datasets/engines";
 import {
+  DiscoverDataSources,
   PreviewSQLSchemaList,
   PreviewSQLTable,
   PreviewSQLTableList,
@@ -394,6 +395,9 @@ export function useMarimoKernelConnection(opts: {
       case "validate-sql-result":
         ValidateSQL.resolve(msg.data.request_id as RequestId, msg.data);
         return;
+      case "data-source-discovery-result":
+        DiscoverDataSources.resolve(msg.data.request_id as RequestId, msg.data);
+        return;
       case "secret-keys-result":
         SECRETS_REGISTRY.resolve(msg.data.request_id, msg.data);
         return;

package/src/css/app/codemirror.css

@@ -90,8 +90,22 @@
     @apply bg-muted border border-border rounded-md px-1;
   }
 
-  .cm-diagnosticText > div {
-    display: inline-flex;
+  /* The message, the docs link, and related info are siblings; stack them. */
+  .cm-lsp-diagnostic-message {
+    @apply flex flex-col items-start gap-1;
+
+    /* Rendered markdown, so the `pre-wrap` on `.cm-diagnostic` would only turn
+       the whitespace between block tags into blank lines. */
+    white-space: normal;
+  }
+
+  .cm-diagnostic-code-link {
+    @apply text-xs;
+  }
+
+  /* The docs link already reads `source(code)`; don't repeat it below. */
+  .cm-diagnostic:has(.cm-diagnostic-code-link) .cm-diagnosticSource {
+    @apply hidden;
   }
 }
 

package/src/hooks/__tests__/useDataSourceDiscovery.test.ts

@@ -0,0 +1,80 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { DiscoverDataSources } from "@/core/datasets/request-registry";
+import { loadDataSourceDiscovery } from "../useDataSourceDiscovery";
+
+describe("loadDataSourceDiscovery", () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("returns the kernel's secret-free discovery model", async () => {
+    const sources = [
+      {
+        id: "pyiceberg-prod",
+        integration: "pyiceberg",
+        category: "catalog" as const,
+        displayName: "PyIceberg (prod)",
+        confidence: "high" as const,
+        origins: [
+          {
+            type: "configuration" as const,
+            label: "Resolved PyIceberg configuration",
+          },
+        ],
+        configuration: [
+          {
+            field: "Catalog",
+            value: {
+              kind: "safe-literal" as const,
+              value: "prod",
+            },
+          },
+        ],
+        code: 'catalog = load_catalog("prod")',
+      },
+    ];
+    const request = vi.spyOn(DiscoverDataSources, "request").mockResolvedValue({
+      request_id: "request-id",
+      sources,
+    });
+
+    const detected = await loadDataSourceDiscovery();
+
+    expect({ detected, requests: request.mock.calls }).toMatchInlineSnapshot(`
+      {
+        "detected": [
+          {
+            "category": "catalog",
+            "code": "catalog = load_catalog("prod")",
+            "confidence": "high",
+            "configuration": [
+              {
+                "field": "Catalog",
+                "value": {
+                  "kind": "safe-literal",
+                  "value": "prod",
+                },
+              },
+            ],
+            "displayName": "PyIceberg (prod)",
+            "id": "pyiceberg-prod",
+            "integration": "pyiceberg",
+            "origins": [
+              {
+                "label": "Resolved PyIceberg configuration",
+                "type": "configuration",
+              },
+            ],
+          },
+        ],
+        "requests": [
+          [
+            {},
+          ],
+        ],
+      }
+    `);
+  });
+});

package/src/hooks/useDataSourceDiscovery.ts

@@ -0,0 +1,18 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import type { DetectedDataSource } from "@/core/datasets/data-source-discovery";
+import { DiscoverDataSources } from "@/core/datasets/request-registry";
+import { useAsyncData } from "./useAsyncData";
+
+export async function loadDataSourceDiscovery(): Promise<DetectedDataSource[]> {
+  const result = await DiscoverDataSources.request({});
+  return result.sources;
+}
+
+/**
+ * Reusable UI-facing hook for kernel-managed datasource discovery.
+ * Consumers decide how to render, filter, or act on the detected model.
+ */
+export function useDataSourceDiscovery() {
+  return useAsyncData(loadDataSourceDiscovery, []);
+}

package/src/plugins/impl/DataTablePlugin.tsx

@@ -908,7 +908,10 @@ const DataTableComponent = ({
     );
   }, [fieldTypes, columnSummaries]);
 
-  const fieldTypesOrInferred = fieldTypes ?? inferFieldTypes(data);
+  const rowHeaderNames = new Set(rowHeaders.map(([name]) => name));
+  const fieldTypesOrInferred =
+    fieldTypes ??
+    inferFieldTypes(data).filter(([name]) => !rowHeaderNames.has(name));
 
   const memoizedUnclampedFieldTypes =
     useDeepCompareMemoize(fieldTypesOrInferred);

package/src/plugins/impl/FormPlugin.tsx

@@ -148,7 +148,7 @@ export const FormWrapper = <T,>({
           if (evt.key === "Enter" && (evt.ctrlKey || evt.metaKey)) {
             evt.preventDefault();
             evt.stopPropagation();
-            setValue(newValue);
+            formDiv.current?.requestSubmit();
           }
         }}
       >

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

@@ -30,6 +30,164 @@ beforeAll(() => {
 });
 
 describe("LoadingDataTableComponent", () => {
+  it("keeps data columns when inferred types include a row header", async () => {
+    const host = document.createElement("div");
+    const data = JSON.stringify([{ index: "first", value: 1 }]);
+
+    render(
+      <Provider store={store}>
+        <TooltipProvider>
+          <LoadingDataTableComponent
+            label={null}
+            totalRows={1}
+            pagination={false}
+            pageSize={10}
+            selection={null}
+            showDownload={false}
+            showFilters={false}
+            showColumnSummaries={false}
+            showDataTypes={false}
+            showPageSizeSelector={false}
+            showColumnExplorer={false}
+            showRowExplorer={false}
+            showChartBuilder={false}
+            rowHeaders={[["index", ["string", "object"]]]}
+            fieldTypes={undefined}
+            totalColumns={1}
+            maxColumns={1}
+            hasStableRowId={false}
+            lazy={false}
+            host={host}
+            showSearch={false}
+            value={[]}
+            setValue={vi.fn()}
+            data={data}
+            search={vi.fn().mockResolvedValue({
+              data,
+              total_rows: 1,
+              cell_styles: null,
+              cell_hover_texts: null,
+            })}
+            download_as={vi.fn() as DownloadAsArgs}
+            get_column_summaries={vi.fn()}
+            get_data_url={vi.fn() as GetDataUrl}
+            get_row_ids={vi.fn() as GetRowIds}
+            get_size_bytes={vi.fn().mockResolvedValue({ size_bytes: null })}
+          />
+        </TooltipProvider>
+      </Provider>,
+    );
+
+    await waitFor(() => {
+      expect(
+        screen.getByRole("columnheader", { name: "value" }),
+      ).toBeInTheDocument();
+    });
+  });
+
+  it("does not log duplicate keys when a pivot becomes empty", async () => {
+    const host = document.createElement("div");
+    const consoleError = vi
+      .spyOn(console, "error")
+      .mockImplementation(() => {});
+    const populatedData = JSON.stringify([
+      { DSGROUP: "a", no: 1, yes: 1 },
+      { DSGROUP: "b", no: 0, yes: 1 },
+    ]);
+    const Wrapper = ({ children }: { children: React.ReactNode }) => (
+      <Provider store={store}>
+        <TooltipProvider>{children}</TooltipProvider>
+      </Provider>
+    );
+    const commonProps = {
+      label: null,
+      pagination: false,
+      pageSize: 10,
+      selection: null,
+      showDownload: false,
+      showFilters: false,
+      showColumnSummaries: false as const,
+      showDataTypes: true,
+      showPageSizeSelector: false,
+      showColumnExplorer: false,
+      showRowExplorer: false,
+      showChartBuilder: false,
+      rowHeaders: [
+        ["DSGROUP", ["string", "object"]],
+      ] as FieldTypesWithExternalType,
+      maxColumns: "all" as const,
+      hasStableRowId: false,
+      lazy: false,
+      host,
+      showSearch: false,
+      value: [] as (number | string | { rowId: string; columnName?: string })[],
+      setValue: vi.fn(),
+      download_as: vi.fn() as DownloadAsArgs,
+      get_column_summaries: vi.fn(),
+      get_data_url: vi.fn() as GetDataUrl,
+      get_row_ids: vi.fn() as GetRowIds,
+      get_size_bytes: vi.fn().mockResolvedValue({ size_bytes: null }),
+    };
+
+    try {
+      const { rerender } = render(
+        <Wrapper>
+          <LoadingDataTableComponent
+            {...commonProps}
+            totalRows={2}
+            totalColumns={2}
+            fieldTypes={[
+              ["no", ["number", "int64"]],
+              ["yes", ["number", "int64"]],
+            ]}
+            data={populatedData}
+            search={vi.fn().mockResolvedValue({
+              data: populatedData,
+              total_rows: 2,
+              cell_styles: null,
+              cell_hover_texts: null,
+            })}
+          />
+        </Wrapper>,
+      );
+
+      await waitFor(() => {
+        expect(screen.getAllByRole("row")).toHaveLength(3);
+      });
+
+      await act(async () => {
+        rerender(
+          <Wrapper>
+            <LoadingDataTableComponent
+              {...commonProps}
+              totalRows={0}
+              totalColumns={0}
+              fieldTypes={undefined}
+              data="[]"
+              search={vi.fn().mockResolvedValue({
+                data: "[]",
+                total_rows: 0,
+                cell_styles: null,
+                cell_hover_texts: null,
+              })}
+            />
+          </Wrapper>,
+        );
+      });
+
+      await waitFor(() => {
+        expect(screen.getByText("No results.")).toBeInTheDocument();
+      });
+
+      const duplicateKeyErrors = consoleError.mock.calls.filter((args) =>
+        args.some((arg) => typeof arg === "string" && arg.includes("same key")),
+      );
+      expect(duplicateKeyErrors).toHaveLength(0);
+    } finally {
+      consoleError.mockRestore();
+    }
+  });
+
   /**
    * Regression test for https://github.com/marimo-team/marimo/issues/8023
    *

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

@@ -0,0 +1,162 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import { FormWrapper } from "../FormPlugin";
+
+describe("FormPlugin", () => {
+  it("submits the form on Ctrl+Enter and calls setValue", async () => {
+    const setValue = vi.fn();
+    const validate = vi.fn().mockResolvedValue(null);
+
+    render(
+      <FormWrapper
+        currentValue="old-val"
+        newValue="new-val"
+        setValue={setValue}
+        validate={validate}
+        shouldValidate={false}
+        clearOnSubmit={false}
+        submitButtonLabel="Submit"
+        bordered={true}
+        loading={false}
+        submitButtonDisabled={false}
+        showClearButton={false}
+        clearButtonLabel="Clear"
+        label={null}
+      >
+        <input data-testid="input" />
+      </FormWrapper>,
+    );
+
+    const input = screen.getByTestId("input");
+
+    // Simulate Ctrl+Enter on input
+    fireEvent.keyDown(input, { key: "Enter", ctrlKey: true });
+
+    await waitFor(() => {
+      expect(setValue).toHaveBeenCalledWith("new-val");
+    });
+  });
+
+  it("submits the form on Ctrl+Enter and runs validation when shouldValidate is true", async () => {
+    const setValue = vi.fn();
+    const validate = vi.fn().mockResolvedValue("Validation failed message");
+
+    render(
+      <FormWrapper
+        currentValue="old-val"
+        newValue="new-val"
+        setValue={setValue}
+        validate={validate}
+        shouldValidate={true}
+        clearOnSubmit={false}
+        submitButtonLabel="Submit"
+        bordered={true}
+        loading={false}
+        submitButtonDisabled={false}
+        showClearButton={false}
+        clearButtonLabel="Clear"
+        label={null}
+      >
+        <input data-testid="input" />
+      </FormWrapper>,
+    );
+
+    const input = screen.getByTestId("input");
+
+    // Simulate Ctrl+Enter on input
+    fireEvent.keyDown(input, { key: "Enter", ctrlKey: true });
+
+    await waitFor(() => {
+      expect(validate).toHaveBeenCalledWith({ value: "new-val" });
+      // should not submit (setValue not called) due to validation failure
+      expect(setValue).not.toHaveBeenCalled();
+      // error message displayed
+      expect(screen.getByText("Validation failed message")).toBeInTheDocument();
+    });
+  });
+
+  it("clears inputs on submission when clearOnSubmit is true", async () => {
+    const setValue = vi.fn();
+    const validate = vi.fn().mockResolvedValue(null);
+
+    let mockUIElement: (HTMLElement & { reset?: () => void }) | null = null;
+    const mockReset = vi.fn();
+
+    render(
+      <FormWrapper
+        currentValue="old-val"
+        newValue="new-val"
+        setValue={setValue}
+        validate={validate}
+        shouldValidate={false}
+        clearOnSubmit={true}
+        submitButtonLabel="Submit"
+        bordered={true}
+        loading={false}
+        submitButtonDisabled={false}
+        showClearButton={false}
+        clearButtonLabel="Clear"
+        label={null}
+      >
+        <div
+          ref={(el) => {
+            if (el && !mockUIElement) {
+              mockUIElement = document.createElement("marimo-ui-element");
+              mockUIElement.setAttribute("data-testid", "mock-ui-element");
+              mockUIElement.reset = mockReset;
+              const inputEl = document.createElement("input");
+              inputEl.type = "text";
+              mockUIElement.appendChild(inputEl);
+              el.appendChild(mockUIElement);
+            }
+          }}
+        />
+      </FormWrapper>,
+    );
+
+    const input = screen.getByRole("textbox");
+
+    // Simulate Ctrl+Enter on input
+    fireEvent.keyDown(input, { key: "Enter", ctrlKey: true });
+
+    await waitFor(() => {
+      expect(setValue).toHaveBeenCalledWith("new-val");
+      expect(mockReset).toHaveBeenCalled();
+    });
+  });
+
+  it("does not submit on Shift+Enter", async () => {
+    const setValue = vi.fn();
+    const validate = vi.fn().mockResolvedValue(null);
+
+    render(
+      <FormWrapper
+        currentValue="old-val"
+        newValue="new-val"
+        setValue={setValue}
+        validate={validate}
+        shouldValidate={false}
+        clearOnSubmit={false}
+        submitButtonLabel="Submit"
+        bordered={true}
+        loading={false}
+        submitButtonDisabled={false}
+        showClearButton={false}
+        clearButtonLabel="Clear"
+        label={null}
+      >
+        <input data-testid="input" />
+      </FormWrapper>,
+    );
+
+    const input = screen.getByTestId("input");
+
+    // Simulate Shift+Enter on input
+    fireEvent.keyDown(input, { key: "Enter", shiftKey: true });
+
+    expect(setValue).not.toHaveBeenCalled();
+    expect(validate).not.toHaveBeenCalled();
+  });
+});

package/src/plugins/impl/anywidget/__tests__/model.test.ts

@@ -263,6 +263,61 @@ describe("Model", () => {
       await TestUtils.nextTick(); // flush
       expect(callback).toHaveBeenCalledTimes(1);
     });
+
+    it("should not mark kernel-pushed state dirty", () => {
+      getMarimoInternal(model).updateAndEmitDiffs({ foo: "changed", bar: 456 });
+
+      model.save_changes();
+      expect(mockComm.sendUpdate).not.toHaveBeenCalled();
+    });
+
+    it("should not echo kernel-pushed state alongside a local set", () => {
+      // Kernel pushes a large trait; widget ESM then sets one field.
+      getMarimoInternal(model).updateAndEmitDiffs({
+        foo: "from kernel",
+        bar: 123,
+      });
+      model.set("bar", 456);
+
+      model.save_changes();
+      expect(mockComm.sendUpdate).toHaveBeenCalledExactlyOnceWith({
+        bar: 456,
+      });
+    });
+
+    it("should drop a pending local write superseded by a kernel push", () => {
+      // Local write, not yet saved...
+      model.set("foo", "local");
+      // ...then the kernel pushes a newer value for the same key.
+      getMarimoInternal(model).updateAndEmitDiffs({
+        foo: "from kernel",
+        bar: 123,
+      });
+      expect(model.get("foo")).toBe("from kernel");
+
+      // Saving must not resend the stale local value.
+      model.save_changes();
+      expect(mockComm.sendUpdate).not.toHaveBeenCalled();
+    });
+
+    it("should drop a pending local write the kernel pushed the same value for", () => {
+      const callback = vi.fn();
+      model.on("change:foo", callback);
+
+      // Local write, not yet saved...
+      model.set("foo", "agreed");
+      expect(callback).toHaveBeenCalledTimes(1);
+
+      // ...then the kernel independently pushes the same value.
+      getMarimoInternal(model).updateAndEmitDiffs({
+        foo: "agreed",
+        bar: 123,
+      });
+      expect(callback).toHaveBeenCalledTimes(1); // no spurious re-emit
+
+      model.save_changes();
+      expect(mockComm.sendUpdate).not.toHaveBeenCalled();
+    });
   });
 
   describe("emitCustomMessage", () => {

package/src/plugins/impl/anywidget/model.ts

@@ -53,7 +53,8 @@ export function getMarimoInternal<T extends ModelState>(
 
 export class Model<T extends ModelState> implements AnyModel<T> {
   #ANY_CHANGE_EVENT = "change";
-  #dirtyFields: Map<keyof T, unknown>;
+  /** Keys last written by the widget that the kernel hasn't seen yet. */
+  #dirtyFields: Set<keyof T>;
   #data: T;
   #comm: MarimoComm<T>;
   #listeners: Record<string, Set<EventHandler> | undefined> = {};
@@ -70,7 +71,7 @@ export class Model<T extends ModelState> implements AnyModel<T> {
   constructor(data: T, comm: MarimoComm<T>, signal?: AbortSignal) {
     this.#data = data;
     this.#comm = comm;
-    this.#dirtyFields = new Map();
+    this.#dirtyFields = new Set();
     if (signal) {
       signal.addEventListener("abort", () => {
         Logger.debug("[Model] Signal aborted, clearing all listeners");
@@ -140,7 +141,7 @@ export class Model<T extends ModelState> implements AnyModel<T> {
 
   set<K extends keyof T>(key: K, value: T[K]): void {
     this.#data = { ...this.#data, [key]: value };
-    this.#dirtyFields.set(key, value);
+    this.#dirtyFields.add(key);
     this.#emit(`change:${key as K & string}`, value);
     this.#emitAnyChange();
   }
@@ -151,7 +152,7 @@ export class Model<T extends ModelState> implements AnyModel<T> {
     }
     // Only send the dirty fields, not the entire state.
     const partialData = Object.fromEntries(
-      this.#dirtyFields.entries(),
+      [...this.#dirtyFields].map((key) => [key, this.#data[key]]),
     ) as Partial<T>;
 
     // Clear the dirty fields to avoid sending again.
@@ -204,6 +205,15 @@ export class Model<T extends ModelState> implements AnyModel<T> {
     }
   }
 
+  /**
+   * Apply a kernel-originated state update.
+   *
+   * Unlike `set()`, this never marks fields dirty — the kernel already
+   * has these values, so `save_changes()` must not echo them back.
+   *
+   * The kernel wins conflicts: a pending unsaved widget write to the same
+   * key is dropped, not replayed on top.
+   */
   #updateAndEmitDiffs(value: T) {
     if (value == null) {
       return;
@@ -211,9 +221,14 @@ export class Model<T extends ModelState> implements AnyModel<T> {
 
     Object.keys(value).forEach((key) => {
       const k = key as keyof T;
+      // Unconditional: guarding on inequality would leave a same-valued
+      // pending write dirty, and echo it back on save.
+      this.#dirtyFields.delete(k);
       // Shallow equal since these can be large objects
       if (this.#data[k] !== value[k]) {
-        this.set(k, value[k]);
+        this.#data = { ...this.#data, [k]: value[k] };
+        this.#emit(`change:${k as keyof T & string}`, value[k]);
+        this.#emitAnyChange();
       }
     });
   }