@marimo-team/islands 0.23.7-dev6 → 0.23.7-dev61

package/src/plugins/impl/data-frames/forms/__tests__/__snapshots__/form.test.tsx.snap

@@ -27,11 +27,12 @@ exports[`renderZodSchema > should render a form aggregate 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_27_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_26_-form-item"
             type="button"
@@ -58,7 +59,7 @@ exports[`renderZodSchema > should render a form aggregate 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -82,11 +83,12 @@ exports[`renderZodSchema > should render a form aggregate 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_29_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_28_-form-item"
             type="button"
@@ -113,7 +115,7 @@ exports[`renderZodSchema > should render a form aggregate 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -399,11 +401,12 @@ exports[`renderZodSchema > should render a form explode_columns 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_2p_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_2o_-form-item"
             type="button"
@@ -430,7 +433,7 @@ exports[`renderZodSchema > should render a form explode_columns 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -596,11 +599,12 @@ exports[`renderZodSchema > should render a form group_by 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_1p_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_1o_-form-item"
             type="button"
@@ -627,7 +631,7 @@ exports[`renderZodSchema > should render a form group_by 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -651,11 +655,12 @@ exports[`renderZodSchema > should render a form group_by 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_1r_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_1q_-form-item"
             type="button"
@@ -682,7 +687,7 @@ exports[`renderZodSchema > should render a form group_by 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -798,11 +803,12 @@ exports[`renderZodSchema > should render a form pivot 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_3b_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_3a_-form-item"
             type="button"
@@ -829,7 +835,7 @@ exports[`renderZodSchema > should render a form pivot 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -853,11 +859,12 @@ exports[`renderZodSchema > should render a form pivot 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_3d_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_3c_-form-item"
             type="button"
@@ -884,7 +891,7 @@ exports[`renderZodSchema > should render a form pivot 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -908,11 +915,12 @@ exports[`renderZodSchema > should render a form pivot 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_3f_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_3e_-form-item"
             type="button"
@@ -939,7 +947,7 @@ exports[`renderZodSchema > should render a form pivot 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -1298,11 +1306,12 @@ exports[`renderZodSchema > should render a form select_columns 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_4_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_3_-form-item"
             type="button"
@@ -1329,7 +1338,7 @@ exports[`renderZodSchema > should render a form select_columns 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -1581,11 +1590,12 @@ exports[`renderZodSchema > should render a form unique 1`] = `
           aria-invalid="false"
           class="relative"
         >
-          <div
+          <button
             aria-controls="radix-_r_32_"
+            aria-disabled="false"
             aria-expanded="false"
             aria-haspopup="dialog"
-            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+            class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
             data-state="closed"
             id="_r_31_-form-item"
             type="button"
@@ -1612,7 +1622,7 @@ exports[`renderZodSchema > should render a form unique 1`] = `
                 d="m6 9 6 6 6-6"
               />
             </svg>
-          </div>
+          </button>
           <div
             class="flex flex-col gap-1 items-start"
           />
@@ -1740,11 +1750,12 @@ exports[`renders custom forms column_id_array 1`] = `
       aria-invalid="false"
       class="relative"
     >
-      <div
+      <button
         aria-controls="radix-_r_41_"
+        aria-disabled="false"
         aria-expanded="false"
         aria-haspopup="dialog"
-        class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+        class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
         data-state="closed"
         id="_r_40_-form-item"
         type="button"
@@ -1771,7 +1782,7 @@ exports[`renders custom forms column_id_array 1`] = `
             d="m6 9 6 6 6-6"
           />
         </svg>
-      </div>
+      </button>
       <div
         class="flex flex-col gap-1 items-start"
       />
@@ -1790,11 +1801,12 @@ exports[`renders custom forms column_id_dot_array 1`] = `
       aria-invalid="false"
       class="relative"
     >
-      <div
+      <button
         aria-controls="radix-_r_43_"
+        aria-disabled="false"
         aria-expanded="false"
         aria-haspopup="dialog"
-        class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50 min-w-[180px]"
+        class="flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid min-w-[180px]"
         data-state="closed"
         id="_r_42_-form-item"
         type="button"
@@ -1821,7 +1833,7 @@ exports[`renders custom forms column_id_dot_array 1`] = `
             d="m6 9 6 6 6-6"
           />
         </svg>
-      </div>
+      </button>
       <div
         class="flex flex-col gap-1 items-start"
       />

package/src/plugins/impl/data-frames/schema.ts

@@ -80,7 +80,10 @@ export const FilterConditionSchema = z
       .enum(Object.keys(ALL_OPERATORS) as [OperatorType, ...OperatorType[]])
       .describe(FieldOptions.of({ label: " " })),
     type: z.literal("condition").default("condition"),
-    value: z.any().describe(FieldOptions.of({ label: "Value" })),
+    value: z
+      .any()
+      .optional()
+      .describe(FieldOptions.of({ label: "Value" })),
     negate: z.boolean().default(false),
   })
   .describe(FieldOptions.of({ direction: "row", special: "column_filter" }));

package/src/plugins/impl/vega/resolve-data.ts

@@ -1,6 +1,7 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
 import { asRemoteURL } from "@/core/runtime/config";
+import { Semaphore } from "@/utils/semaphore";
 import { vegaLoadData } from "./loader";
 import type {
   FacetedUnitSpec,
@@ -17,6 +18,8 @@ type AnySpec =
   | UnitSpec<Field>
   | GenericFacetSpec<FacetedUnitSpec<Field>, LayerSpec<Field>, Field>;
 
+const VEGA_DATA_FETCH_CONCURRENCY = 5;
+
 /**
  * Given a VegaLite spec with URL data, resolve the data and return a new spec with the resolved data.
  *
@@ -30,6 +33,9 @@ export async function resolveVegaSpecData(
   }
 
   const datasets = "datasets" in spec ? { ...spec.datasets } : {};
+  // Single semaphore shared across the whole spec so total in-flight fetches
+  // (across all nested layers/hconcat/vconcat) stay bounded.
+  const fetchSem = new Semaphore(VEGA_DATA_FETCH_CONCURRENCY);
 
   const traverse = async <T extends AnySpec>(spec: T): Promise<T> => {
     if (!spec) {
@@ -80,7 +86,8 @@ export async function resolveVegaSpecData(
     } catch {
       return spec;
     }
-    const data = await vegaLoadData(url.href, spec.data.format);
+    const format = spec.data.format;
+    const data = await fetchSem.run(() => vegaLoadData(url.href, format));
 
     datasets[url.pathname] = data;
 

package/src/utils/__tests__/id-tree.test.ts

@@ -957,6 +957,77 @@ describe("MultiColumn", () => {
     expect(inserted.topLevelIds[1]).toEqual(["B1", "D1", "B2"]);
   });
 
+  describe("moveCellsRelativeTo", () => {
+    it("moves a single cell before target in same column", () => {
+      const moved = multiColumn.moveCellsRelativeTo(["A3"], "A1", "before");
+      expect(moved.topLevelIds).toEqual([
+        ["A3", "A1", "A2"],
+        ["B1", "B2"],
+        ["C1", "C2", "C3", "C4"],
+      ]);
+    });
+
+    it("moves a single cell after target in same column", () => {
+      const moved = multiColumn.moveCellsRelativeTo(["A1"], "A3", "after");
+      expect(moved.topLevelIds).toEqual([
+        ["A2", "A3", "A1"],
+        ["B1", "B2"],
+        ["C1", "C2", "C3", "C4"],
+      ]);
+    });
+
+    it("moves multiple cells before target", () => {
+      const moved = multiColumn.moveCellsRelativeTo(
+        ["A1", "A2"],
+        "B2",
+        "before",
+      );
+      expect(moved.topLevelIds).toEqual([
+        ["A3"],
+        ["B1", "A1", "A2", "B2"],
+        ["C1", "C2", "C3", "C4"],
+      ]);
+    });
+
+    it("moves multiple cells after target", () => {
+      const moved = multiColumn.moveCellsRelativeTo(
+        ["A2", "A3"],
+        "B1",
+        "after",
+      );
+      expect(moved.topLevelIds).toEqual([
+        ["A1"],
+        ["B1", "A2", "A3", "B2"],
+        ["C1", "C2", "C3", "C4"],
+      ]);
+    });
+
+    it("returns same MultiColumn when cellIds is empty", () => {
+      const moved = multiColumn.moveCellsRelativeTo([], "A1", "before");
+      expect(moved).toBe(multiColumn);
+    });
+
+    it("inserts at end when target is among moved cells", () => {
+      const moved = multiColumn.moveCellsRelativeTo(
+        ["A1", "A2"],
+        "A2",
+        "after",
+      );
+      // Target A2 was removed; insert at end of column 0
+      expect(moved.topLevelIds).toEqual([
+        ["A3", "A1", "A2"],
+        ["B1", "B2"],
+        ["C1", "C2", "C3", "C4"],
+      ]);
+    });
+
+    it("throws when node not found", () => {
+      expect(() =>
+        multiColumn.moveCellsRelativeTo(["Z1"], "A1", "before"),
+      ).toThrow("Cell Z1 not found in any column");
+    });
+  });
+
   it("deletes by id", () => {
     const deleted = multiColumn.deleteById("B1");
     expect(deleted.topLevelIds[1]).toEqual(["B2"]);

package/src/utils/__tests__/semaphore.test.ts

@@ -0,0 +1,218 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+import { describe, expect, it } from "vitest";
+import { Deferred } from "../Deferred";
+import { mapWithConcurrency, Semaphore } from "../semaphore";
+
+describe("Semaphore", () => {
+  it("rejects invalid permit counts", () => {
+    expect(() => new Semaphore(0)).toThrow();
+    expect(() => new Semaphore(-1)).toThrow();
+    expect(() => new Semaphore(1.5)).toThrow();
+  });
+
+  it("resolves run() with the function's value", async () => {
+    const sem = new Semaphore(1);
+    await expect(sem.run(async () => 42)).resolves.toBe(42);
+    expect(sem.available).toBe(1);
+    expect(sem.pending).toBe(0);
+  });
+
+  it("releases the permit when run() rejects", async () => {
+    const sem = new Semaphore(1);
+    await expect(
+      sem.run(async () => {
+        throw new Error("boom");
+      }),
+    ).rejects.toThrow("boom");
+    expect(sem.available).toBe(1);
+  });
+
+  it("caps concurrent in-flight tasks at `permits`", async () => {
+    const sem = new Semaphore(3);
+    let inFlight = 0;
+    let maxInFlight = 0;
+    const gates = Array.from({ length: 10 }, () => new Deferred<void>());
+
+    const tasks = gates.map((gate) =>
+      sem.run(async () => {
+        inFlight++;
+        maxInFlight = Math.max(maxInFlight, inFlight);
+        await gate.promise;
+        inFlight--;
+      }),
+    );
+
+    // Let microtasks run so the first batch is scheduled.
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(maxInFlight).toBe(3);
+    expect(sem.available).toBe(0);
+    expect(sem.pending).toBe(7);
+
+    // Release them all and confirm everyone finishes.
+    for (const gate of gates) {
+      gate.resolve();
+    }
+    await Promise.all(tasks);
+    expect(maxInFlight).toBe(3);
+    expect(sem.available).toBe(3);
+    expect(sem.pending).toBe(0);
+  });
+
+  it("releases waiters in FIFO order", async () => {
+    const sem = new Semaphore(1);
+    const order: number[] = [];
+    const hold = new Deferred<void>();
+
+    // First holder takes the only permit and parks on `hold`.
+    const first = sem.run(async () => {
+      order.push(0);
+      await hold.promise;
+    });
+
+    // Queue three more in known order.
+    const rest = [1, 2, 3].map((i) =>
+      sem.run(async () => {
+        order.push(i);
+      }),
+    );
+
+    await Promise.resolve();
+    expect(order).toEqual([0]);
+    expect(sem.pending).toBe(3);
+
+    hold.resolve();
+    await Promise.all([first, ...rest]);
+    expect(order).toEqual([0, 1, 2, 3]);
+  });
+
+  it("throws on release() beyond initial permit count", () => {
+    const sem = new Semaphore(2);
+    expect(() => sem.release()).toThrow(/more times than acquire/);
+  });
+
+  it("supports manual acquire/release", async () => {
+    const sem = new Semaphore(2);
+    await sem.acquire();
+    await sem.acquire();
+    expect(sem.available).toBe(0);
+
+    let resolved = false;
+    const waiter = sem.acquire().then(() => {
+      resolved = true;
+    });
+    await Promise.resolve();
+    expect(resolved).toBe(false);
+
+    sem.release();
+    await waiter;
+    expect(resolved).toBe(true);
+
+    sem.release();
+    sem.release();
+    expect(sem.available).toBe(2);
+  });
+});
+
+describe("mapWithConcurrency", () => {
+  it("returns [] for empty input without invoking fn", async () => {
+    let called = 0;
+    const result = await mapWithConcurrency([], 5, async () => {
+      called++;
+      return 1;
+    });
+    expect(result).toEqual([]);
+    expect(called).toBe(0);
+  });
+
+  it("preserves input order in the result", async () => {
+    const input = [10, 20, 30, 40, 50];
+    const result = await mapWithConcurrency(input, 2, async (n) => {
+      // Reverse the natural completion order so we'd notice if order broke.
+      await new Promise((r) => setTimeout(r, input.length - input.indexOf(n)));
+      return n * 2;
+    });
+    expect(result).toEqual([20, 40, 60, 80, 100]);
+  });
+
+  it("respects the concurrency cap", async () => {
+    let inFlight = 0;
+    let maxInFlight = 0;
+    const items = Array.from({ length: 20 }, (_, i) => i);
+    const gates = items.map(() => new Deferred<void>());
+
+    const result = mapWithConcurrency(items, 4, async (i) => {
+      inFlight++;
+      maxInFlight = Math.max(maxInFlight, inFlight);
+      await gates[i].promise;
+      inFlight--;
+      return i;
+    });
+
+    // Flush microtasks so the first batch enters fn().
+    await Promise.resolve();
+    await Promise.resolve();
+    expect(maxInFlight).toBe(4);
+
+    // Releasing one gate should let exactly one queued task enter fn().
+    for (const gate of gates) {
+      gate.resolve();
+    }
+    await result;
+    expect(maxInFlight).toBe(4);
+  });
+
+  it("lets in-flight tasks complete after the first rejection", async () => {
+    const completed: number[] = [];
+    const gates = [0, 1, 2, 3, 4].map(() => new Deferred<void>());
+
+    const result = mapWithConcurrency([0, 1, 2, 3, 4], 5, async (i) => {
+      await gates[i].promise;
+      if (i === 0) {
+        throw new Error("first failed");
+      }
+      completed.push(i);
+      return i;
+    });
+
+    // Reject the first one; the other 4 are still gated.
+    gates[0].resolve();
+    // Drain the rejection (catch so it doesn't escape the test).
+    await expect(result).rejects.toThrow("first failed");
+
+    // The other tasks were already in-flight when the rejection happened;
+    // they should still resolve when their gates open.
+    for (let i = 1; i < gates.length; i++) {
+      gates[i].resolve();
+    }
+    // Yield so the remaining sem.run() finallys run.
+    await new Promise((r) => setTimeout(r, 0));
+    expect(completed.toSorted()).toEqual([1, 2, 3, 4]);
+  });
+
+  it("rejects on the first error", async () => {
+    await expect(
+      mapWithConcurrency([1, 2, 3], 2, async (n) => {
+        if (n === 2) {
+          throw new Error("nope");
+        }
+        return n;
+      }),
+    ).rejects.toThrow("nope");
+  });
+
+  it("throws on invalid concurrency, even for empty input", () => {
+    expect(() => mapWithConcurrency([1, 2, 3], 0, async (n) => n)).toThrow();
+    expect(() => mapWithConcurrency([], 0, async (n: number) => n)).toThrow();
+  });
+
+  it("passes the index to fn", async () => {
+    const result = await mapWithConcurrency(
+      ["a", "b", "c"],
+      2,
+      async (item, index) => `${index}:${item}`,
+    );
+    expect(result).toEqual(["0:a", "1:b", "2:c"]);
+  });
+});

package/src/utils/fileToBase64.ts

@@ -1,5 +1,9 @@
 /* Copyright 2026 Marimo. All rights reserved. */
 
+import { mapWithConcurrency } from "./semaphore";
+
+const FILE_READ_CONCURRENCY = 5;
+
 /**
  * Converts a Blob or File to either a base64-encoded string or a data URL.
  *
@@ -35,11 +39,8 @@ export function blobToString(
  * Returns a promised array of tuples [file name, file contents].
  */
 export function filesToBase64(files: File[]): Promise<[string, string][]> {
-  return Promise.all(
-    files.map((file) =>
-      blobToString(file, "base64").then(
-        (contents) => [file.name, contents] as [string, string],
-      ),
-    ),
-  );
+  return mapWithConcurrency(files, FILE_READ_CONCURRENCY, async (file) => {
+    const contents = await blobToString(file, "base64");
+    return [file.name, contents] as [string, string];
+  });
 }