@marimo-team/islands 0.25.1-dev4 → 0.25.1-dev40

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

@@ -36,7 +36,7 @@ abstract class CodeGenerator<T extends DatabaseConnection["type"]> {
   protected orm: ConnectionLibrary;
   protected secrets: SecretContainer;
 
-  constructor(
+  public constructor(
     connection: Extract<DatabaseConnection, { type: T }>,
     orm: ConnectionLibrary,
     secrets: SecretContainer,
@@ -46,7 +46,7 @@ abstract class CodeGenerator<T extends DatabaseConnection["type"]> {
     this.secrets = secrets;
   }
 
-  get imports(): Set<string> {
+  public get imports(): Set<string> {
     const imports = new Set<string>(this.generateImports());
     switch (this.orm) {
       case "sqlalchemy":
@@ -67,7 +67,7 @@ abstract class CodeGenerator<T extends DatabaseConnection["type"]> {
 
   protected abstract generateImports(): string[];
 
-  abstract generateConnectionCode(): string;
+  public abstract generateConnectionCode(): string;
 }
 
 const makePrivate = (name: string) => `_${name}`;
@@ -75,14 +75,14 @@ const makePrivate = (name: string) => `_${name}`;
 class SecretContainer {
   private secrets: Record<string, string> = {};
 
-  get imports(): Set<string> {
+  public get imports(): Set<string> {
     if (Object.keys(this.secrets).length === 0) {
       return new Set<string>();
     }
     return new Set<string>(["import os"]);
   }
 
-  print(
+  public print(
     varName: string,
     secretKeyOrValue: string | number | boolean,
     defaultValue?: string | undefined,
@@ -119,7 +119,7 @@ class SecretContainer {
     return `"${secretKeyOrValue}"`;
   }
 
-  printInFString(
+  public printInFString(
     varName: string,
     secretKeyOrValue: string | number | undefined | boolean,
     defaultValue?: string | undefined,
@@ -171,7 +171,7 @@ class SecretContainer {
    * f"db://sample:access_token@sample.com"
    * ```
    */
-  printPassword(
+  public printPassword(
     password: string | undefined,
     passwordPlaceholder: string,
     inFString: boolean,
@@ -187,11 +187,11 @@ class SecretContainer {
       : printMethod(variableName || "password", passwordPlaceholder, password);
   }
 
-  getSecrets(): Record<string, string> {
+  public getSecrets(): Record<string, string> {
     return this.secrets;
   }
 
-  formatSecrets(): string {
+  public formatSecrets(): string {
     if (Object.keys(this.secrets).length === 0) {
       return "";
     }
@@ -203,11 +203,11 @@ class SecretContainer {
 }
 
 class PostgresGenerator extends CodeGenerator<"postgres"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return [];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const ssl = this.connection.ssl
       ? ", connect_args={'sslmode': 'require'}"
       : "";
@@ -235,11 +235,11 @@ class PostgresGenerator extends CodeGenerator<"postgres"> {
 }
 
 class MySQLGenerator extends CodeGenerator<"mysql"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return [];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const ssl = this.connection.ssl
       ? ", connect_args={'ssl': {'ssl-mode': 'preferred'}}"
       : "";
@@ -267,11 +267,11 @@ class MySQLGenerator extends CodeGenerator<"mysql"> {
 }
 
 class SQLiteGenerator extends CodeGenerator<"sqlite"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return [];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const database = this.connection.database
       ? this.secrets.printInFString("database", this.connection.database)
       : "";
@@ -289,11 +289,11 @@ class SQLiteGenerator extends CodeGenerator<"sqlite"> {
 }
 
 class SnowflakeGenerator extends CodeGenerator<"snowflake"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return ["from snowflake.sqlalchemy import URL"];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const { authType, account, database, warehouse, schema, role } =
       this.connection;
     const baseParams: Record<string, string | undefined> = {
@@ -422,11 +422,11 @@ class BigQueryGenerator extends CodeGenerator<"bigquery"> {
     );
   }
 
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return this.credential.kind === "path" ? [] : ["import json"];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const project = this.secrets.printInFString(
       "project",
       this.connection.project,
@@ -451,11 +451,11 @@ class BigQueryGenerator extends CodeGenerator<"bigquery"> {
 }
 
 class DuckDBGenerator extends CodeGenerator<"duckdb"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return [];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const database = this.secrets.printInFString(
       "database",
       this.connection.database || ":memory:",
@@ -469,11 +469,11 @@ class DuckDBGenerator extends CodeGenerator<"duckdb"> {
 }
 
 class MotherDuckGenerator extends CodeGenerator<"motherduck"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return [];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const database = this.secrets.printInFString(
       "database",
       this.connection.database,
@@ -497,11 +497,11 @@ class MotherDuckGenerator extends CodeGenerator<"motherduck"> {
 }
 
 class ClickHouseGenerator extends CodeGenerator<"clickhouse_connect"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return ["import clickhouse_connect"];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const password = this.secrets.printPassword(
       this.connection.password,
       "CLICKHOUSE_PASSWORD",
@@ -530,11 +530,11 @@ ${formatUrlParams(params, (inner) => `        ${inner}`)},
 }
 
 class TimeplusGenerator extends CodeGenerator<"timeplus"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return [];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const password = this.secrets.printPassword(
       this.connection.password,
       "TIMEPLUS_PASSWORD",
@@ -555,11 +555,11 @@ class TimeplusGenerator extends CodeGenerator<"timeplus"> {
 }
 
 class ChDBGenerator extends CodeGenerator<"chdb"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return ["import chdb"];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const database =
       this.secrets.print("database", this.connection.database) || '""';
 
@@ -570,13 +570,13 @@ class ChDBGenerator extends CodeGenerator<"chdb"> {
 }
 
 class TrinoGenerator extends CodeGenerator<"trino"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return this.connection.async_support
       ? ["import aiotrino"]
       : ["import trino.sqlalchemy"];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const trinoExtension = this.connection.async_support ? "aiotrino" : "trino";
     const schema = this.connection.schema ? `/${this.connection.schema}` : "";
 
@@ -614,7 +614,7 @@ class PyIcebergGenerator extends CodeGenerator<"iceberg"> {
     );
   }
 
-  generateImports(): string[] {
+  public generateImports(): string[] {
     if (Object.keys(this.getCatalogOptions()).length === 0) {
       return ["from pyiceberg.catalog import load_catalog"];
     }
@@ -635,7 +635,7 @@ class PyIcebergGenerator extends CodeGenerator<"iceberg"> {
     }
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const name = `"${this.connection.name}"`;
     const options = this.getCatalogOptions();
     if (Object.keys(options).length === 0) {
@@ -705,12 +705,12 @@ class PyIcebergGenerator extends CodeGenerator<"iceberg"> {
 }
 
 class DataFusionGenerator extends CodeGenerator<"datafusion"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     // To trigger installation of ibis-datafusion
     return ["from datafusion import SessionContext"];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     if (this.connection.sessionContext) {
       return dedent(`
         ctx = SessionContext()
@@ -727,11 +727,11 @@ class DataFusionGenerator extends CodeGenerator<"datafusion"> {
 }
 
 class PySparkGenerator extends CodeGenerator<"pyspark"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return ["from pyspark.sql import SparkSession"];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     if (this.connection.host || this.connection.port) {
       const host = this.secrets.printInFString("host", this.connection.host);
       const port = this.secrets.printInFString("port", this.connection.port);
@@ -747,11 +747,11 @@ class PySparkGenerator extends CodeGenerator<"pyspark"> {
 }
 
 class RedshiftGenerator extends CodeGenerator<"redshift"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return ["import redshift_connector"];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const host = this.secrets.print("host", this.connection.host);
     const port = this.secrets.print("port", this.connection.port);
     const database = this.secrets.print("database", this.connection.database);
@@ -819,11 +819,11 @@ ${formatUrlParams(params, (inner) => `          ${inner}`)},
 }
 
 class DatabricksGenerator extends CodeGenerator<"databricks"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     return [];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const useFString = this.orm !== "ibis";
 
     const accessToken = this.secrets.printPassword(
@@ -883,14 +883,14 @@ class DatabricksGenerator extends CodeGenerator<"databricks"> {
 }
 
 class SupabaseGenerator extends CodeGenerator<"supabase"> {
-  generateImports(): string[] {
+  public generateImports(): string[] {
     if (this.connection.disable_client_pooling) {
       return ["from sqlalchemy.pool import NullPool"];
     }
     return [];
   }
 
-  generateConnectionCode(): string {
+  public generateConnectionCode(): string {
     const password = this.secrets.printPassword(
       this.connection.password,
       "SUPABASE_PASSWORD",
@@ -921,7 +921,7 @@ class SupabaseGenerator extends CodeGenerator<"supabase"> {
 class CodeGeneratorFactory {
   public secrets = new SecretContainer();
 
-  createGenerator(
+  public createGenerator(
     connection: DatabaseConnection,
     orm: ConnectionLibrary,
   ): CodeGenerator<DatabaseConnection["type"]> {

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

@@ -26,14 +26,14 @@ export const StorageLibraryDisplayNames: Record<StorageLibrary, string> = {
 class SecretContainer {
   private secrets: Record<string, string> = {};
 
-  get imports(): Set<string> {
+  public get imports(): Set<string> {
     if (Object.keys(this.secrets).length === 0) {
       return new Set<string>();
     }
     return new Set<string>(["import os"]);
   }
 
-  print(varName: string, value: string | undefined): string {
+  public print(varName: string, value: string | undefined): string {
     if (value === undefined || value === "") {
       return "";
     }
@@ -46,7 +46,7 @@ class SecretContainer {
     return `"${escapePythonString(value)}"`;
   }
 
-  formatSecrets(): string {
+  public formatSecrets(): string {
     if (Object.keys(this.secrets).length === 0) {
       return "";
     }

package/src/components/editor/file-tree/requesting-tree.tsx

@@ -55,7 +55,7 @@ export class RequestingTree {
     renameFileOrFolder: EditRequests["sendRenameFileOrFolder"];
   };
 
-  constructor(callbacks: {
+  public constructor(callbacks: {
     getRoots: EditRequests["getFileRoots"];
     listFiles: EditRequests["sendListFiles"];
     createFileOrFolder: EditRequests["sendCreateFileOrFolder"];
@@ -71,7 +71,7 @@ export class RequestingTree {
   private onChange: (data: FileTreeNode[]) => void = Functions.NOOP;
   private path = new PathBuilder("/");
 
-  initialize = async (
+  public initialize = async (
     onChange: (data: FileTreeNode[]) => void,
   ): Promise<void> => {
     this.onChange = onChange;
@@ -102,7 +102,7 @@ export class RequestingTree {
     this.emitChange();
   };
 
-  expand(id: string): Promise<boolean> {
+  public expand(id: string): Promise<boolean> {
     return this.requestDirectory(id);
   }
 
@@ -149,11 +149,11 @@ export class RequestingTree {
     }
   }
 
-  getRoots(): readonly FileRoot[] {
+  public getRoots(): readonly FileRoot[] {
     return this.roots;
   }
 
-  async reveal(node: FileTreeNode): Promise<boolean> {
+  public async reveal(node: FileTreeNode): Promise<boolean> {
     const relative = relativePath(node.path as FilePath, node.rootPath);
     if (relative === null) {
       return false;
@@ -190,7 +190,7 @@ export class RequestingTree {
     return true;
   }
 
-  async copy(id: string, newName: string): Promise<void> {
+  public async copy(id: string, newName: string): Promise<void> {
     const node = this.getMutableNode(id);
     if (!node) {
       return;
@@ -206,7 +206,7 @@ export class RequestingTree {
     }
   }
 
-  async rename(id: string, name: string): Promise<void> {
+  public async rename(id: string, name: string): Promise<void> {
     const node = this.getMutableNode(id);
     if (!node) {
       return;
@@ -222,7 +222,7 @@ export class RequestingTree {
     }
   }
 
-  async move(fromIds: string[], parentId: string | null): Promise<void> {
+  public async move(fromIds: string[], parentId: string | null): Promise<void> {
     const targetParentId = parentId ?? this.getPrimaryRootId();
     const parent = this.delegate.find(targetParentId);
     if (!parent?.data.isDirectory) {
@@ -253,7 +253,7 @@ export class RequestingTree {
     await this.refreshPaths([...refreshPaths]);
   }
 
-  async createFile({
+  public async createFile({
     name,
     parentId,
     type = "file",
@@ -278,7 +278,10 @@ export class RequestingTree {
     }
   }
 
-  async createFolder(name: string, parentId: string | null): Promise<void> {
+  public async createFolder(
+    name: string,
+    parentId: string | null,
+  ): Promise<void> {
     const parent = this.getParentNode(parentId);
     if (!parent) {
       return;
@@ -295,7 +298,7 @@ export class RequestingTree {
     }
   }
 
-  async delete(id: string): Promise<void> {
+  public async delete(id: string): Promise<void> {
     const node = this.getMutableNode(id);
     if (!node) {
       return;
@@ -309,7 +312,7 @@ export class RequestingTree {
     }
   }
 
-  refreshAll = async (ids: string[]): Promise<void> => {
+  public refreshAll = async (ids: string[]): Promise<void> => {
     const paths = [
       ...this.roots.map((root) => root.path),
       ...ids
@@ -325,7 +328,7 @@ export class RequestingTree {
     );
   };
 
-  refreshPath = async (path: FilePath): Promise<void> => {
+  public refreshPath = async (path: FilePath): Promise<void> => {
     await this.refreshPaths([path]);
   };
 

package/src/components/editor/navigation/clipboard.ts

@@ -257,7 +257,7 @@ const toastPasteFailed = () => {
 class ClipboardItemBuilder {
   private items: Record<string, string | Blob> = {};
 
-  add(mimeType: string, value: string | object) {
+  public add(mimeType: string, value: string | object) {
     // Skip if the browser doesn't support the mime type
     if (!ClipboardItem.supports(mimeType)) {
       Logger.warn(`ClipboardItem does not support ${mimeType}`);
@@ -275,7 +275,7 @@ class ClipboardItemBuilder {
     return this;
   }
 
-  build() {
+  public build() {
     return new ClipboardItem(this.items);
   }
 }

package/src/components/editor/notebook-cell.tsx

@@ -762,7 +762,7 @@ const EditableCellComponent = ({
                     href="https://links.marimo.app/reusable-definitions"
                     target="_blank"
                     className="hover:underline text-muted-foreground text-xs font-bold"
-                    rel="noopener"
+                    rel="noreferrer"
                   >
                     reusable
                   </a>
@@ -801,7 +801,7 @@ const EditableCellComponent = ({
                     <a
                       href="https://links.marimo.app/reusable-definitions"
                       target="_blank"
-                      rel="noopener"
+                      rel="noreferrer"
                     >
                       <HelpCircleIcon
                         size={16}

package/src/components/editor/output/MarimoTracebackOutput.tsx

@@ -177,7 +177,7 @@ export const MarimoTracebackOutput = ({
                 <a
                   target="_blank"
                   href="https://marimo.io/discord?ref=notebook"
-                  rel="noopener"
+                  rel="noreferrer"
                 >
                   <MessageCircleIcon className="h-4 w-4 mr-2" />
                   Ask in Discord

package/src/components/editor/output/VideoOutput.tsx

@@ -7,5 +7,5 @@ interface Props {
 }
 
 export const VideoOutput = ({ src, className }: Props): JSX.Element => {
-  return <iframe className={className} src={src} />;
+  return <iframe className={className} src={src} title="Video output" />;
 };

package/src/components/editor/output/ansi-reduce.ts

@@ -13,8 +13,10 @@ export interface Cursor {
 export class TerminalBuffer {
   private lines: string[] = [""];
   private cursor: Cursor = { row: 0, col: 0 };
-  // oxlint-ignore-next-line no-control-regex -- Needed for ANSI escape sequence parsing
-  private static readonly ESCAPE_REGEX = /\u001B\[([0-9;]*)([A-DJKH])/u;
+  private static readonly ESCAPE_REGEX = new RegExp(
+    String.raw`\u001B\[([0-9;]*)([A-DJKH])`,
+    "u",
+  );
 
   /** Ensure the internal lines array is large enough. */
   private ensureLine(row: number) {
@@ -40,7 +42,7 @@ export class TerminalBuffer {
   }
 
   /** Write a visible character at the current cursor position. */
-  writeChar(ch: string) {
+  public writeChar(ch: string) {
     this.ensureLine(this.cursor.row);
     const line = this.lines[this.cursor.row];
     const padded = line.padEnd(this.cursor.col, " ");
@@ -50,7 +52,7 @@ export class TerminalBuffer {
   }
 
   /** Write a string of visible characters at the current cursor position (optimized batch write). */
-  writeString(str: string) {
+  public writeString(str: string) {
     if (str.length === 0) {
       return;
     }
@@ -65,7 +67,7 @@ export class TerminalBuffer {
   }
 
   /** Handle simple control characters (\n, \r, \t, \b, \v). */
-  control(ch: string) {
+  public control(ch: string) {
     switch (ch) {
       case "\n":
         this.cursor.row++;
@@ -93,7 +95,7 @@ export class TerminalBuffer {
    * Supports cursor movement and line erasing.
    * For other sequences (like color codes), preserve them by writing to the buffer.
    */
-  handleEscape(seq: string) {
+  public handleEscape(seq: string) {
     const match = TerminalBuffer.ESCAPE_REGEX.exec(seq);
     if (!match) {
       // If it doesn't match the cursor movement pattern, it might be:
@@ -170,7 +172,7 @@ export class TerminalBuffer {
   }
 
   /** Return the final rendered buffer as a single string. */
-  render(): string {
+  public render(): string {
     return this.lines.join("\n");
   }
 }
@@ -180,10 +182,12 @@ export class TerminalBuffer {
  */
 export class AnsiParser {
   // Matches both CSI sequences (ESC[...letter) and other escape sequences like character set selection (ESC(B)
-  // oxlint-ignore-next-line no-control-regex -- Needed for ANSI parsing
-  private ESC_REGEX = /\u001B(?:\[[0-9;]*[A-Za-z]|\([0-9A-Za-z])/gu;
+  private ESC_REGEX = new RegExp(
+    String.raw`\u001B(?:\[[0-9;]*[A-Za-z]|\([0-9A-Za-z])`,
+    "gu",
+  );
 
-  parse(input: string): { type: "text" | "escape"; value: string }[] {
+  public parse(input: string): { type: "text" | "escape"; value: string }[] {
     const tokens: { type: "text" | "escape"; value: string }[] = [];
     let lastIndex = 0;
 
@@ -217,7 +221,7 @@ export class AnsiReducer {
    * Process the entire input string (replaces any previous state).
    * Use this for one-time processing or when starting fresh.
    */
-  reduce(input: string): string {
+  public reduce(input: string): string {
     this.reset();
     this.append(input);
     return this.render();
@@ -227,7 +231,7 @@ export class AnsiReducer {
    * Append new input to the existing buffer (for streaming/incremental updates).
    * This is efficient for streaming scenarios - only processes the new chunk.
    */
-  append(input: string): void {
+  public append(input: string): void {
     const tokens = this.parser.parse(input);
 
     // Fast path: if only one text token (no ANSI codes), handle directly
@@ -256,14 +260,14 @@ export class AnsiReducer {
    * Reset the buffer and cursor to initial state.
    * Use this when you want to start processing fresh input.
    */
-  reset(): void {
+  public reset(): void {
     this.buffer = new TerminalBuffer();
   }
 
   /**
    * Get the current rendered output without processing new input.
    */
-  render(): string {
+  public render(): string {
     return this.buffer.render();
   }
 
@@ -371,7 +375,7 @@ export class StatefulOutputMessage implements OutputMessage {
     return this._data;
   }
 
-  static create(message: StringOutputMessage): StatefulOutputMessage {
+  public static create(message: StringOutputMessage): StatefulOutputMessage {
     const ansiReducer = new AnsiReducer();
     ansiReducer.append(message.data);
     return new StatefulOutputMessage(
@@ -395,7 +399,7 @@ export class StatefulOutputMessage implements OutputMessage {
     this._data = this.ansiReducer.render();
   }
 
-  appendData(chunk: string): StatefulOutputMessage {
+  public appendData(chunk: string): StatefulOutputMessage {
     this.ansiReducer.append(chunk);
     return new StatefulOutputMessage(
       this.mimetype,
@@ -405,7 +409,7 @@ export class StatefulOutputMessage implements OutputMessage {
     );
   }
 
-  toJSON(): StringOutputMessage {
+  public toJSON(): StringOutputMessage {
     return {
       mimetype: this.mimetype,
       channel: this.channel,

package/src/components/editor/output/console/ConsoleOutput.tsx

@@ -347,20 +347,20 @@ const StdInput = (props: {
         placeholder="stdin"
         // Capture the keydown event for history navigation and submission
         onKeyDownCapture={(e) => {
-          if (e.key === "ArrowUp") {
+          if (!isPassword && e.key === "ArrowUp") {
             navigateUp();
             e.preventDefault();
             return;
           }
 
-          if (e.key === "ArrowDown") {
+          if (!isPassword && e.key === "ArrowDown") {
             navigateDown();
             e.preventDefault();
             return;
           }
 
           if (e.key === "Enter" && !e.shiftKey) {
-            if (value) {
+            if (value && !isPassword) {
               addToHistory(value);
             }
             onSubmit(value);