@marimo-team/islands 0.23.11-dev3 → 0.23.11-dev30

package/src/components/datasources/column-preview.tsx

@@ -29,7 +29,7 @@ import { Button } from "../ui/button";
 import { Tooltip } from "../ui/tooltip";
 import { ColumnPreviewContainer } from "./components";
 import { InstallPackageButton } from "./install-package-button";
-import { convertStatsName, sqlCode } from "./utils";
+import { convertStatsName, sqlCode, tableUniqueId } from "./utils";
 
 export const DatasetColumnPreview: React.FC<{
   table: DataTable;
@@ -48,9 +48,7 @@ export const DatasetColumnPreview: React.FC<{
       tableName: table.name,
       columnName: column.name,
       sourceType: table.source_type,
-      fullyQualifiedTableName: sqlTableContext
-        ? `${sqlTableContext.database}.${sqlTableContext.schema}.${table.name}`
-        : table.name,
+      fullyQualifiedTableName: tableUniqueId(sqlTableContext, table.name),
     });
   };
 

package/src/components/datasources/datasources.tsx

@@ -83,6 +83,8 @@ import {
   areSchemasResolved,
   areTablesResolved,
   isSchemaless,
+  schemaSubtreeMatchesSearch,
+  shouldExpandDatabaseForSearch,
   sqlCode,
   tableUniqueId,
 } from "./utils";
@@ -360,7 +362,6 @@ export const DataSources: React.FC = () => {
                 key={database.name}
                 connection={connection}
                 database={database}
-                hasSearch={hasSearch}
                 searchValue={searchValue}
               />
             ))}
@@ -435,7 +436,6 @@ interface DataSourceTree {
   dialect: string;
   engineName: string;
   databaseName: string;
-  hasSearch: boolean;
   searchValue?: string;
 }
 
@@ -470,9 +470,8 @@ function buildSqlTableContext(
 const DatabaseTree: React.FC<{
   connection: DataSourceConnection;
   database: Database;
-  hasSearch: boolean;
   searchValue?: string;
-}> = ({ connection, database, hasSearch, searchValue }) => {
+}> = ({ connection, database, searchValue }) => {
   const tree = React.useMemo<DataSourceTree>(
     () => ({
       engineName: connection.name,
@@ -480,7 +479,6 @@ const DatabaseTree: React.FC<{
       dialect: connection.dialect,
       defaultSchema: connection.default_schema,
       defaultDatabase: connection.default_database,
-      hasSearch,
       searchValue,
     }),
     [
@@ -489,7 +487,6 @@ const DatabaseTree: React.FC<{
       connection.default_schema,
       connection.default_database,
       database.name,
-      hasSearch,
       searchValue,
     ],
   );
@@ -498,7 +495,7 @@ const DatabaseTree: React.FC<{
     <DatabaseItem
       engineName={connection.name}
       database={database}
-      hasSearch={hasSearch}
+      searchValue={searchValue}
     >
       <DataSourceTreeContext.Provider value={tree}>
         <SchemaList
@@ -513,18 +510,30 @@ const DatabaseTree: React.FC<{
 };
 
 const DatabaseItem: React.FC<{
-  hasSearch: boolean;
+  searchValue?: string;
   engineName: string;
   database: Database;
   children: React.ReactNode;
-}> = ({ hasSearch, engineName, database, children }) => {
-  const [isExpanded, setIsExpanded] = React.useState(false);
+}> = ({ searchValue, engineName, database, children }) => {
+  // Auto-expand during search only when a loaded schema under this database
+  // contains a matching table.
+  const expandForSearch = shouldExpandDatabaseForSearch(database, searchValue);
+  const [isExpanded, setIsExpanded] = React.useState(expandForSearch);
   const [isSelected, setIsSelected] = React.useState(false);
-  const [prevHasSearch, setPrevHasSearch] = React.useState(hasSearch);
-
-  if (prevHasSearch !== hasSearch) {
-    setPrevHasSearch(hasSearch);
-    setIsExpanded(hasSearch);
+  const [prevSearchValue, setPrevSearchValue] = React.useState(searchValue);
+  const [prevExpandForSearch, setPrevExpandForSearch] =
+    React.useState(expandForSearch);
+
+  // Re-sync when the query changes or when newly resolved data turns this
+  // branch into a match under the same query (deferred subtrees resolve
+  // asynchronously, so the decision can flip without the query changing).
+  if (
+    prevSearchValue !== searchValue ||
+    prevExpandForSearch !== expandForSearch
+  ) {
+    setPrevSearchValue(searchValue);
+    setPrevExpandForSearch(expandForSearch);
+    setIsExpanded(expandForSearch);
   }
 
   return (
@@ -657,12 +666,30 @@ interface SchemaNodeProps {
 const SchemaNode: React.FC<SchemaNodeProps> = (props) => {
   const { schema, schemaPath, depth } = props;
   const tree = useDataSourceTree();
-  const { databaseName, hasSearch, searchValue } = tree;
-  const [isExpanded, setIsExpanded] = React.useState(hasSearch);
+  const { databaseName, searchValue } = tree;
+  // Auto-expand during search only when this schema's loaded subtree contains a
+  // matching table.
+  const expandForSearch = schemaSubtreeMatchesSearch(schema, searchValue);
+  const [isExpanded, setIsExpanded] = React.useState(expandForSearch);
   const [isSelected, setIsSelected] = React.useState(false);
+  const [prevSearchValue, setPrevSearchValue] = React.useState(searchValue);
+  const [prevExpandForSearch, setPrevExpandForSearch] =
+    React.useState(expandForSearch);
   const uniqueValue = `${databaseName}:${schemaPath.join(".")}`;
   const childSchemas = schema.child_schemas ?? [];
 
+  // Re-sync when the query changes or when newly resolved data turns this
+  // subtree into a match under the same query (deferred tables/child schemas
+  // resolve asynchronously, so the decision can flip without the query changing).
+  if (
+    prevSearchValue !== searchValue ||
+    prevExpandForSearch !== expandForSearch
+  ) {
+    setPrevSearchValue(searchValue);
+    setPrevExpandForSearch(expandForSearch);
+    setIsExpanded(expandForSearch);
+  }
+
   return (
     <>
       <CommandItem

package/src/components/datasources/install-package-button.tsx

@@ -2,6 +2,7 @@
 
 import React from "react";
 import { Button } from "@/components/ui/button";
+import { useInstallAllowed } from "@/core/mode";
 import { useInstallPackages } from "@/core/packages/useInstallPackage";
 import { cn } from "@/utils/cn";
 
@@ -23,8 +24,9 @@ export const InstallPackageButton: React.FC<InstallPackageButtonProps> = ({
   onInstall,
 }) => {
   const { handleInstallPackages } = useInstallPackages();
+  const installAllowed = useInstallAllowed();
 
-  if (!packages || packages.length === 0) {
+  if (!packages || packages.length === 0 || !installAllowed) {
     return null;
   }
 

package/src/components/datasources/utils.ts

@@ -52,6 +52,51 @@ export function areChildSchemasResolved(schema: DatabaseSchema): boolean {
   return schema.child_schemas_resolved !== false;
 }
 
+/**
+ * Whether a loaded schema subtree contains a table whose name matches
+ * `searchValue`. Deferred (not-yet-fetched) tables and child schemas are
+ * treated as non-matching, so searching never triggers a lazy catalog fetch on
+ * large/remote connections.
+ */
+export function schemaSubtreeMatchesSearch(
+  schema: DatabaseSchema,
+  searchValue: string | undefined,
+): boolean {
+  const query = searchValue?.trim().toLowerCase();
+  if (!query) {
+    return false;
+  }
+  if (
+    areTablesResolved(schema) &&
+    schema.tables.some((table) => table.name.toLowerCase().includes(query))
+  ) {
+    return true;
+  }
+  if (areChildSchemasResolved(schema)) {
+    return (schema.child_schemas ?? []).some((child) =>
+      schemaSubtreeMatchesSearch(child, query),
+    );
+  }
+  return false;
+}
+
+/**
+ * Auto-expand a database row during search only when one of its loaded schemas
+ * contains a matching table. Returns false when the schema list itself is
+ * deferred.
+ */
+export function shouldExpandDatabaseForSearch(
+  database: Database,
+  searchValue: string | undefined,
+): boolean {
+  if (!searchValue?.trim() || !areSchemasResolved(database)) {
+    return false;
+  }
+  return database.schemas.some((schema) =>
+    schemaSubtreeMatchesSearch(schema, searchValue),
+  );
+}
+
 interface SqlCodeFormatter {
   /**
    * Format the table path based on dialect-specific rules

package/src/components/editor/actions/useNotebookActions.tsx

@@ -14,6 +14,7 @@ import {
   DownloadIcon,
   EditIcon,
   ExternalLinkIcon,
+  EyeIcon,
   EyeOffIcon,
   FastForwardIcon,
   FileIcon,
@@ -41,7 +42,10 @@ import {
   YoutubeIcon,
   ZapIcon,
 } from "lucide-react";
-import { settingDialogAtom } from "@/components/app-config/state";
+import {
+  settingDialogAtom,
+  useOpenSettingsToTab,
+} from "@/components/app-config/state";
 import { MarkdownIcon } from "@/components/editor/cell/code/icons";
 import { MarimoPlusIcon } from "@/components/icons/marimo-icons";
 import { useImperativeModal } from "@/components/modal/ImperativeModal";
@@ -57,7 +61,8 @@ import {
   useCellActions,
 } from "@/core/cells/cells";
 import { disabledCellIds } from "@/core/cells/utils";
-import { useResolvedMarimoConfig } from "@/core/config/config";
+import { capabilitiesAtom } from "@/core/config/capabilities";
+import { aiEnabledAtom, useResolvedMarimoConfig } from "@/core/config/config";
 import { Constants } from "@/core/constants";
 import {
   updateCellOutputsWithScreenshots,
@@ -86,7 +91,7 @@ import { Strings } from "@/utils/strings";
 import { newNotebookURL } from "@/utils/urls";
 import { useRunAllCells } from "../cell/useRunCells";
 import { useChromeActions, useChromeState } from "../chrome/state";
-import { PANELS } from "../chrome/types";
+import { isPanelHidden, PANELS } from "../chrome/types";
 import { AddConnectionDialogContent } from "../connections/add-connection-dialog";
 import { keyboardShortcutsAtom } from "../controls/keyboard-shortcuts";
 import { commandPaletteAtom } from "../controls/state";
@@ -95,8 +100,8 @@ import { LAYOUT_TYPES } from "../renderers/types";
 import { runServerSidePDFDownload } from "./pdf-export";
 import type { ActionButton } from "./types";
 import { useCopyNotebook } from "./useCopyNotebook";
-import { useHideAllMarkdownCode } from "./useHideAllMarkdownCode";
 import { useRestartKernel } from "./useRestartKernel";
+import { useSetCodeVisibility } from "./useSetCodeVisibility";
 
 const NOOP_HANDLER = (event?: Event) => {
   event?.preventDefault();
@@ -110,8 +115,10 @@ export function useNotebookActions() {
   const { selectedPanel } = useChromeState();
   const [viewState] = useAtom(viewStateAtom);
   const kioskMode = useAtomValue(kioskModeAtom);
-  const hideAllMarkdownCode = useHideAllMarkdownCode();
+  const setCodeVisibility = useSetCodeVisibility();
   const [resolvedConfig] = useResolvedMarimoConfig();
+  const capabilities = useAtomValue(capabilitiesAtom);
+  const aiEnabled = useAtomValue(aiEnabledAtom);
 
   const {
     updateCellConfig,
@@ -126,6 +133,7 @@ export function useNotebookActions() {
   const copyNotebook = useCopyNotebook(filename);
   const setCommandPaletteOpen = useSetAtom(commandPaletteAtom);
   const setSettingsDialogOpen = useSetAtom(settingDialogAtom);
+  const { handleClick: openSettings } = useOpenSettingsToTab();
   const setKeyboardShortcutsOpen = useSetAtom(keyboardShortcutsAtom);
   const {
     exportAsIPYNB,
@@ -407,20 +415,31 @@ export function useNotebookActions() {
       label: "Helper panel",
       redundant: true,
       handle: NOOP_HANDLER,
-      dropdown: PANELS.flatMap(
-        ({ type: id, Icon, hidden, additionalKeywords }) => {
-          if (hidden) {
-            return [];
-          }
-          return {
-            label: Strings.startCase(id),
-            rightElement: renderCheckboxElement(selectedPanel === id),
-            icon: <Icon size={14} strokeWidth={1.5} />,
-            handle: () => toggleApplication(id),
-            additionalKeywords,
-          };
-        },
-      ),
+      dropdown: PANELS.flatMap((panel) => {
+        // Still show the AI panel in the command palette so users can try AI
+        // features. When AI is disabled, open settings instead of the panel.
+        const openAiSettingsWhenDisabled = panel.type === "ai" && !aiEnabled;
+        if (
+          isPanelHidden({ panel, capabilities, aiEnabled }) &&
+          !openAiSettingsWhenDisabled
+        ) {
+          return [];
+        }
+        const { type: id, Icon, additionalKeywords } = panel;
+        return {
+          label: Strings.startCase(id),
+          rightElement: renderCheckboxElement(selectedPanel === id),
+          icon: <Icon size={14} strokeWidth={1.5} />,
+          handle: () => {
+            if (openAiSettingsWhenDisabled) {
+              openSettings("ai", "ai-features");
+              return;
+            }
+            toggleApplication(id);
+          },
+          additionalKeywords,
+        };
+      }),
     },
 
     {
@@ -560,11 +579,33 @@ export function useNotebookActions() {
         clearAllCellOutputs();
       },
     },
+    {
+      icon: <EyeIcon size={14} strokeWidth={1.5} />,
+      label: "Show all code",
+      hotkey: "global.showAllCode",
+      handle: () => setCodeVisibility(false, "code"),
+      redundant: true,
+    },
+    {
+      icon: <EyeOffIcon size={14} strokeWidth={1.5} />,
+      label: "Hide all code",
+      hotkey: "global.hideAllCode",
+      handle: () => setCodeVisibility(true, "code"),
+      redundant: true,
+    },
+    {
+      icon: <EyeIcon size={14} strokeWidth={1.5} />,
+      label: "Show all markdown code",
+      hotkey: "global.showAllMarkdownCode",
+      handle: () => setCodeVisibility(false, "markdown"),
+      redundant: true,
+    },
     {
       icon: <EyeOffIcon size={14} strokeWidth={1.5} />,
       label: "Hide all markdown code",
-      handle: hideAllMarkdownCode,
-      redundant: true, // hidden by default
+      hotkey: "global.hideAllMarkdownCode",
+      handle: () => setCodeVisibility(true, "markdown"),
+      redundant: true,
     },
     {
       icon: <ChevronRightCircleIcon size={14} strokeWidth={1.5} />,

package/src/components/editor/actions/useSetCodeVisibility.ts

@@ -0,0 +1,57 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+
+import { useCallback } from "react";
+import { getNotebook, useCellActions } from "@/core/cells/cells";
+import type { CellId } from "@/core/cells/ids";
+import { MarkdownLanguageAdapter } from "@/core/codemirror/language/languages/markdown";
+import { useRequestClient } from "@/core/network/requests";
+import type { CellConfig } from "@/core/network/types";
+import { Objects } from "@/utils/objects";
+
+const markdownAdapter = new MarkdownLanguageAdapter();
+
+/** The kind of cell a visibility change applies to. */
+export type CellCodeKind = "code" | "markdown";
+
+const cellCodeKind = (code: string): CellCodeKind =>
+  markdownAdapter.isSupported(code) ? "markdown" : "code";
+
+/**
+ * Hook returning a callback that hides or shows the code editor for every
+ * cell of the given kind.
+ */
+export const useSetCodeVisibility = () => {
+  const { updateCellConfig } = useCellActions();
+  const { saveCellConfig } = useRequestClient();
+
+  return useCallback(
+    async (hidden: boolean, kind: CellCodeKind) => {
+      const notebook = getNotebook();
+
+      const newConfigs: Record<CellId, Partial<CellConfig>> = {};
+
+      for (const cellId of notebook.cellIds.inOrderIds) {
+        const cell = notebook.cellData[cellId];
+        if (cell === undefined || cell.config.hide_code === hidden) {
+          continue;
+        }
+        if (cellCodeKind(cell.code) !== kind) {
+          continue;
+        }
+        newConfigs[cellId] = { hide_code: hidden };
+      }
+
+      const entries = Objects.entries(newConfigs);
+      if (entries.length === 0) {
+        return;
+      }
+
+      await saveCellConfig({ configs: newConfigs });
+
+      for (const [cellId, config] of entries) {
+        updateCellConfig({ cellId, config });
+      }
+    },
+    [updateCellConfig, saveCellConfig],
+  );
+};

package/src/components/editor/connections/components.tsx

@@ -1,6 +1,7 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useAtomValue } from "jotai";
 import React from "react";
 import { type DefaultValues, type FieldValues, useForm } from "react-hook-form";
 import type { z } from "zod";
@@ -16,8 +17,10 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@/components/ui/select";
+import { maybeAddMarimoImport } from "@/core/cells/add-missing-import";
 import { useCellActions } from "@/core/cells/cells";
 import { useLastFocusedCellId } from "@/core/cells/focus";
+import { autoInstantiateAtom } from "@/core/config/config";
 import { ENV_RENDERER, SecretsProvider } from "./form-renderers";
 
 const RENDERERS: FormRenderer[] = [ENV_RENDERER];
@@ -106,8 +109,18 @@ export const ConnectionFormFooter = <L extends string>({
 export function useInsertCode() {
   const { createNewCell } = useCellActions();
   const lastFocusedCellId = useLastFocusedCellId();
+  const autoInstantiate = useAtomValue(autoInstantiateAtom);
 
   return (code: string) => {
+    // Ensure `mo` is importable when the generated code references it
+    if (/\bmo\./.test(code)) {
+      maybeAddMarimoImport({
+        autoInstantiate,
+        createNewCell,
+        fromCellId: lastFocusedCellId,
+      });
+    }
+
     createNewCell({
       code,
       before: false,

package/src/components/editor/connections/storage/__tests__/__snapshots__/as-code.test.ts.snap

@@ -85,14 +85,14 @@ store = GCSStore("my-bucket")"
 exports[`generateStorageCode > Google Drive > with default auth (no credentials) 1`] = `
 "from gdrive_fsspec import GoogleDriveFileSystem
 
-fs = GoogleDriveFileSystem(use_listings_cache=False)"
+fs = GoogleDriveFileSystem(use_listings_cache=False, skip_instance_cache=True)"
 `;
 
 exports[`generateStorageCode > Google Drive > with embedded auth (no credentials) 1`] = `
 "from gdrive_fsspec import GoogleDriveFileSystem
 
-fs = GoogleDriveFileSystem(use_listings_cache=False, auth_kwargs={"use_local_webserver": False})
-print("Google Drive connected! Important: Run this cell again to clear the console")"
+fs = GoogleDriveFileSystem(use_listings_cache=False, skip_instance_cache=True, auth_kwargs={"use_local_webserver": False})
+mo.output.clear_console()"
 `;
 
 exports[`generateStorageCode > Google Drive > with service account credentials 1`] = `
@@ -100,7 +100,7 @@ exports[`generateStorageCode > Google Drive > with service account credentials 1
 import json
 
 _creds = json.loads("""{"type": "service_account", "client_email": "test@test.iam.gserviceaccount.com"}""")
-fs = GoogleDriveFileSystem(creds=_creds, token="service_account", use_listings_cache=False)"
+fs = GoogleDriveFileSystem(creds=_creds, token="service_account", use_listings_cache=False, skip_instance_cache=True)"
 `;
 
 exports[`generateStorageCode > S3 > basic connection with all fields 1`] = `

package/src/components/editor/connections/storage/as-code.ts

@@ -168,6 +168,10 @@ function generateGDriveCode(
   connection: Extract<StorageConnection, { type: "gdrive" }>,
   options: { secrets: SecretContainer; isEmbedded?: boolean },
 ): { imports: Set<string>; code: string } {
+  /**
+   * Skip instance cache True so you can create multiple connections which don't reference the same creds.
+   * Use listings cache False so we don't get stale reads.
+   */
   const { secrets, isEmbedded = false } = options;
   const imports = new Set(["from gdrive_fsspec import GoogleDriveFileSystem"]);
 
@@ -179,18 +183,21 @@ function generateGDriveCode(
     );
     const code = dedent(`
       _creds = json.loads("""${connection.credentials_json?.startsWith("ENV:") ? `{${creds}}` : connection.credentials_json}""")
-      fs = GoogleDriveFileSystem(creds=_creds, token="service_account", use_listings_cache=False)
+      fs = GoogleDriveFileSystem(creds=_creds, token="service_account", use_listings_cache=False, skip_instance_cache=True)
     `);
     return { imports, code };
   }
 
+  // In the iframe (embedded) flow we authenticate via the console-based OOB
+  // flow, which prints an auth URL and reads the code from stdin. Clear the
+  // console afterwards so the (single-use) auth code doesn't linger.
   const code = isEmbedded
     ? dedent(`
-        fs = GoogleDriveFileSystem(use_listings_cache=False, auth_kwargs={"use_local_webserver": False})
-        print("Google Drive connected! Important: Run this cell again to clear the console")
+        fs = GoogleDriveFileSystem(use_listings_cache=False, skip_instance_cache=True, auth_kwargs={"use_local_webserver": False})
+        mo.output.clear_console()
       `)
     : dedent(`
-        fs = GoogleDriveFileSystem(use_listings_cache=False)
+        fs = GoogleDriveFileSystem(use_listings_cache=False, skip_instance_cache=True)
       `);
   return { imports, code };
 }

package/src/components/editor/header/__tests__/status.test.tsx

@@ -67,10 +67,6 @@ describe("StatusOverlay disconnect indicator", () => {
   });
 
   it.each([
-    [
-      WebSocketClosedReason.MALFORMED_QUERY,
-      "the kernel did not recognize a request; please file a bug with marimo",
-    ],
     [
       WebSocketClosedReason.KERNEL_STARTUP_ERROR,
       "Failed to start kernel sandbox",

package/src/components/editor/header/status.tsx

@@ -22,9 +22,8 @@ export const StatusOverlay: React.FC<{
   const { mode } = useAtomValue(viewStateAtom);
   const isClosed = connection.state === WebSocketState.CLOSED;
   const isOpen = connection.state === WebSocketState.OPEN;
-  // Only KERNEL_DISCONNECTED is recoverable by a retry. Other terminal
-  // reasons (MALFORMED_QUERY, KERNEL_STARTUP_ERROR) would deterministically
-  // fail the same way.
+  // Only KERNEL_DISCONNECTED is recoverable by a retry. KERNEL_STARTUP_ERROR
+  // would deterministically fail the same way.
   const canReconnect =
     isClosed && connection.code === WebSocketClosedReason.KERNEL_DISCONNECTED;
 

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

@@ -2920,6 +2920,39 @@ describe("cell reducer", () => {
       expect(state.untouchedNewCells.has(newCellId)).toBe(true);
     });
 
+    it("adds interactively-created hidden cell with boilerplate code to untouchedNewCells", () => {
+      // Markdown cells are created with hideCode and non-empty default code
+      // (e.g. `mo.md(r"""\n""")`). They are user-initiated, so their editor
+      // should be shown until first blur.
+      actions.createNewCell({
+        cellId: "__end__",
+        before: false,
+        code: 'mo.md(r"""\n""")',
+        hideCode: true,
+        autoFocus: true,
+      });
+
+      const newCellId =
+        state.cellIds.inOrderIds[state.cellIds.inOrderIds.length - 1];
+      expect(state.untouchedNewCells.has(newCellId)).toBe(true);
+    });
+
+    it("does not add programmatically-created hidden cell with code to untouchedNewCells", () => {
+      // Cells created by the kernel (e.g. via code_mode) carry code and
+      // autoFocus=false; their hide_code must take effect immediately.
+      actions.createNewCell({
+        cellId: "__end__",
+        before: false,
+        code: "x = 1",
+        hideCode: true,
+        autoFocus: false,
+      });
+
+      const newCellId =
+        state.cellIds.inOrderIds[state.cellIds.inOrderIds.length - 1];
+      expect(state.untouchedNewCells.has(newCellId)).toBe(false);
+    });
+
     it("does not add cell to untouchedNewCells when hideCode is false", () => {
       actions.createNewCell({
         cellId: "__end__",

package/src/core/cells/cells.ts

@@ -276,7 +276,7 @@ const {
       },
       scrollKey: autoFocus ? newCellId : null,
       untouchedNewCells:
-        hideCode && !code
+        hideCode && autoFocus
           ? new Set([...state.untouchedNewCells, newCellId])
           : state.untouchedNewCells,
     };

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

@@ -45,7 +45,12 @@ export const DEFAULT_AI_MODEL = "openai/gpt-4o";
 const AUTO_DOWNLOAD_FORMATS = ["html", "markdown", "ipynb"] as const;
 
 export type CopilotMode = NonNullable<schemas["AiConfig"]["mode"]>;
-export const COPILOT_MODES: CopilotMode[] = ["manual", "ask", "agent"];
+export const COPILOT_MODES: CopilotMode[] = [
+  "manual",
+  "ask",
+  "agent",
+  "code_mode",
+];
 
 const AiConfigSchema = z
   .object({

package/src/core/edit-app.tsx

@@ -20,6 +20,7 @@ import {
   useRunAllCells,
   useRunStaleCells,
 } from "../components/editor/cell/useRunCells";
+import { useSetCodeVisibility } from "../components/editor/actions/useSetCodeVisibility";
 import { CellArray } from "../components/editor/renderers/cell-array";
 import { CellsRenderer } from "../components/editor/renderers/cells-renderer";
 import { useHotkey } from "../hooks/useHotkey";
@@ -112,6 +113,7 @@ export const EditApp: React.FC<AppProps> = ({
   const runStaleCells = useRunStaleCells();
   const runAllCells = useRunAllCells();
   const togglePresenting = useTogglePresenting();
+  const setCodeVisibility = useSetCodeVisibility();
 
   // HOTKEYS
   useHotkey("global.runStale", () => {
@@ -126,6 +128,18 @@ export const EditApp: React.FC<AppProps> = ({
   useHotkey("global.runAll", () => {
     runAllCells();
   });
+  useHotkey("global.showAllCode", () => {
+    setCodeVisibility(false, "code");
+  });
+  useHotkey("global.hideAllCode", () => {
+    setCodeVisibility(true, "code");
+  });
+  useHotkey("global.showAllMarkdownCode", () => {
+    setCodeVisibility(false, "markdown");
+  });
+  useHotkey("global.hideAllMarkdownCode", () => {
+    setCodeVisibility(true, "markdown");
+  });
   useHotkey("global.collapseAllSections", () => {
     collapseAllCells();
   });