@marimo-team/islands 0.23.1 → 0.23.2-dev10

package/package.json

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

package/src/components/editor/Output.tsx

@@ -263,7 +263,7 @@ const MimeBundleOutputRenderer: React.FC<{
   const { mode } = useAtomValue(viewStateAtom);
   const appView = mode === "present" || mode === "read";
 
-  // Extract metadata if present (e.g., for retina image rendering)
+  // Extract metadata if present (e.g., to maintain a constant display size regardless of DPI/PPI)
   const metadata = mimebundle[METADATA_KEY];
 
   // Filter out metadata from the mime entries and type narrow

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

@@ -36,7 +36,7 @@ import { FederatedLanguageServerClient } from "../../lsp/federated-lsp";
 import { NotebookLanguageServerClient } from "../../lsp/notebook-lsp";
 import { createTransport } from "../../lsp/transports";
 import { CellDocumentUri, type ILanguageServerClient } from "../../lsp/types";
-import { getLSPDocumentRootUri } from "../../lsp/utils";
+import { getLspRootUri, getLspWorkspaceFolders } from "../../lsp/utils";
 import {
   clickablePlaceholderExtension,
   smartPlaceholderExtension,
@@ -54,8 +54,8 @@ const pylspClient = once((lspConfig: LSPConfig) => {
 
   const lspClientOpts = {
     transport,
-    rootUri: getLSPDocumentRootUri(),
-    workspaceFolders: [],
+    rootUri: getLspRootUri(),
+    workspaceFolders: getLspWorkspaceFolders(),
   };
   const config = lspConfig?.pylsp;
 
@@ -161,8 +161,8 @@ const tyLspClient = once((_: LSPConfig) => {
 
   const lspClientOpts = {
     transport,
-    rootUri: getLSPDocumentRootUri(),
-    workspaceFolders: [],
+    rootUri: getLspRootUri(),
+    workspaceFolders: getLspWorkspaceFolders(),
   };
 
   // We wrap the client in a NotebookLanguageServerClient to add some
@@ -192,8 +192,8 @@ const pyreflyClient = once(
 
     const lspClientOpts = {
       transport,
-      rootUri: getLSPDocumentRootUri(),
-      workspaceFolders: [],
+      rootUri: getLspRootUri(),
+      workspaceFolders: getLspWorkspaceFolders(),
     };
 
     // We wrap the client in a NotebookLanguageServerClient to add some
@@ -230,8 +230,8 @@ const pyrightClient = once((_: LSPConfig) => {
 
   const lspClientOpts = {
     transport,
-    rootUri: getLSPDocumentRootUri(),
-    workspaceFolders: [],
+    rootUri: getLspRootUri(),
+    workspaceFolders: getLspWorkspaceFolders(),
   };
 
   // We wrap the client in a NotebookLanguageServerClient to add some

package/src/core/codemirror/lsp/__tests__/notebook-lsp.test.ts

@@ -12,6 +12,7 @@ import { cellId } from "@/__tests__/branded";
 import type { CellId } from "@/core/cells/ids";
 import { store } from "@/core/state/jotai";
 import { topologicalCodesAtom } from "../../copilot/getCodes";
+import { lspWorkspaceAtom } from "@/core/saving/file-state";
 import { languageAdapterState } from "../../language/extension";
 import { PythonLanguageAdapter } from "../../language/languages/python";
 import { languageMetadataField } from "../../language/metadata";
@@ -285,6 +286,12 @@ describe("NotebookLanguageServerClient", () => {
           },
         };
       }
+      if (atom === lspWorkspaceAtom) {
+        return {
+          rootUri: "file:///project",
+          documentUri: "file:///project/__marimo_notebook__.py",
+        };
+      }
       return undefined;
     });
 
@@ -421,7 +428,7 @@ describe("NotebookLanguageServerClient", () => {
       expect(result).toEqual(mockCompletionResponse);
       expect(mockClient.textDocumentCompletion).toHaveBeenCalledWith(
         expect.objectContaining({
-          textDocument: { uri: "file:///__marimo_notebook__.py" },
+          textDocument: { uri: "file:///project/__marimo_notebook__.py" },
         }),
       );
     });

package/src/core/codemirror/lsp/federated-lsp.ts

@@ -3,7 +3,7 @@
 import type * as LSP from "vscode-languageserver-protocol";
 import { Objects } from "@/utils/objects";
 import type { ILanguageServerClient } from "./types";
-import { getLSPDocument } from "./utils";
+import { getLspDocumentUri } from "./utils";
 
 function removeFalseyValues<T extends object>(obj: T): T {
   return Objects.filter(obj, (value) => value !== false && value !== null) as T;
@@ -20,7 +20,7 @@ export class FederatedLanguageServerClient implements ILanguageServerClient {
 
   constructor(clients: ILanguageServerClient[]) {
     this.clients = clients;
-    this.documentUri = getLSPDocument();
+    this.documentUri = getLspDocumentUri();
   }
 
   onNotification(

package/src/core/codemirror/lsp/notebook-lsp.ts

@@ -22,7 +22,7 @@ import {
   type ILanguageServerClient,
   isClientWithNotify,
 } from "./types";
-import { getLSPDocument } from "./utils";
+import { getLspDocumentUri } from "./utils";
 
 /**
  * Check if a variable name is private (starts with underscore but not dunder).
@@ -189,7 +189,7 @@ export class NotebookLanguageServerClient implements ILanguageServerClient {
       EditorView | null | undefined
     > = defaultGetNotebookEditors,
   ) {
-    this.documentUri = getLSPDocument();
+    this.documentUri = getLspDocumentUri();
     this.getNotebookEditors = getNotebookEditors;
     this.initialSettings = initialSettings;
     this.client = client;

package/src/core/codemirror/lsp/utils.ts

@@ -1,11 +1,26 @@
 /* Copyright 2026 Marimo. All rights reserved. */
-import { getFilenameFromDOM } from "@/core/dom/htmlUtils";
-import { Paths } from "@/utils/paths";
+import { lspWorkspaceAtom } from "@/core/saving/file-state";
+import { store } from "@/core/state/jotai";
 
-export function getLSPDocument() {
-  return `file://${getFilenameFromDOM() ?? "/__marimo_notebook__.py"}`;
+export function getLspRootUri() {
+  const lspWorkspace = store.get(lspWorkspaceAtom);
+  // The backend provides rootUri for active notebook sessions.
+  // For non-notebook pages (home, gallery), lspWorkspace is null,
+  // so return a valid file URI fallback.
+  return lspWorkspace?.rootUri ?? "file:///";
 }
 
-export function getLSPDocumentRootUri() {
-  return `file://${Paths.dirname(getFilenameFromDOM() ?? "/")}`;
+export function getLspWorkspaceFolders() {
+  const lspWorkspace = store.get(lspWorkspaceAtom);
+  const rootUri = lspWorkspace?.rootUri;
+  // Return workspace folders only if rootUri is set; empty array otherwise.
+  return rootUri ? [{ uri: rootUri, name: "marimo" }] : [];
+}
+
+export function getLspDocumentUri() {
+  const lspWorkspace = store.get(lspWorkspaceAtom);
+  // The backend provides documentUri for active notebook sessions.
+  // For non-notebook pages (home, gallery), lspWorkspace is null,
+  // so return a valid file URI fallback.
+  return lspWorkspace?.documentUri ?? "file:///__marimo_notebook__.py";
 }

package/src/plugins/impl/plotly/__tests__/PlotlyPlugin.test.tsx

@@ -112,6 +112,56 @@ describe("PlotlyPlugin", () => {
     });
   });
 
+  it("clicking a box element triggers onClick", async () => {
+    const setValue = vi.fn<Setter<unknown>>();
+
+    render(
+      <Suspense fallback={null}>
+        <PlotlyComponent
+          figure={{
+            data: [{ type: "box" }],
+            layout: {},
+            frames: null,
+          }}
+          value={undefined}
+          setValue={setValue}
+          host={document.createElement("div")}
+          config={{}}
+        />
+      </Suspense>,
+    );
+
+    await waitFor(() => {
+      expect(capturedPlotProps).not.toBeNull();
+    });
+
+    act(() => {
+      capturedPlotProps?.onClick?.({
+        points: [
+          {
+            data: { type: "box" },
+            x: "Group A",
+            y: 3,
+            pointIndex: 0,
+            pointNumber: 0,
+            curveNumber: 0,
+          },
+        ],
+      });
+    });
+
+    expect(setValue).toHaveBeenCalledTimes(1);
+    const updater = setValue.mock.calls[0][0] as (value: unknown) => unknown;
+    expect(updater({})).toEqual({
+      selections: [],
+      points: [
+        { x: "Group A", y: 3, curveNumber: 0, pointNumber: 0, pointIndex: 0 },
+      ],
+      indices: [0],
+      range: undefined,
+    });
+  });
+
   it("clicking a violin element triggers onClick", async () => {
     const setValue = vi.fn<Setter<unknown>>();
 

package/src/plugins/impl/plotly/__tests__/selection.test.ts

@@ -102,6 +102,14 @@ describe("shouldHandleClickSelection", () => {
     expect(shouldHandleClickSelection([heatmapPoint])).toBe(true);
   });
 
+  it("accepts box clicks", () => {
+    const boxPoint = createPlotDatum({
+      data: { type: "box" },
+    });
+
+    expect(shouldHandleClickSelection([boxPoint])).toBe(true);
+  });
+
   it("accepts violin clicks", () => {
     const violinPoint = createPlotDatum({
       data: { type: "violin" },
@@ -126,6 +134,22 @@ describe("shouldHandleClickSelection", () => {
     expect(shouldHandleClickSelection([linePoint])).toBe(true);
   });
 
+  it("accepts funnel clicks", () => {
+    const funnelPoint = createPlotDatum({
+      data: { type: "funnel" },
+    });
+
+    expect(shouldHandleClickSelection([funnelPoint])).toBe(true);
+  });
+
+  it("accepts funnelarea clicks", () => {
+    const funnelAreaPoint = createPlotDatum({
+      data: { type: "funnelarea" },
+    });
+
+    expect(shouldHandleClickSelection([funnelAreaPoint])).toBe(true);
+  });
+
   it("accepts waterfall clicks", () => {
     const waterfallPoint = createPlotDatum({
       data: { type: "waterfall" },
@@ -214,6 +238,64 @@ describe("extractPoints", () => {
     expect(extractPoints([point])).toEqual([{ x: 1, y: 2, z: 3 }]);
   });
 
+  it("returns funnel-specific fields for funnel traces", () => {
+    const point = createPlotDatum({
+      x: 1000,
+      y: "Visit",
+      label: "Visit",
+      value: 1000,
+      percentInitial: 1.0,
+      percentPrevious: 1.0,
+      percentTotal: 1.0,
+      curveNumber: 0,
+      pointIndex: 0,
+      pointNumber: 0,
+      data: { type: "funnel" },
+    });
+
+    expect(extractPoints([point])).toEqual([
+      {
+        x: 1000,
+        y: "Visit",
+        label: "Visit",
+        value: 1000,
+        percentInitial: 1.0,
+        percentPrevious: 1.0,
+        percentTotal: 1.0,
+        curveNumber: 0,
+        pointIndex: 0,
+        pointNumber: 0,
+      },
+    ]);
+  });
+
+  it("returns funnelarea-specific fields without x/y for funnelarea traces", () => {
+    const point = createPlotDatum({
+      label: "Stage A",
+      value: 500,
+      percentInitial: 0.5,
+      percentPrevious: 0.8,
+      percentTotal: 0.5,
+      curveNumber: 0,
+      pointNumber: 1,
+      x: 99,
+      y: 99,
+      data: { type: "funnelarea" },
+    });
+
+    expect(extractPoints([point])).toEqual([
+      {
+        label: "Stage A",
+        value: 500,
+        percentInitial: 0.5,
+        percentPrevious: 0.8,
+        percentTotal: 0.5,
+        curveNumber: 0,
+        pointNumber: 1,
+      },
+    ]);
+  });
+
   it("returns x/y/pointIndex for waterfall clicks", () => {
     const point = createPlotDatum({
       x: "Revenue",

package/src/plugins/impl/plotly/selection.ts

@@ -24,6 +24,32 @@ const SUNBURST_DATA_KEYS: (keyof Plotly.SunburstPlotDatum)[] = [
   "value",
 ] as const;
 
+// Fields emitted by go.Funnel click events: includes x/y coordinates plus
+// funnel-specific percent metrics.
+const FUNNEL_DATA_KEYS: string[] = [
+  "curveNumber",
+  "pointIndex",
+  "pointNumber",
+  "x",
+  "y",
+  "label",
+  "value",
+  "percentInitial",
+  "percentPrevious",
+  "percentTotal",
+] as const;
+
+// Fields emitted by go.FunnelArea click events: sector-based, no x/y.
+const FUNNEL_AREA_DATA_KEYS: string[] = [
+  "curveNumber",
+  "pointNumber",
+  "label",
+  "value",
+  "percentInitial",
+  "percentPrevious",
+  "percentTotal",
+] as const;
+
 const LINE_CLICK_TRACE_TYPES = new Set(["scatter", "scattergl"]);
 
 const STANDARD_POINT_KEYS: string[] = [
@@ -256,10 +282,13 @@ export function shouldHandleClickSelection(
     const type = getTraceSource(point).type;
     return (
       type === "bar" ||
+      type === "box" ||
+      type === "funnel" ||
+      type === "funnelarea" ||
       type === "heatmap" ||
       type === "histogram" ||
-      type === "waterfall" ||
       type === "violin" ||
+      type === "waterfall" ||
       isLinePoint(point)
     );
   });
@@ -329,13 +358,43 @@ export function extractPoints(
   let parser: PlotlyTemplateParser | undefined;
 
   return points.map((point) => {
+    const trace = getTraceSource(point);
+
+    // FunnelArea: sector-based chart with no x/y coordinates.
+    // Pick funnel-area-specific keys, then merge any hovertemplate-parsed
+    // fields (e.g. customdata columns) so user-defined fields are preserved.
+    if (trace.type === "funnelarea") {
+      const base = pick(point, FUNNEL_AREA_DATA_KEYS);
+      const ht = Array.isArray(trace.hovertemplate)
+        ? trace.hovertemplate[0]
+        : trace.hovertemplate;
+      if (!ht) {
+        return base;
+      }
+      parser = parser ? parser.update(ht) : createParser(ht);
+      return { ...base, ...parser.parse(point) };
+    }
+
+    // Funnel: bar-like chart with x/y plus per-stage percent metrics.
+    // Pick funnel-specific keys, then merge hovertemplate-parsed fields so
+    // callers get both percentInitial et al. and any user-defined columns.
+    if (trace.type === "funnel") {
+      const base = pick(point, FUNNEL_DATA_KEYS);
+      const ht = Array.isArray(trace.hovertemplate)
+        ? trace.hovertemplate[0]
+        : trace.hovertemplate;
+      if (!ht) {
+        return base;
+      }
+      parser = parser ? parser.update(ht) : createParser(ht);
+      return { ...base, ...parser.parse(point) };
+    }
+
     const standardPointFields = withInferredXY(
       point,
       pick(point, STANDARD_POINT_KEYS),
     );
 
-    const trace = getTraceSource(point);
-
     // Get the first hovertemplate
     const hovertemplate = Array.isArray(trace.hovertemplate)
       ? trace.hovertemplate[0]