@marimo-team/frontend 0.23.10-dev5 → 0.23.10-dev50

package/src/components/ui/select-core/utils.ts

@@ -0,0 +1,121 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+import type { BulkActionSpec, Option } from "./types";
+
+/**
+ * Override cmdk's relevance-sorting filter with a stricter membership test: an
+ * option matches only when every whitespace-separated query word appears in it
+ * (case-insensitive), in any order. More lenient than exact match, stricter than
+ * fuzzy.
+ *
+ * Examples:
+ * - "foo bar" matches "foo bar"
+ * - "bar foo" matches "foo bar"
+ * - "foob" does not match "foo bar"
+ */
+export function multiselectFilterFn(option: string, value: string): number {
+  const words = value.split(/\s+/);
+  const match = words.every((word) =>
+    option.toLowerCase().includes(word.toLowerCase()),
+  );
+  return match ? 1 : 0;
+}
+
+/** Union: append the not-yet-selected members of `toAdd`, preserving order. */
+export function selectMatching<V>(selected: V[], toAdd: V[]): V[] {
+  const set = new Set(selected);
+  return [...set, ...toAdd.filter((v) => !set.has(v))];
+}
+
+/** Difference: drop every member of `toRemove` from `selected`. */
+export function deselectMatching<V>(selected: V[], toRemove: V[]): V[] {
+  const set = new Set(toRemove);
+  return selected.filter((v) => !set.has(v));
+}
+
+/**
+ * Order options for the idle (no active search) menu: pinned selections first in
+ * pin insertion order (so a freshly added selection appears after earlier ones),
+ * then everything else in option order. `pinnedSelection` is a frozen snapshot
+ * taken when the menu opens, so toggling an item does not reorder the list under
+ * the cursor. Returns the count of pinned options alongside the list so callers
+ * don't have to re-scan to find where the pinned block ends.
+ */
+export function getVisibleOptions<V>(
+  options: Array<Option<V>>,
+  pinnedSelection: ReadonlySet<V>,
+): { visibleOptions: Array<Option<V>>; pinnedCount: number } {
+  const byValue = new Map(options.map((o) => [o.value, o] as const));
+  const pinned: Array<Option<V>> = [];
+  for (const value of pinnedSelection) {
+    const option = byValue.get(value);
+    if (option) {
+      pinned.push(option);
+    }
+  }
+  const rest = options.filter((o) => !pinnedSelection.has(o.value));
+  return { visibleOptions: [...pinned, ...rest], pinnedCount: pinned.length };
+}
+
+/**
+ * Decide which bulk rows the menu shows for the current search/cap state.
+ *
+ * When searching, the select-side spec carries the unselected matches and the
+ * deselect-side spec carries the selected matches (each omitted when empty).
+ * When idle, the spec is just `select-all` / `deselect-all` with an `enabled`
+ * flag for the disabled-but-visible state. `maxSelections` hides the select-
+ * side everywhere (a bulk select could exceed the cap); `maxSelections === 1`
+ * suppresses bulk rows entirely. Returns `[]` when bulk rows shouldn't show.
+ *
+ * Specs come in select-then-deselect order so the facade can render them as-is.
+ */
+export function getBulkActions<V>(params: {
+  options: Array<Option<V>>;
+  filteredOptions: Array<Option<V>>;
+  value: V[];
+  searchQuery: string;
+  maxSelections: number | undefined;
+}): Array<BulkActionSpec<V>> {
+  const { options, filteredOptions, value, searchQuery, maxSelections } =
+    params;
+
+  if (options.length <= 2 || maxSelections === 1) {
+    return [];
+  }
+
+  const capped = maxSelections != null;
+  const specs: Array<BulkActionSpec<V>> = [];
+
+  if (searchQuery !== "") {
+    if (filteredOptions.length === 0) {
+      return [];
+    }
+    const selected = new Set(value);
+    const selectedMatches: Array<Option<V>> = [];
+    const unselectedMatches: Array<Option<V>> = [];
+    for (const option of filteredOptions) {
+      if (selected.has(option.value)) {
+        selectedMatches.push(option);
+      } else if (!option.disabled) {
+        // Disabled rows can't be picked individually, so bulk select skips them too.
+        unselectedMatches.push(option);
+      }
+    }
+    if (!capped && unselectedMatches.length > 0) {
+      specs.push({ kind: "select-matching", items: unselectedMatches });
+    }
+    if (selectedMatches.length > 0) {
+      specs.push({ kind: "deselect-matching", items: selectedMatches });
+    }
+    return specs;
+  }
+
+  if (!capped) {
+    const selected = new Set(value);
+    specs.push({
+      kind: "select-all",
+      enabled: options.some((o) => !o.disabled && !selected.has(o.value)),
+    });
+  }
+  specs.push({ kind: "deselect-all", enabled: value.length > 0 });
+  return specs;
+}

package/src/components/ui/use-toast.ts

@@ -58,6 +58,10 @@ interface State {
 
 const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>();
 
+// Keys of toasts requested with `once: true`, suppressed after first show
+// for the lifetime of the page (i.e. one static-preview session).
+const shownOnceKeys = new Set<string>();
+
 const addToRemoveQueue = (toastId: string) => {
   if (toastTimeouts.has(toastId)) {
     return;
@@ -159,9 +163,18 @@ function dispatch(action: Action) {
 
 type Toast = Omit<ToasterToast, "id">;
 
-function toast({ id, ...props }: Toast & { id?: string }) {
+function toast({
+  id,
+  once,
+  ...props
+}: Toast & { id?: string; once?: boolean }) {
   const toastId = id || genId();
 
+  // `once` dedupe requires a caller-provided stable `id`. A generated id is
+  // unique per call, so it could never match (and would grow the set without
+  // bound); gate on `id` so `once` without one is simply a no-op.
+  const dedupeOnce = once === true && id !== undefined;
+
   const update = (props: Toast) =>
     dispatch({
       type: "UPDATE_TOAST",
@@ -183,19 +196,26 @@ function toast({ id, ...props }: Toast & { id?: string }) {
       },
     });
 
-  dispatch({
-    type: "ADD_TOAST",
-    toast: {
-      ...props,
-      id: toastId,
-      open: true,
-      onOpenChange: (open) => {
-        if (!open) {
-          dismiss();
-        }
+  const suppressed = dedupeOnce && shownOnceKeys.has(toastId);
+  if (dedupeOnce) {
+    shownOnceKeys.add(toastId);
+  }
+
+  if (!suppressed) {
+    dispatch({
+      type: "ADD_TOAST",
+      toast: {
+        ...props,
+        id: toastId,
+        open: true,
+        onOpenChange: (open) => {
+          if (!open) {
+            dismiss();
+          }
+        },
       },
-    },
-  });
+    });
+  }
 
   return {
     id: toastId,

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

@@ -33,6 +33,7 @@ import { cellActionsState } from "../../cells/state";
 import { pythonCompletionSource } from "../../completion/completer";
 import type { PlaceholderType } from "../../config/types";
 import { FederatedLanguageServerClient } from "../../lsp/federated-lsp";
+import { createLspMarkdownRenderer } from "../../lsp/markdown-renderer";
 import { NotebookLanguageServerClient } from "../../lsp/notebook-lsp";
 import { createTransport } from "../../lsp/transports";
 import { CellDocumentUri, type ILanguageServerClient } from "../../lsp/types";
@@ -342,6 +343,7 @@ export class PythonLanguageAdapter implements LanguageAdapter<{}> {
             client: client as unknown as LanguageServerClient,
             languageId: "python",
             allowHTMLContent: true,
+            markdownRenderer: createLspMarkdownRenderer(),
             useSnippetOnCompletion: true,
             hoverConfig: hoverOptions,
             completionConfig: autocompleteOptions,

package/src/core/codemirror/language/languages/sql/utils.ts

@@ -14,6 +14,7 @@ import {
 } from "@codemirror/lang-sql";
 import {
   BigQueryDialect,
+  DremioDialect,
   DuckDBDialect,
 } from "@marimo-team/codemirror-sql/dialects";
 import type { DataSourceConnection } from "@/core/kernel/messages";
@@ -97,6 +98,8 @@ export function guessDialect(
       return PLSQL;
     case "bigquery":
       return BigQueryDialect;
+    case "dremio":
+      return DremioDialect;
     case "timescaledb":
       return PostgreSQL; // TimescaleDB is a PostgreSQL dialect
     case "awsathena":
@@ -116,7 +119,6 @@ export function guessDialect(
     case "spark":
     case "databricks":
     case "datafusion":
-    case "dremio":
       Logger.debug("Unsupported dialect", { dialect });
       return ModifiedStandardSQL;
     default:

package/src/core/codemirror/lsp/__tests__/markdown-renderer.test.ts

@@ -0,0 +1,41 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+import { describe, expect, it } from "vitest";
+import { createLspMarkdownRenderer } from "../markdown-renderer";
+
+describe("createLspMarkdownRenderer", () => {
+  it("syntax-highlights python code blocks with tok-* span classes", () => {
+    const render = createLspMarkdownRenderer();
+    const result = render("```python\ndef foo():\n    pass\n```");
+    expect(result).toContain('class="language-python"');
+    expect(result).toContain("tok-keyword");
+    expect(result).toContain("<pre><code");
+  });
+
+  it("does not highlight non-python code blocks", () => {
+    const render = createLspMarkdownRenderer();
+    const result = render("```bash\necho hello\n```");
+    expect(result).not.toContain("tok-keyword");
+    expect(result).toContain("<code");
+  });
+
+  it("renders empty python code blocks as empty string", () => {
+    const render = createLspMarkdownRenderer();
+    const result = render("```python\n   \n```");
+    expect(result).toBe("");
+  });
+
+  it("renders markdown prose unchanged", () => {
+    const render = createLspMarkdownRenderer();
+    const result = render("## Examples\n\nSome text.");
+    expect(result).toContain("<h2");
+    expect(result).toContain("Examples");
+    expect(result).toContain("Some text.");
+  });
+
+  it("escapes HTML in highlighted code", () => {
+    const render = createLspMarkdownRenderer();
+    const result = render('```python\nx = "<div>"\n```');
+    expect(result).not.toContain("<div>");
+    expect(result).toContain("&lt;div&gt;");
+  });
+});

package/src/core/codemirror/lsp/markdown-renderer.ts

@@ -0,0 +1,59 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+import { classHighlighter, highlightCode } from "@lezer/highlight";
+import { parser as pythonParser } from "@lezer/python";
+import { marked } from "marked";
+
+/**
+ * Syntax-highlight a Python code string using the lezer Python parser.
+ * Returns an HTML string with tok-* span classes for styling.
+ */
+function highlightPython(code: string): string {
+  const tree = pythonParser.parse(code);
+  let html = "";
+  highlightCode(
+    code,
+    tree,
+    classHighlighter,
+    (text, classes) => {
+      const escaped = text
+        .replace(/&/g, "&")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;");
+      html += classes ? `<span class="${classes}">${escaped}</span>` : escaped;
+    },
+    () => {
+      html += "\n";
+    },
+  );
+  return html;
+}
+
+/**
+ * A markdown renderer for LSP hover tooltips that adds syntax highlighting
+ * to Python code blocks using the lezer Python parser and classHighlighter.
+ * The tok-* CSS classes are defined in documentation.css.
+ */
+export function createLspMarkdownRenderer(): (markdown: string) => string {
+  const renderer = new marked.Renderer();
+  const prevCode = renderer.code.bind(renderer);
+
+  renderer.code = (token) => {
+    const { text, lang } = token;
+    if (!text.trim()) {
+      return "";
+    }
+    if (lang === "python" || lang === "py") {
+      const highlighted = highlightPython(text);
+      return `<pre><code class="language-python">${highlighted}</code></pre>\n`;
+    }
+    return prevCode(token);
+  };
+
+  return (markdown: string): string =>
+    marked(markdown, {
+      async: false,
+      gfm: true,
+      breaks: true,
+      renderer,
+    }) as string;
+}

package/src/core/datasets/data-source-connections.ts

@@ -169,6 +169,7 @@ const {
         return {
           ...db,
           schemas: schemas,
+          schemas_resolved: true,
         };
       }),
     };
@@ -213,6 +214,7 @@ const {
             return {
               ...schema,
               tables: tables,
+              tables_resolved: true,
             };
           }),
         };

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

@@ -0,0 +1,30 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { toast } from "@/components/ui/use-toast";
+import { createStaticRequests } from "../requests-static";
+
+vi.mock("@/components/ui/use-toast", () => ({ toast: vi.fn() }));
+
+describe("createStaticRequests static-notebook toast", () => {
+  beforeEach(() => {
+    vi.mocked(toast).mockClear();
+  });
+
+  it("requests a once-toast with a stable id on component value updates", async () => {
+    const requests = createStaticRequests();
+    await requests.sendComponentValues({} as never);
+
+    expect(toast).toHaveBeenCalledWith(
+      expect.objectContaining({ id: "static-notebook", once: true }),
+    );
+  });
+
+  it("uses the same once-toast for function requests", async () => {
+    const requests = createStaticRequests();
+    await requests.sendFunctionRequest({} as never);
+
+    expect(toast).toHaveBeenCalledWith(
+      expect.objectContaining({ id: "static-notebook", once: true }),
+    );
+  });
+});

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

@@ -3,6 +3,18 @@ import { toast } from "@/components/ui/use-toast";
 import { Logger } from "@/utils/Logger";
 import type { EditRequests, RunRequests } from "./types";
 
+const STATIC_NOTEBOOK_TOAST_ID = "static-notebook";
+
+function showStaticNotebookToast() {
+  toast({
+    id: STATIC_NOTEBOOK_TOAST_ID,
+    once: true,
+    title: "Static notebook",
+    description:
+      "This notebook is not connected to a kernel. Any interactive elements will not work.",
+  });
+}
+
 export function createStaticRequests(): EditRequests & RunRequests {
   const throwNotInEditMode = () => {
     throw new Error("Unreachable. Expected to be in run mode");
@@ -10,11 +22,7 @@ export function createStaticRequests(): EditRequests & RunRequests {
 
   return {
     sendComponentValues: async () => {
-      toast({
-        title: "Static notebook",
-        description:
-          "This notebook is not connected to a kernel. Any interactive elements will not work.",
-      });
+      showStaticNotebookToast();
       Logger.log("Updating UI elements is not supported in static mode");
       return null;
     },
@@ -27,11 +35,7 @@ export function createStaticRequests(): EditRequests & RunRequests {
       return null;
     },
     sendFunctionRequest: async () => {
-      toast({
-        title: "Static notebook",
-        description:
-          "This notebook is not connected to a kernel. Any interactive elements will not work.",
-      });
+      showStaticNotebookToast();
       Logger.log("Function requests are not supported in static mode");
       return null;
     },

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

@@ -48,6 +48,7 @@ describe("storage state", () => {
       expect(state).toEqual({
         namespaces: [],
         entriesByPath: new Map(),
+        pageMetadataByPath: new Map(),
       });
     });
   });
@@ -134,6 +135,49 @@ describe("storage state", () => {
       expect(state.entriesByPath.get("my_s3::data/")).toEqual(entries);
     });
 
+    it("should store next page tokens keyed by namespace and prefix", () => {
+      const entries = [makeEntry({ path: "a.txt" })];
+
+      actions.setEntries({
+        namespace: "my_s3",
+        prefix: "data/",
+        entries,
+        nextPageToken: "150",
+      });
+
+      expect(state.entriesByPath.get("my_s3::data/")).toEqual(entries);
+      expect(state.pageMetadataByPath.get("my_s3::data/")?.nextPageToken).toBe(
+        "150",
+      );
+    });
+
+    it("should append entries when requested", () => {
+      const firstPage = [makeEntry({ path: "a.txt" })];
+      const secondPage = [makeEntry({ path: "b.txt" })];
+
+      actions.setEntries({
+        namespace: "my_s3",
+        prefix: "data/",
+        entries: firstPage,
+        nextPageToken: "150",
+      });
+      actions.setEntries({
+        namespace: "my_s3",
+        prefix: "data/",
+        entries: secondPage,
+        nextPageToken: null,
+        append: true,
+      });
+
+      expect(state.entriesByPath.get("my_s3::data/")).toEqual([
+        ...firstPage,
+        ...secondPage,
+      ]);
+      expect(
+        state.pageMetadataByPath.get("my_s3::data/")?.nextPageToken,
+      ).toBeNull();
+    });
+
     it("should use empty string for null prefix", () => {
       const entries = [makeEntry({ path: "root.txt" })];
 
@@ -251,6 +295,11 @@ describe("storage state", () => {
       expect(state.entriesByPath.get("my_s3::")).toBeUndefined();
       expect(state.entriesByPath.get("my_s3::data/")).toBeUndefined();
       expect(state.entriesByPath.get("my_s3::data/nested/")).toBeUndefined();
+      expect(state.pageMetadataByPath.get("my_s3::")).toBeUndefined();
+      expect(state.pageMetadataByPath.get("my_s3::data/")).toBeUndefined();
+      expect(
+        state.pageMetadataByPath.get("my_s3::data/nested/"),
+      ).toBeUndefined();
     });
 
     it("should not affect entries from other namespaces", () => {