@marimo-team/islands 0.16.4 → 0.17.0

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

@@ -18,8 +18,14 @@ import {
 } from "@marimo-team/codemirror-sql";
 import { DuckDBDialect } from "@marimo-team/codemirror-sql/dialects";
 import dedent from "string-dedent";
+import type { CellId } from "@/core/cells/ids";
 import { cellIdState } from "@/core/codemirror/cells/state";
-import { getFeatureFlag } from "@/core/config/feature-flag";
+import type { PlaceholderType } from "@/core/codemirror/config/types";
+import type {
+  CompletionConfig,
+  DiagnosticsConfig,
+  LSPConfig,
+} from "@/core/config/config-schema";
 import {
   dataSourceConnectionsAtom,
   setLatestEngineSelected,
@@ -30,6 +36,7 @@ import {
   INTERNAL_SQL_ENGINES,
 } from "@/core/datasets/engines";
 import { ValidateSQL } from "@/core/datasets/request-registry";
+import type { HotkeyProvider } from "@/core/hotkeys/hotkeys";
 import type { ValidateSQLResult } from "@/core/kernel/messages";
 import { store } from "@/core/state/jotai";
 import { resolvedThemeAtom } from "@/theme/useTheme";
@@ -77,17 +84,10 @@ export class SQLLanguageAdapter
   implements LanguageAdapter<SQLLanguageAdapterMetadata>
 {
   readonly type = "sql";
-  sqlLinterEnabled: boolean;
   sqlModeEnabled: boolean;
 
   constructor() {
-    try {
-      this.sqlLinterEnabled = getFeatureFlag("sql_linter");
-      this.sqlModeEnabled = getFeatureFlag("sql_mode");
-    } catch {
-      this.sqlLinterEnabled = false;
-      this.sqlModeEnabled = false;
-    }
+    this.sqlModeEnabled = true;
   }
 
   get defaultMetadata(): SQLLanguageAdapterMetadata {
@@ -215,7 +215,13 @@ export class SQLLanguageAdapter
     return commentLines;
   }
 
-  getExtension(): Extension[] {
+  getExtension(
+    _cellId: CellId,
+    _completionConfig: CompletionConfig,
+    _hotkeys: HotkeyProvider,
+    _placeholderType: PlaceholderType,
+    lspConfig: LSPConfig & { diagnostics: DiagnosticsConfig },
+  ): Extension[] {
     const extensions = [
       // This can be updated with a dispatch effect
       sqlConfigCompartment.of(sql({ dialect: DEFAULT_DIALECT })),
@@ -245,7 +251,9 @@ export class SQLLanguageAdapter
       }),
     ];
 
-    if (this.sqlLinterEnabled) {
+    const sqlLinterEnabled = lspConfig?.diagnostics?.sql_linter ?? false;
+
+    if (sqlLinterEnabled) {
       const theme = store.get(resolvedThemeAtom);
       const parser = new CustomSqlParser({
         getParserOptions: (state: EditorState) => {
@@ -666,8 +674,10 @@ function sqlValidationExtension(): Extension {
   let lastValidationRequest: string | null = null;
 
   return EditorView.updateListener.of((update) => {
-    // Only run validation if the document has changed and editor is focused
-    if (!update.docChanged || !update.view.hasFocus) {
+    // Only run validation if the document has changed
+    // The extension only runs on keypress, so we don't need to check for focus
+    // This lets AI completions / external calls trigger validation
+    if (!update.docChanged) {
       return;
     }
 

package/src/core/codemirror/language/panel/panel.tsx

@@ -5,7 +5,6 @@ import { Button } from "@/components/ui/button";
 import { Checkbox } from "@/components/ui/checkbox";
 import { Tooltip, TooltipProvider } from "@/components/ui/tooltip";
 import { normalizeName } from "@/core/cells/names";
-import { getFeatureFlag } from "@/core/config/feature-flag";
 import { type ConnectionName, DUCKDB_ENGINE } from "@/core/datasets/engines";
 import { useAutoGrowInputProps } from "@/hooks/useAutoGrowInputProps";
 import { formatSQL } from "../../format";
@@ -71,8 +70,6 @@ export const LanguagePanelComponent: React.FC<{
       updateSQLDialectFromConnection(view, engine);
     };
 
-    const sqlModeEnabled = getFeatureFlag("sql_mode");
-
     actions = (
       <div className="flex flex-1 gap-2 items-center">
         <label className="flex gap-2 items-center">
@@ -98,9 +95,7 @@ export const LanguagePanelComponent: React.FC<{
           onChange={switchEngine}
         />
         <div className="flex items-center gap-2 ml-auto">
-          {sqlModeEnabled && metadata.engine === DUCKDB_ENGINE && (
-            <SQLModeSelect />
-          )}
+          {metadata.engine === DUCKDB_ENGINE && <SQLModeSelect />}
           <Tooltip content="Format SQL">
             <Button
               variant="text"

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

@@ -2,6 +2,7 @@
 
 import type { EditorState } from "@codemirror/state";
 import type { EditorView } from "@codemirror/view";
+import { replaceEditorContent } from "../replace-editor-content";
 import { languageAdapterState } from "./extension";
 import { languageMetadataField } from "./metadata";
 
@@ -36,14 +37,8 @@ export function updateEditorCodeFromPython(
 ): string {
   const languageAdapter = editor.state.field(languageAdapterState);
   const [code] = languageAdapter.transformIn(pythonCode);
-  const doc = editor.state.doc;
-  // Noop if the code is the same
-  if (doc.toString() === code) {
-    return code;
-  }
-  editor.dispatch({
-    changes: { from: 0, to: doc.length, insert: code },
-  });
+  // Use replaceEditorContent which preserves cursor position when focused
+  replaceEditorContent(editor, code);
   return code;
 }
 

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

@@ -195,35 +195,36 @@ describe("createNotebookLens", () => {
 });
 
 describe("NotebookLanguageServerClient", () => {
-  let plugins: any[] = [];
   let mockClient: Mocked<ILanguageServerClient>;
   let notebookClient: NotebookLanguageServerClient;
 
   beforeEach(() => {
-    plugins = [];
     mockClient = {
-      plugins,
       ready: true,
       capabilities: {},
       initializePromise: Promise.resolve(),
+      clientCapabilities: {},
+      completionItemResolve: vi.fn(),
       initialize: vi.fn(),
       close: vi.fn(),
-      detachPlugin: vi.fn().mockImplementation((plugin) => {
-        plugins = plugins.filter((p) => p !== plugin);
-      }),
-      attachPlugin: vi.fn().mockImplementation((plugin) => {
-        plugins.push(plugin);
-      }),
+      onNotification: vi.fn(),
       textDocumentDidOpen: vi.fn(),
       textDocumentDidChange: vi.fn(),
       textDocumentHover: vi.fn(),
       textDocumentCompletion: vi.fn(),
+      textDocumentDefinition: vi.fn(),
+      textDocumentPrepareRename: vi.fn(),
+      textDocumentCodeAction: vi.fn(),
+      textDocumentSignatureHelp: vi.fn(),
       textDocumentRename: vi.fn(),
-      processNotification: vi.fn(),
-      notify: vi.fn(),
-      request: vi.fn(),
-    } as unknown as Mocked<ILanguageServerClient>;
-    notebookClient = new NotebookLanguageServerClient(mockClient, {});
+    };
+    (mockClient as any).processNotification = vi.fn();
+    (mockClient as any).notify = vi.fn();
+    notebookClient = new NotebookLanguageServerClient(mockClient, {}, () => ({
+      [Cells.cell1]: new EditorView({ doc: "# this is a comment" }),
+      [Cells.cell2]: new EditorView({ doc: "import math\nimport numpy" }),
+      [Cells.cell3]: new EditorView({ doc: "print(math.sqrt(4))" }),
+    }));
 
     // Mock the atom instead of the instance method
     vi.spyOn(store, "get").mockImplementation((atom) => {
@@ -404,6 +405,12 @@ describe("NotebookLanguageServerClient", () => {
       });
       expect(mockView3.state.doc.toString()).toBe("print(math.sqrt(4))");
 
+      (notebookClient as any).getNotebookEditors = () => ({
+        [Cells.cell1]: mockView1,
+        [Cells.cell2]: mockView2,
+        [Cells.cell3]: mockView3,
+      });
+
       // Setup rename params
       const renameParams: LSP.RenameParams = {
         textDocument: { uri: CellDocumentUri.of(Cells.cell2) },

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

@@ -1,6 +1,5 @@
 /* Copyright 2024 Marimo. All rights reserved. */
 
-import type { LanguageServerPlugin } from "@marimo-team/codemirror-languageserver";
 import type * as LSP from "vscode-languageserver-protocol";
 import { Objects } from "@/utils/objects";
 import type { ILanguageServerClient } from "./types";
@@ -24,6 +23,26 @@ export class FederatedLanguageServerClient implements ILanguageServerClient {
     this.documentUri = getLSPDocument();
   }
 
+  onNotification(
+    listener: (n: {
+      jsonrpc: "2.0";
+      id?: null | undefined;
+      method: "textDocument/publishDiagnostics";
+      params: LSP.PublishDiagnosticsParams;
+    }) => void,
+  ): () => boolean {
+    const callbacks: Array<() => boolean> = [];
+    for (const client of this.clients) {
+      callbacks.push(client.onNotification(listener));
+    }
+    return () => {
+      for (const cb of callbacks) {
+        cb();
+      }
+      return true;
+    };
+  }
+
   get clientCapabilities(): LSP.ClientCapabilities | undefined {
     const capabilities = this.clients
       .map((client) => {
@@ -153,14 +172,6 @@ export class FederatedLanguageServerClient implements ILanguageServerClient {
     return null;
   }
 
-  attachPlugin(plugin: LanguageServerPlugin): void {
-    this.clients.forEach((client) => client.attachPlugin(plugin));
-  }
-
-  detachPlugin(plugin: LanguageServerPlugin): void {
-    this.clients.forEach((client) => client.detachPlugin(plugin));
-  }
-
   // Merge completions from all clients
   async textDocumentCompletion(
     params: LSP.CompletionParams,

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

@@ -1,18 +1,20 @@
 /* Copyright 2024 Marimo. All rights reserved. */
 
+import type { EditorView } from "@codemirror/view";
 import type * as LSP from "vscode-languageserver-protocol";
+import { getNotebook } from "@/core/cells/cells";
 import type { CellId } from "@/core/cells/ids";
 import { store } from "@/core/state/jotai";
 import { invariant } from "@/utils/invariant";
 import { Logger } from "@/utils/Logger";
 import { LRUCache } from "@/utils/lru";
+import { Objects } from "@/utils/objects";
 import { topologicalCodesAtom } from "../copilot/getCodes";
 import { createNotebookLens, type NotebookLens } from "./lens";
 import {
   CellDocumentUri,
   type ILanguageServerClient,
   isClientWithNotify,
-  isClientWithPlugins,
 } from "./types";
 import { getLSPDocument } from "./utils";
 
@@ -84,18 +86,32 @@ class Snapshotter {
   }
 }
 
+const defaultGetNotebookEditors = () => {
+  const evs = getNotebook().cellHandles;
+  return Objects.mapValues(evs, (r) => r.current?.editorViewOrNull);
+};
+
 export class NotebookLanguageServerClient implements ILanguageServerClient {
   public readonly documentUri: LSP.DocumentUri;
   private readonly client: ILanguageServerClient;
   private readonly snapshotter: Snapshotter;
+  private readonly getNotebookEditors: () => Record<
+    CellId,
+    EditorView | null | undefined
+  >;
 
   private static readonly SEEN_CELL_DOCUMENT_URIS = new Set<CellDocumentUri>();
 
   constructor(
     client: ILanguageServerClient,
     initialSettings: Record<string, unknown>,
+    getNotebookEditors: () => Record<
+      CellId,
+      EditorView | null | undefined
+    > = defaultGetNotebookEditors,
   ) {
     this.documentUri = getLSPDocument();
+    this.getNotebookEditors = getNotebookEditors;
 
     this.client = client;
     this.patchProcessNotification();
@@ -114,6 +130,17 @@ export class NotebookLanguageServerClient implements ILanguageServerClient {
     this.snapshotter = new Snapshotter(this.getNotebookCode.bind(this));
   }
 
+  onNotification(
+    listener: (n: {
+      jsonrpc: "2.0";
+      id?: null | undefined;
+      method: "textDocument/publishDiagnostics";
+      params: LSP.PublishDiagnosticsParams;
+    }) => void,
+  ): () => boolean {
+    return this.client.onNotification(listener);
+  }
+
   get ready(): boolean {
     return this.client.ready;
   }
@@ -150,16 +177,6 @@ export class NotebookLanguageServerClient implements ILanguageServerClient {
     this.client.close();
   }
 
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  detachPlugin(plugin: any): void {
-    this.client.detachPlugin(plugin);
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  attachPlugin(plugin: any): void {
-    this.client.attachPlugin(plugin);
-  }
-
   private getNotebookCode() {
     return store.get(topologicalCodesAtom);
   }
@@ -371,37 +388,26 @@ export class NotebookLanguageServerClient implements ILanguageServerClient {
     const newEdits = lens.getEditsForNewText(edit.newText);
     const editsToNewCode = new Map(newEdits.map((e) => [e.cellId, e.text]));
 
-    invariant(
-      isClientWithPlugins(this.client),
-      "Expected client with plugins.",
-    );
-
     // Update the code in the plugins manually
-    for (const plugin of this.client.plugins) {
-      const documentUri: string = plugin.documentUri;
-      if (!CellDocumentUri.is(documentUri)) {
-        Logger.warn("Invalid cell document URI", documentUri);
-        continue;
-      }
-
-      const cellId = CellDocumentUri.parse(documentUri);
+    const editors = this.getNotebookEditors();
+    for (const [cellId, ev] of Objects.entries(editors)) {
       const newCode = editsToNewCode.get(cellId);
       if (newCode == null) {
         Logger.warn("No new code for cell", cellId);
         continue;
       }
 
-      if (!plugin.view) {
-        Logger.warn("No view for plugin", plugin);
+      if (!ev) {
+        Logger.warn("No view for plugin", cellId);
         continue;
       }
 
       // Only update if it has changed
-      if (plugin.view.state.doc.toString() !== newCode) {
-        plugin.view.dispatch({
+      if (ev.state.doc.toString() !== newCode) {
+        ev.dispatch({
           changes: {
             from: 0,
-            to: plugin.view.state.doc.length,
+            to: ev.state.doc.length,
             insert: newCode,
           },
         });

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

@@ -1,6 +1,5 @@
 /* Copyright 2024 Marimo. All rights reserved. */
 
-import type { EditorView } from "@codemirror/view";
 import type { LanguageServerClient } from "@marimo-team/codemirror-languageserver";
 import type { DocumentUri } from "vscode-languageserver-protocol";
 import type { CellId } from "@/core/cells/ids";
@@ -41,15 +40,3 @@ export function isClientWithNotify(
 } {
   return "notify" in client;
 }
-
-/**
- * Plugins are a @private on `LanguageServerClient`,
- * hiding public use with TypeScript.
- */
-export function isClientWithPlugins(
-  client: ILanguageServerClient,
-): client is ILanguageServerClient & {
-  plugins: { documentUri: string; view?: EditorView }[];
-} {
-  return "plugins" in client;
-}

package/src/core/codemirror/replace-editor-content.ts

@@ -0,0 +1,87 @@
+/* Copyright 2024 Marimo. All rights reserved. */
+
+import type { TransactionSpec } from "@codemirror/state";
+import type { EditorView } from "@codemirror/view";
+
+/**
+ * Replace the entire content of the editor with new content.
+ *
+ * When the editor has focus, this function attempts to preserve the cursor position
+ * by keeping it on the same line and column. If the line no longer exists or shrinks,
+ * the cursor is adjusted accordingly. This prevents the cursor from jumping during
+ * external updates (e.g., auto-formatting or external edits).
+ *
+ * When the editor doesn't have focus, the content is replaced without any special handling.
+ *
+ * @param editor - The CodeMirror editor view
+ * @param newContent - The new content to replace the editor with
+ * @param options - Optional configuration
+ * @param options.preserveCursor - Whether to preserve cursor position when focused (default: true)
+ * @param options.effects - Additional effects to apply to the transaction
+ * @param options.userEvent - User event string for the transaction
+ */
+export function replaceEditorContent(
+  editor: EditorView,
+  newContent: string,
+  options: {
+    preserveCursor?: boolean;
+    effects?: TransactionSpec["effects"];
+    userEvent?: string;
+  } = {},
+): void {
+  const { preserveCursor = true, effects, userEvent } = options;
+  const doc = editor.state.doc;
+  const currentContent = doc.toString();
+
+  // Noop if content is the same
+  if (currentContent === newContent) {
+    return;
+  }
+
+  // If editor has focus and we want to preserve cursor, try to maintain position
+  if (preserveCursor && editor.hasFocus) {
+    const cursorPos = editor.state.selection.main.head;
+
+    // Get the current line and column
+    const currentLine = doc.lineAt(cursorPos);
+    const lineNumber = currentLine.number; // 1-based line number
+    const columnInLine = cursorPos - currentLine.from; // 0-based column in line
+
+    // Calculate new cursor position based on line-aware logic
+    const newDoc = editor.state.update({
+      changes: { from: 0, to: doc.length, insert: newContent },
+    }).state.doc;
+
+    let newCursorPos: number;
+
+    if (lineNumber <= newDoc.lines) {
+      // Line still exists in new document
+      const newLine = newDoc.line(lineNumber);
+      const newLineLength = newLine.length;
+
+      // Keep same column, but clamp to line length if line shrank
+      newCursorPos = newLine.from + Math.min(columnInLine, newLineLength);
+    } else {
+      // Line no longer exists, move to the end of the last line
+      const lastLine = newDoc.line(newDoc.lines);
+      newCursorPos = lastLine.to;
+    }
+
+    // Apply changes with preserved cursor position
+    editor.dispatch({
+      changes: { from: 0, to: doc.length, insert: newContent },
+      selection: {
+        anchor: newCursorPos,
+      },
+      effects,
+      userEvent,
+    });
+  } else {
+    // Editor doesn't have focus or we don't want to preserve cursor
+    editor.dispatch({
+      changes: { from: 0, to: doc.length, insert: newContent },
+      effects,
+      userEvent,
+    });
+  }
+}

package/src/core/config/__tests__/config-schema.test.ts

@@ -45,6 +45,7 @@ test("default UserConfig - empty", () => {
   expect(defaultConfig).toMatchInlineSnapshot(`
     {
       "ai": {
+        "inline_tooltip": false,
         "mode": "manual",
         "models": {
           "custom_models": [],
@@ -56,6 +57,7 @@ test("default UserConfig - empty", () => {
         "activate_on_typing": true,
         "copilot": false,
       },
+      "diagnostics": {},
       "display": {
         "cell_output": "above",
         "code_editor_font_size": 14,
@@ -110,6 +112,7 @@ test("default UserConfig - one level", () => {
   expect(defaultConfig).toMatchInlineSnapshot(`
     {
       "ai": {
+        "inline_tooltip": false,
         "mode": "manual",
         "models": {
           "custom_models": [],
@@ -121,6 +124,7 @@ test("default UserConfig - one level", () => {
         "activate_on_typing": true,
         "copilot": false,
       },
+      "diagnostics": {},
       "display": {
         "cell_output": "above",
         "code_editor_font_size": 14,
@@ -170,6 +174,7 @@ test("default UserConfig - one level", () => {
       runtime: {},
       display: {},
       experimental: {},
+      diagnostics: {},
     }),
   ).toEqual(UserConfigSchema.parse({}));
 });

package/src/core/config/config-schema.ts

@@ -152,6 +152,7 @@ export const UserConfigSchema = z
       .looseObject({
         rules: z.string().prefault(""),
         mode: z.enum(["manual", "ask"]).prefault("manual"),
+        inline_tooltip: z.boolean().prefault(false),
         open_ai: AiConfigSchema.optional(),
         anthropic: AiConfigSchema.optional(),
         google: AiConfigSchema.optional(),
@@ -182,6 +183,12 @@ export const UserConfigSchema = z
       // Pass through so that we don't remove any extra keys that the user has added.
       .prefault(() => ({})),
     server: z.looseObject({}).prefault(() => ({})),
+    diagnostics: z
+      .looseObject({
+        enabled: z.boolean().optional(),
+        sql_linter: z.boolean().optional(),
+      })
+      .prefault(() => ({})),
     sharing: z
       .looseObject({
         html: z.boolean().optional(),
@@ -203,6 +210,7 @@ export const UserConfigSchema = z
     keymap: {},
     runtime: {},
     display: {},
+    diagnostics: {},
     experimental: {},
     server: {},
     ai: {},
@@ -216,6 +224,7 @@ export type KeymapConfig = UserConfig["keymap"];
 export type LSPConfig = UserConfig["language_servers"];
 export type DiagnosticsConfig = UserConfig["diagnostics"];
 export type DisplayConfig = UserConfig["display"];
+export type AiConfig = UserConfig["ai"];
 
 export const AppTitleSchema = z.string();
 export const SqlOutputSchema = z
@@ -305,6 +314,7 @@ export function defaultUserConfig(): UserConfig {
     keymap: {},
     runtime: {},
     display: {},
+    diagnostics: {},
     experimental: {},
     server: {},
     ai: {},

package/src/core/config/feature-flag.tsx

@@ -7,27 +7,23 @@ import { getResolvedMarimoConfig } from "./config";
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface ExperimentalFeatures {
   markdown: boolean; // Used in playground (community cloud)
-  inline_ai_tooltip: boolean;
   wasm_layouts: boolean; // Used in playground (community cloud)
   rtc_v2: boolean;
   performant_table_charts: boolean;
   chat_modes: boolean;
-  sql_linter: boolean;
+  cache_panel: boolean;
   external_agents: boolean;
-  sql_mode: boolean;
   // Add new feature flags here
 }
 
 const defaultValues: ExperimentalFeatures = {
   markdown: true,
-  inline_ai_tooltip: import.meta.env.DEV,
   wasm_layouts: false,
   rtc_v2: false,
   performant_table_charts: false,
   chat_modes: false,
-  sql_linter: true,
+  cache_panel: false,
   external_agents: import.meta.env.DEV,
-  sql_mode: false,
 };
 
 export function getFeatureFlag<T extends keyof ExperimentalFeatures>(

package/src/core/edit-app.tsx

@@ -15,7 +15,7 @@ import {
   useRunAllCells,
   useRunStaleCells,
 } from "../components/editor/cell/useRunCells";
-import { CellArray } from "../components/editor/renderers/CellArray";
+import { CellArray } from "../components/editor/renderers/cell-array";
 import { CellsRenderer } from "../components/editor/renderers/cells-renderer";
 import { useHotkey } from "../hooks/useHotkey";
 import {

package/src/core/errors/__tests__/errors.test.ts

@@ -57,6 +57,7 @@ describe("getAutoFixes", () => {
     expect(fixes).toHaveLength(1);
     expect(fixes[0].title).toBe("Fix with AI");
 
+    // No fixes without AI
     expect(getAutoFixes(error, { aiEnabled: false })).toHaveLength(0);
   });