@marimo-team/islands 0.20.3-dev91 → 0.20.3-dev94

package/dist/main.js

@@ -32103,6 +32103,13 @@ ${c.sqlString}
         svg: true,
         mathMl: true
       },
+      ADD_TAGS: [
+        "use"
+      ],
+      ADD_ATTR: [
+        "href",
+        "xlink:href"
+      ],
       FORCE_BODY: true,
       CUSTOM_ELEMENT_HANDLING: {
         tagNameCheck: /^(marimo-[A-Za-z][\w-]*|iconify-icon)$/,
@@ -70351,7 +70358,7 @@ Image URL: ${r.imageUrl}`)), contextToXml({
       return Logger.warn("Failed to get version from mount config"), null;
     }
   }
-  const marimoVersionAtom = atom(getVersionFromMountConfig() || "0.20.3-dev91"), showCodeInRunModeAtom = atom(true);
+  const marimoVersionAtom = atom(getVersionFromMountConfig() || "0.20.3-dev94"), showCodeInRunModeAtom = atom(true);
   atom(null);
   var import_compiler_runtime$88 = require_compiler_runtime();
   function useKeydownOnElement(e, r) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marimo-team/islands",
-  "version": "0.20.3-dev91",
+  "version": "0.20.3-dev94",
   "main": "dist/main.js",
   "types": "dist/index.d.ts",
   "type": "module",

package/src/components/storage/components.tsx

@@ -13,6 +13,7 @@ import {
   FileSpreadsheetIcon,
   FileTextIcon,
   FileVideoIcon,
+  GithubIcon,
   GlobeIcon,
   HardDriveIcon,
   ImageIcon,
@@ -66,6 +67,7 @@ const PROTOCOL_ICONS: Record<KnownStorageProtocol, IconEntry> = {
   http: GlobeIcon,
   file: HardDriveIcon,
   "in-memory": DatabaseZapIcon,
+  github: GithubIcon,
 };
 
 export const ProtocolIcon: React.FC<{

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

@@ -70,7 +70,7 @@ describe("notebookStateFromSession", () => {
     cells: SessionCell[],
   ): api.Session["NotebookSessionV1"] => ({
     version: "1",
-    metadata: { marimo_version: "1" },
+    metadata: { marimo_version: "1", script_metadata_hash: null },
     cells,
   });
 

package/src/core/storage/types.ts

@@ -54,4 +54,5 @@ export type KnownStorageProtocol =
   | "cloudflare"
   | "http"
   | "file"
-  | "in-memory";
+  | "in-memory"
+  | "github";

package/src/plugins/core/__test__/sanitize.test.ts

@@ -288,9 +288,54 @@ describe("sanitizeHtml", () => {
     expect(sanitizeHtml(html)).toMatchInlineSnapshot(`"<div>Text</div>"`);
   });
 
-  test("removes use element from SVG", () => {
+  test("preserves use element in SVG", () => {
     const html = '<svg><use xlink:href="#icon"></use></svg>';
-    expect(sanitizeHtml(html)).toMatchInlineSnapshot(`"<svg></svg>"`);
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<svg><use xlink:href="#icon"></use></svg>"`,
+    );
+  });
+
+  test("preserves SVG defs and use pattern", () => {
+    const html = [
+      '<svg width="60" height="60">',
+      '<circle cx="30" cy="30" r="30" fill="orange"></circle>',
+      '<defs><circle id="myCircle" cx="0" cy="0" r="10" fill="green"></circle></defs>',
+      '<use href="#myCircle" x="20" y="20"></use>',
+      "</svg>",
+    ].join("");
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<svg width="60" height="60"><circle cx="30" cy="30" r="30" fill="orange"></circle><defs><circle id="myCircle" cx="0" cy="0" r="10" fill="green"></circle></defs><use href="#myCircle" x="20" y="20"></use></svg>"`,
+    );
+  });
+
+  test("strips javascript: href from SVG use element", () => {
+    const html = '<svg><use href="javascript:alert(1)"></use></svg>';
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<svg><use></use></svg>"`,
+    );
+  });
+
+  test("strips javascript: xlink:href from SVG use element", () => {
+    const html = '<svg><use xlink:href="javascript:alert(1)"></use></svg>';
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<svg><use></use></svg>"`,
+    );
+  });
+
+  test("preserves external href on SVG use element", () => {
+    const html =
+      '<svg><use href="https://example.com/sprite.svg#icon"></use></svg>';
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<svg><use href="https://example.com/sprite.svg#icon"></use></svg>"`,
+    );
+  });
+
+  test("preserves external xlink:href on SVG use element", () => {
+    const html =
+      '<svg><use xlink:href="https://example.com/sprite.svg#icon"></use></svg>';
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<svg><use xlink:href="https://example.com/sprite.svg#icon"></use></svg>"`,
+    );
   });
 
   test("removes javascript in SVG href", () => {

package/src/plugins/core/sanitize.ts

@@ -74,6 +74,10 @@ export function sanitizeHtml(html: string) {
   const sanitizationOptions: Config = {
     // Default to permit HTML, SVG and MathML, this limits to HTML only
     USE_PROFILES: { html: true, svg: true, mathMl: true },
+    // Allow SVG <use> elements and their href attributes, which are needed
+    // for SVGs that reference <defs> (e.g., Matplotlib SVG output).
+    ADD_TAGS: ["use"],
+    ADD_ATTR: ["href", "xlink:href"],
     // glue elements like style, script or others to document.body and prevent unintuitive browser behavior in several edge-cases
     FORCE_BODY: true,
     CUSTOM_ELEMENT_HANDLING: {