@marimo-team/islands 0.22.1-dev8 → 0.22.1

package/src/plugins/impl/vega/__tests__/utils.test.ts

@@ -33,4 +33,72 @@ describe("getContainerWidth", () => {
   it("should return undefined when width is explicitly undefined", () => {
     expect(getContainerWidth({ width: undefined })).toBeUndefined();
   });
+
+  it("should find width in nested facet spec", () => {
+    expect(
+      getContainerWidth({
+        $schema: "https://vega.github.io/schema/vega-lite/v6.json",
+        facet: { column: { field: "Origin", type: "nominal" } },
+        spec: {
+          mark: "point",
+          encoding: {},
+          width: "container",
+        },
+      }),
+    ).toBe("container");
+  });
+
+  it("should find width in nested repeat spec", () => {
+    expect(
+      getContainerWidth({
+        $schema: "https://vega.github.io/schema/vega-lite/v6.json",
+        repeat: { row: ["A", "B"] },
+        spec: {
+          mark: "point",
+          encoding: {},
+          width: "container",
+        },
+      }),
+    ).toBe("container");
+  });
+
+  it("should return undefined for nested spec without width", () => {
+    expect(
+      getContainerWidth({
+        facet: { column: { field: "Origin" } },
+        spec: { mark: "point", encoding: {} },
+      }),
+    ).toBeUndefined();
+  });
+
+  it("should return undefined for hconcat (width on sub-specs)", () => {
+    expect(
+      getContainerWidth({
+        hconcat: [{ width: "container" }, { width: "container" }],
+      }),
+    ).toBeUndefined();
+  });
+
+  it("should return undefined for vconcat (width on sub-specs)", () => {
+    expect(
+      getContainerWidth({
+        vconcat: [{ width: "container" }, { width: "container" }],
+      }),
+    ).toBeUndefined();
+  });
+
+  it("should return undefined for compiled Vega spec (width as signal)", () => {
+    expect(
+      getContainerWidth({
+        $schema: "https://vega.github.io/schema/vega/v6.json",
+        autosize: { contains: "padding", type: "fit-x" },
+        signals: [
+          {
+            name: "width",
+            init: "isFinite(containerSize()[0]) ? containerSize()[0] : 300",
+          },
+        ],
+      }),
+    ).toBeUndefined();
+  });
 });

package/src/plugins/impl/vega/batched.ts

@@ -1,5 +1,5 @@
 /* Copyright 2026 Marimo. All rights reserved. */
-/* eslint-disable @typescript-eslint/no-explicit-any */
+/* oxlint-disable typescript/no-explicit-any */
 
 import { tableFromIPC } from "@uwdata/flechette";
 import { batch } from "@/utils/batch-requests";

package/src/plugins/impl/vega/make-selectable.ts

@@ -40,11 +40,11 @@ function getParamSignature(param: TParams): string {
     type: select.type,
     encodings:
       "encodings" in select && select.encodings
-        ? [...select.encodings].sort()
+        ? [...select.encodings].toSorted()
         : undefined,
     fields:
       "fields" in select && select.fields
-        ? [...select.fields].sort()
+        ? [...select.fields].toSorted()
         : undefined,
     bind: param.bind,
   };
@@ -160,7 +160,7 @@ function findCommonParams(
         if (!signatureCounts.has(signature)) {
           signatureCounts.set(signature, { count: 0, param });
         }
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        // oxlint-disable-next-line typescript/no-non-null-assertion
         signatureCounts.get(signature)!.count++;
       }
     }

package/src/plugins/impl/vega/types.ts

@@ -25,7 +25,7 @@ export type {
 } from "vega-lite/types_unstable/spec/unit.js";
 
 export type VegaLiteUnitSpec = TopLevelUnitSpec<Field>;
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+// oxlint-disable-next-line typescript/no-explicit-any
 export type GenericVegaSpec = GenericUnitSpec<any, any, any>;
 export type EncodingType = keyof Encoding<Field>;
 export type Encodings = Encoding<Field>;

package/src/plugins/impl/vega/utils.ts

@@ -6,13 +6,22 @@ import type { DataType, FieldTypes, VegaDataType } from "./vega-loader";
 export type ContainerWidth = number | "container";
 
 /**
- * Get the container width from a VegaLite spec.
- * @param spec - The VegaLite spec.
- * @returns The container width.
+ * Get the container width from a Vega-Lite spec.
+ *
+ * For unit specs, `width` is at the top level. For facet/repeat specs,
+ * `width` is nested inside `spec`. This does not handle hconcat/vconcat and Vega spec
+ * where the width may be a signal. These cases are covered by
+ * the CSS fallback `.vega-embed:has(> .chart-wrapper.fit-x)`.
  */
 export function getContainerWidth(spec: unknown): ContainerWidth | undefined {
-  if (typeof spec === "object" && spec !== null && "width" in spec) {
-    return spec.width as ContainerWidth | undefined;
+  if (typeof spec === "object" && spec !== null) {
+    if ("width" in spec) {
+      return spec.width as ContainerWidth | undefined;
+    }
+    // Faceted/repeated spec
+    if ("spec" in spec) {
+      return getContainerWidth(spec.spec);
+    }
   }
   return undefined;
 }

package/src/plugins/impl/vega/vega.css

@@ -4,7 +4,8 @@
   max-width: 100%;
 }
 
-.vega-embed[data-container-width="container"] {
+.vega-embed[data-container-width="container"],
+.vega-embed:has(> .chart-wrapper.fit-x) {
   width: 100%;
 }
 

package/src/plugins/layout/DownloadPlugin.tsx

@@ -35,7 +35,7 @@ interface Data {
   lazy?: boolean;
 }
 
-// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
+// oxlint-disable-next-line typescript/consistent-type-definitions
 type Functions = {
   /**
    * Function to call for lazy loading

package/src/plugins/layout/ImageComparisonPlugin.tsx

@@ -11,9 +11,7 @@ const LazyImageComparisonComponent = React.lazy(
   () => import("../impl/image-comparison/ImageComparisonComponent"),
 );
 
-export class ImageComparisonPlugin
-  implements IStatelessPlugin<ImageComparisonData>
-{
+export class ImageComparisonPlugin implements IStatelessPlugin<ImageComparisonData> {
   tagName = "marimo-image-comparison";
 
   validator = z.object({

package/src/plugins/layout/LazyPlugin.tsx

@@ -14,7 +14,7 @@ interface Data {
   showLoadingIndicator: boolean;
 }
 
-// eslint-disable-next-line @typescript-eslint/consistent-type-definitions
+// oxlint-disable-next-line typescript/consistent-type-definitions
 type PluginFunctions = {
   load: (req: {}) => Promise<{
     html: string;

package/src/plugins/layout/RoutesPlugin.tsx

@@ -69,7 +69,7 @@ const RoutesComponent = ({
   }, [handleFindMatch]);
 
   if (!matched) {
-    // biome-ignore lint/complexity/noUselessFragments: this is intentional
+    // oxlint-disable-next-line react/jsx-no-useless-fragment
     return <></>;
   }
 

package/src/plugins/layout/mermaid/mermaid.tsx

@@ -63,7 +63,7 @@ function randomAlpha() {
 }
 
 const Mermaid: React.FC<Props> = ({ diagram }) => {
-  // eslint-disable-next-line react/hook-use-state
+  // oxlint-disable-next-line react/hook-use-state
   const [id] = useState(() => randomAlpha());
 
   const darkMode = useTheme().theme === "dark";

package/src/plugins/plugins.ts

@@ -1,5 +1,5 @@
 /* Copyright 2026 Marimo. All rights reserved. */
-/* eslint-disable @typescript-eslint/no-explicit-any */
+/* oxlint-disable typescript/no-explicit-any */
 
 import { NavigationMenuPlugin } from "@/plugins/layout/NavigationMenuPlugin";
 import { initializeUIElement } from "../core/dom/ui-element";

package/src/plugins/stateless-plugin.ts

@@ -20,8 +20,10 @@ export interface IStatelessPluginProps<D> {
   children?: React.ReactNode | undefined;
 }
 
-export interface IStatelessPlugin<D>
-  extends Omit<IPlugin<never, D>, "render" | "functions"> {
+export interface IStatelessPlugin<D> extends Omit<
+  IPlugin<never, D>,
+  "render" | "functions"
+> {
   /**
    * Render the plugin.
    */

package/src/stories/data-explorer.stories.tsx

@@ -1,5 +1,5 @@
 /* Copyright 2026 Marimo. All rights reserved. */
-/* eslint-disable react-hooks/rules-of-hooks */
+/* oxlint-disable react-hooks/rules-of-hooks */
 
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { useState } from "react";

package/src/stories/dataframe.stories.tsx

@@ -1,5 +1,5 @@
 /* Copyright 2026 Marimo. All rights reserved. */
-/* eslint-disable react-hooks/rules-of-hooks */
+/* oxlint-disable react-hooks/rules-of-hooks */
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { useState } from "react";
 import { DataFrameComponent } from "@/plugins/impl/data-frames/DataFramePlugin";

package/src/stories/editor.stories.tsx

@@ -52,7 +52,7 @@ const Editor = (opts: { extensions?: Extension[] }): React.ReactNode => {
     });
 
     return () => view.destroy();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    // oxlint-disable-next-line react-hooks/exhaustive-deps
   }, [ref.current]);
 
   return <div className="cm" ref={ref} />;

package/src/stories/select.stories.tsx

@@ -1,5 +1,5 @@
 /* Copyright 2026 Marimo. All rights reserved. */
-/* eslint-disable react-hooks/rules-of-hooks */
+/* oxlint-disable react-hooks/rules-of-hooks */
 
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { useState } from "react";

package/src/stories/switchable-multi-select.stories.tsx

@@ -1,5 +1,5 @@
 /* Copyright 2026 Marimo. All rights reserved. */
-/* eslint-disable react-hooks/rules-of-hooks */
+/* oxlint-disable react-hooks/rules-of-hooks */
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { useState } from "react";
 import { SwitchableMultiSelect } from "@/components/forms/switchable-multi-select";

package/src/utils/Logger.ts

@@ -1,5 +1,5 @@
 /* Copyright 2026 Marimo. All rights reserved. */
-/** biome-ignore-all lint/suspicious/noConsole: For console logging */
+/* oxlint-disable no-console -- For console logging */
 
 import { Functions } from "./functions";
 

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

@@ -124,7 +124,7 @@ describe("arrays", () => {
     });
 
     it("should handle undefined/null array", () => {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      // oxlint-disable-next-line typescript/no-explicit-any
       expect(arrayToggle(undefined as any, 1)).toEqual([1]);
     });
 

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

@@ -30,7 +30,7 @@ describe("Blob serialization and deserialization", () => {
     const serialized = await serializeBlob(testBlob);
     const deserialized = deserializeBlob(serialized);
     const reader = new FileReader();
-    // eslint-disable-next-line unicorn/prefer-blob-reading-methods
+    // oxlint-disable-next-line unicorn/prefer-blob-reading-methods
     reader.readAsText(deserialized);
     await new Promise((resolve) => {
       reader.onload = () => {

package/src/utils/__tests__/cell-urls.test.ts

@@ -92,27 +92,30 @@ describe("cell-urls utilities", () => {
   });
 
   describe("edge case cell names with unicode and special characters", () => {
-    it.each(
-      EDGE_CASE_CELL_NAMES,
-    )("should handle unicode cell names in createCellLink: %s", (cellName) => {
-      const url = createCellLink(cellName);
-      expect(url).toContain("scrollTo=");
-      expect(url).toContain(encodeURIComponent(cellName));
-    });
-
-    it.each(
-      EDGE_CASE_CELL_NAMES,
-    )("should round-trip unicode cell names correctly: %s", (cellName) => {
-      const url = createCellLink(cellName);
-      const hash = url.split("#")[1];
-      const extracted = extractCellNameFromHash(`#${hash}`);
-      expect(extracted).toBe(cellName);
-    });
+    it.each(EDGE_CASE_CELL_NAMES)(
+      "should handle unicode cell names in createCellLink: %s",
+      (cellName) => {
+        const url = createCellLink(cellName);
+        expect(url).toContain("scrollTo=");
+        expect(url).toContain(encodeURIComponent(cellName));
+      },
+    );
+
+    it.each(EDGE_CASE_CELL_NAMES)(
+      "should round-trip unicode cell names correctly: %s",
+      (cellName) => {
+        const url = createCellLink(cellName);
+        const hash = url.split("#")[1];
+        const extracted = extractCellNameFromHash(`#${hash}`);
+        expect(extracted).toBe(cellName);
+      },
+    );
 
-    it.each(
-      EDGE_CASE_CELL_NAMES,
-    )("should allow linking to unicode cell names: %s", (cellName) => {
-      expect(canLinkToCell(cellName)).toBe(true);
-    });
+    it.each(EDGE_CASE_CELL_NAMES)(
+      "should allow linking to unicode cell names: %s",
+      (cellName) => {
+        expect(canLinkToCell(cellName)).toBe(true);
+      },
+    );
   });
 });

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

@@ -73,7 +73,7 @@ describe("dates", () => {
 
     describe("with different locales", () => {
       // Save original implementation
-      // eslint-disable-next-line @typescript-eslint/unbound-method
+      // oxlint-disable-next-line typescript/unbound-method
       const originalToLocaleDateString = Date.prototype.toLocaleDateString;
 
       afterAll(() => {

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

@@ -46,7 +46,7 @@ describe("prettyError", () => {
   });
 
   it("handles circular references", () => {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    // oxlint-disable-next-line typescript/no-explicit-any
     const circular: any = { foo: "bar" };
     circular.self = circular;
     expect(prettyError(circular)).toBe("[object Object]");

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

@@ -35,22 +35,23 @@ describe("Filenames", () => {
     expect(Filenames.withoutExtension("test.foo.txt")).toEqual("test.foo");
   });
 
-  it.each(
-    EDGE_CASE_FILENAMES,
-  )("should handle edge case filenames: %s", (filename) => {
-    // Test all filename operations with edge cases
-    const withoutExt = Filenames.withoutExtension(filename);
+  it.each(EDGE_CASE_FILENAMES)(
+    "should handle edge case filenames: %s",
+    (filename) => {
+      // Test all filename operations with edge cases
+      const withoutExt = Filenames.withoutExtension(filename);
 
-    expect(Filenames.toMarkdown(filename)).toEqual(`${withoutExt}.md`);
-    expect(Filenames.toHTML(filename)).toEqual(`${withoutExt}.html`);
-    expect(Filenames.toPNG(filename)).toEqual(`${withoutExt}.png`);
-    expect(Filenames.toPY(filename)).toEqual(`${withoutExt}.py`);
-    expect(Filenames.toIPYNB(filename)).toEqual(`${withoutExt}.ipynb`);
+      expect(Filenames.toMarkdown(filename)).toEqual(`${withoutExt}.md`);
+      expect(Filenames.toHTML(filename)).toEqual(`${withoutExt}.html`);
+      expect(Filenames.toPNG(filename)).toEqual(`${withoutExt}.png`);
+      expect(Filenames.toPY(filename)).toEqual(`${withoutExt}.py`);
+      expect(Filenames.toIPYNB(filename)).toEqual(`${withoutExt}.ipynb`);
 
-    // Ensure operations preserve unicode and special characters in base name
-    expect(withoutExt).not.toEqual("");
-    expect(typeof withoutExt).toBe("string");
-  });
+      // Ensure operations preserve unicode and special characters in base name
+      expect(withoutExt).not.toEqual("");
+      expect(typeof withoutExt).toBe("string");
+    },
+  );
 });
 
 describe("getImageExtension", () => {

package/src/utils/__tests__/json-parser.test.ts

@@ -184,9 +184,8 @@ it("can convert json to markdown - with URLs", () => {
   `);
 
   // Mixed content - URL and text in same cell
-  expect(
-    jsonToMarkdown([{ info: "Visit https://example.com for more" }]),
-  ).toMatchInlineSnapshot(`
+  expect(jsonToMarkdown([{ info: "Visit https://example.com for more" }]))
+    .toMatchInlineSnapshot(`
     "| info |
     |---|
     | Visit [https://example.com](https://example.com) for more |"
@@ -203,9 +202,8 @@ it("can convert json to markdown - with URLs", () => {
 });
 
 it("can convert json to markdown - handles nulls and undefined", () => {
-  expect(
-    jsonToMarkdown([{ a: null, b: undefined, c: 1 }]),
-  ).toMatchInlineSnapshot(`
+  expect(jsonToMarkdown([{ a: null, b: undefined, c: 1 }]))
+    .toMatchInlineSnapshot(`
     "| a | b | c |
     |---|---|---|
     |  |  | 1 |"
@@ -226,18 +224,16 @@ it("can convert json to markdown - handles nulls and undefined", () => {
 
 it("can convert json to markdown - handles special characters", () => {
   // Pipes need to be escaped since they're markdown table delimiters
-  expect(
-    jsonToMarkdown([{ a: "value|with|pipes", b: "normal" }]),
-  ).toMatchInlineSnapshot(`
+  expect(jsonToMarkdown([{ a: "value|with|pipes", b: "normal" }]))
+    .toMatchInlineSnapshot(`
     "| a | b |
     |---|---|
     | value\\|with\\|pipes | normal |"
   `);
 
   // Newlines should be replaced with spaces
-  expect(
-    jsonToMarkdown([{ a: "line1\nline2", b: "normal" }]),
-  ).toMatchInlineSnapshot(`
+  expect(jsonToMarkdown([{ a: "line1\nline2", b: "normal" }]))
+    .toMatchInlineSnapshot(`
     "| a | b |
     |---|---|
     | line1 line2 | normal |"
@@ -252,9 +248,8 @@ it("can convert json to markdown - handles special characters", () => {
 });
 
 it("can convert json to markdown - handles different data types", () => {
-  expect(
-    jsonToMarkdown([{ str: "text", num: 42, bool: true, nil: null }]),
-  ).toMatchInlineSnapshot(`
+  expect(jsonToMarkdown([{ str: "text", num: 42, bool: true, nil: null }]))
+    .toMatchInlineSnapshot(`
     "| str | num | bool | nil |
     |---|---|---|---|
     | text | 42 | true |  |"
@@ -282,9 +277,8 @@ it("can convert json to markdown - handles different data types", () => {
     | [1,2,3] |"
   `);
 
-  expect(
-    jsonToMarkdown([{ data: { nested: "value" } }]),
-  ).toMatchInlineSnapshot(`
+  expect(jsonToMarkdown([{ data: { nested: "value" } }]))
+    .toMatchInlineSnapshot(`
     "| data |
     |---|
     | {"nested":"value"} |"
@@ -293,9 +287,8 @@ it("can convert json to markdown - handles different data types", () => {
 
 it("can convert json to markdown - handles existing markdown links", () => {
   // When input already contains a markdown link, it should be preserved as-is
-  expect(
-    jsonToMarkdown([{ link: "[Google](https://google.com)" }]),
-  ).toMatchInlineSnapshot(`
+  expect(jsonToMarkdown([{ link: "[Google](https://google.com)" }]))
+    .toMatchInlineSnapshot(`
     "| link |
     |---|
     | [Google](https://google.com) |"

package/src/utils/__tests__/multi-map.test.ts

@@ -132,7 +132,7 @@ describe("MultiMap", () => {
       multiMap.add("key2", 2);
       multiMap.add("key3", 3);
       const keys = [...multiMap.keys()];
-      expect(keys.sort()).toEqual(["key1", "key2", "key3"]);
+      expect(keys.toSorted()).toEqual(["key1", "key2", "key3"]);
     });
   });
 
@@ -204,7 +204,7 @@ describe("MultiMap", () => {
       multiMap.add("key3", 5);
 
       const flattened = multiMap.flatValues();
-      expect(flattened.sort()).toEqual([1, 2, 3, 4, 5]);
+      expect(flattened.toSorted()).toEqual([1, 2, 3, 4, 5]);
     });
 
     it("should handle empty arrays in values", () => {
@@ -213,7 +213,7 @@ describe("MultiMap", () => {
       multiMap.add("key2", 2);
 
       const flattened = multiMap.flatValues();
-      expect(flattened.sort()).toEqual([1, 2]);
+      expect(flattened.toSorted()).toEqual([1, 2]);
     });
   });
 

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

@@ -29,9 +29,9 @@ describe("Objects", () => {
     });
 
     it("should return falsy input unchanged", () => {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      // oxlint-disable-next-line typescript/no-explicit-any
       expect(Objects.mapValues(null as any, (v) => v)).toBe(null);
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      // oxlint-disable-next-line typescript/no-explicit-any
       expect(Objects.mapValues(undefined as any, (v) => v)).toBe(undefined);
     });
   });
@@ -249,7 +249,7 @@ describe("Objects", () => {
 
     it("should handle omitting non-existent keys", () => {
       const obj = { a: 1, b: 2 };
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      // oxlint-disable-next-line typescript/no-explicit-any
       const result = Objects.omit(obj, ["c" as any]);
       expect(result).toEqual({ a: 1, b: 2 });
     });

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

@@ -170,36 +170,39 @@ describe("PathBuilder", () => {
   });
 
   describe("edge case filenames", () => {
-    it.each(
-      EDGE_CASE_FILENAMES,
-    )("should handle unicode and spaces in basename: %s", (filename) => {
-      const basename = Paths.basename(filename);
-      expect(basename).toBe(filename);
-      expect(typeof basename).toBe("string");
-      expect(basename).not.toBe("");
-    });
-
-    it.each(
-      EDGE_CASE_FILENAMES,
-    )("should handle unicode and spaces in dirname: %s", (filename) => {
-      const fullPath = `/path/to/${filename}`;
-      const dirname = Paths.dirname(fullPath);
-      expect(dirname).toBe("/path/to");
-    });
-
-    it.each(
-      EDGE_CASE_FILENAMES,
-    )("should handle unicode and spaces in path operations: %s", (filename) => {
-      const baseName = Paths.basename(filename);
-      const extension = Paths.extension(filename);
-
-      // Should preserve unicode characters in basename
-      expect(baseName).toContain(filename.split(".")[0]);
-
-      // Should correctly extract extension
-      if (filename.includes(".")) {
-        expect(extension).toBe(filename.split(".").pop());
-      }
-    });
+    it.each(EDGE_CASE_FILENAMES)(
+      "should handle unicode and spaces in basename: %s",
+      (filename) => {
+        const basename = Paths.basename(filename);
+        expect(basename).toBe(filename);
+        expect(typeof basename).toBe("string");
+        expect(basename).not.toBe("");
+      },
+    );
+
+    it.each(EDGE_CASE_FILENAMES)(
+      "should handle unicode and spaces in dirname: %s",
+      (filename) => {
+        const fullPath = `/path/to/${filename}`;
+        const dirname = Paths.dirname(fullPath);
+        expect(dirname).toBe("/path/to");
+      },
+    );
+
+    it.each(EDGE_CASE_FILENAMES)(
+      "should handle unicode and spaces in path operations: %s",
+      (filename) => {
+        const baseName = Paths.basename(filename);
+        const extension = Paths.extension(filename);
+
+        // Should preserve unicode characters in basename
+        expect(baseName).toContain(filename.split(".")[0]);
+
+        // Should correctly extract extension
+        if (filename.includes(".")) {
+          expect(extension).toBe(filename.split(".").pop());
+        }
+      },
+    );
   });
 });