@marimo-team/islands 0.18.0 → 0.18.1

package/dist/{xml-CEIIhUsl.js → xml-BgKyT7dU.js}

@@ -1,4 +1,4 @@
-import { t as java_default } from "./java-Ci6qXyg1.js";
+import { t as java_default } from "./java-91iGU5ap.js";
 var lang = Object.freeze(JSON.parse(`{"displayName":"XML","name":"xml","patterns":[{"begin":"(<\\\\?)\\\\s*([-0-9A-Z_a-z]+)","captures":{"1":{"name":"punctuation.definition.tag.xml"},"2":{"name":"entity.name.tag.xml"}},"end":"(\\\\?>)","name":"meta.tag.preprocessor.xml","patterns":[{"match":" ([-A-Za-z]+)","name":"entity.other.attribute-name.xml"},{"include":"#doublequotedString"},{"include":"#singlequotedString"}]},{"begin":"(<!)(DOCTYPE)\\\\s+([:A-Z_a-z][-.0-:A-Z_a-z]*)","captures":{"1":{"name":"punctuation.definition.tag.xml"},"2":{"name":"keyword.other.doctype.xml"},"3":{"name":"variable.language.documentroot.xml"}},"end":"\\\\s*(>)","name":"meta.tag.sgml.doctype.xml","patterns":[{"include":"#internalSubset"}]},{"include":"#comments"},{"begin":"(<)((?:([-0-9A-Z_a-z]+)(:))?([-0-:A-Z_a-z]+))(?=(\\\\s[^>]*)?></\\\\2>)","beginCaptures":{"1":{"name":"punctuation.definition.tag.xml"},"2":{"name":"entity.name.tag.xml"},"3":{"name":"entity.name.tag.namespace.xml"},"4":{"name":"punctuation.separator.namespace.xml"},"5":{"name":"entity.name.tag.localname.xml"}},"end":"(>)(</)((?:([-0-9A-Z_a-z]+)(:))?([-0-:A-Z_a-z]+))(>)","endCaptures":{"1":{"name":"punctuation.definition.tag.xml"},"2":{"name":"punctuation.definition.tag.xml"},"3":{"name":"entity.name.tag.xml"},"4":{"name":"entity.name.tag.namespace.xml"},"5":{"name":"punctuation.separator.namespace.xml"},"6":{"name":"entity.name.tag.localname.xml"},"7":{"name":"punctuation.definition.tag.xml"}},"name":"meta.tag.no-content.xml","patterns":[{"include":"#tagStuff"}]},{"begin":"(</?)(?:([-.\\\\w]+)((:)))?([-.:\\\\w]+)","captures":{"1":{"name":"punctuation.definition.tag.xml"},"2":{"name":"entity.name.tag.namespace.xml"},"3":{"name":"entity.name.tag.xml"},"4":{"name":"punctuation.separator.namespace.xml"},"5":{"name":"entity.name.tag.localname.xml"}},"end":"(/?>)","name":"meta.tag.xml","patterns":[{"include":"#tagStuff"}]},{"include":"#entity"},{"include":"#bare-ampersand"},{"begin":"<%@","beginCaptures":{"0":{"name":"punctuation.section.embedded.begin.xml"}},"end":"%>","endCaptures":{"0":{"name":"punctuation.section.embedded.end.xml"}},"name":"source.java-props.embedded.xml","patterns":[{"match":"page|include|taglib","name":"keyword.other.page-props.xml"}]},{"begin":"<%[!=]?(?!--)","beginCaptures":{"0":{"name":"punctuation.section.embedded.begin.xml"}},"end":"(?!--)%>","endCaptures":{"0":{"name":"punctuation.section.embedded.end.xml"}},"name":"source.java.embedded.xml","patterns":[{"include":"source.java"}]},{"begin":"<!\\\\[CDATA\\\\[","beginCaptures":{"0":{"name":"punctuation.definition.string.begin.xml"}},"end":"]]>","endCaptures":{"0":{"name":"punctuation.definition.string.end.xml"}},"name":"string.unquoted.cdata.xml"}],"repository":{"EntityDecl":{"begin":"(<!)(ENTITY)\\\\s+(%\\\\s+)?([:A-Z_a-z][-.0-:A-Z_a-z]*)(\\\\s+(?:SYSTEM|PUBLIC)\\\\s+)?","captures":{"1":{"name":"punctuation.definition.tag.xml"},"2":{"name":"keyword.other.entity.xml"},"3":{"name":"punctuation.definition.entity.xml"},"4":{"name":"variable.language.entity.xml"},"5":{"name":"keyword.other.entitytype.xml"}},"end":"(>)","patterns":[{"include":"#doublequotedString"},{"include":"#singlequotedString"}]},"bare-ampersand":{"match":"&","name":"invalid.illegal.bad-ampersand.xml"},"comments":{"patterns":[{"begin":"<%--","captures":{"0":{"name":"punctuation.definition.comment.xml"},"end":"--%>","name":"comment.block.xml"}},{"begin":"<!--","captures":{"0":{"name":"punctuation.definition.comment.xml"}},"end":"-->","name":"comment.block.xml","patterns":[{"begin":"--(?!>)","captures":{"0":{"name":"invalid.illegal.bad-comments-or-CDATA.xml"}}}]}]},"doublequotedString":{"begin":"\\"","beginCaptures":{"0":{"name":"punctuation.definition.string.begin.xml"}},"end":"\\"","endCaptures":{"0":{"name":"punctuation.definition.string.end.xml"}},"name":"string.quoted.double.xml","patterns":[{"include":"#entity"},{"include":"#bare-ampersand"}]},"entity":{"captures":{"1":{"name":"punctuation.definition.constant.xml"},"3":{"name":"punctuation.definition.constant.xml"}},"match":"(&)([:A-Z_a-z][-.0-:A-Z_a-z]*|#[0-9]+|#x\\\\h+)(;)","name":"constant.character.entity.xml"},"internalSubset":{"begin":"(\\\\[)","captures":{"1":{"name":"punctuation.definition.constant.xml"}},"end":"(])","name":"meta.internalsubset.xml","patterns":[{"include":"#EntityDecl"},{"include":"#parameterEntity"},{"include":"#comments"}]},"parameterEntity":{"captures":{"1":{"name":"punctuation.definition.constant.xml"},"3":{"name":"punctuation.definition.constant.xml"}},"match":"(%)([:A-Z_a-z][-.0-:A-Z_a-z]*)(;)","name":"constant.character.parameter-entity.xml"},"singlequotedString":{"begin":"'","beginCaptures":{"0":{"name":"punctuation.definition.string.begin.xml"}},"end":"'","endCaptures":{"0":{"name":"punctuation.definition.string.end.xml"}},"name":"string.quoted.single.xml","patterns":[{"include":"#entity"},{"include":"#bare-ampersand"}]},"tagStuff":{"patterns":[{"captures":{"1":{"name":"entity.other.attribute-name.namespace.xml"},"2":{"name":"entity.other.attribute-name.xml"},"3":{"name":"punctuation.separator.namespace.xml"},"4":{"name":"entity.other.attribute-name.localname.xml"}},"match":"(?:^|\\\\s+)(?:([-.\\\\w]+)((:)))?([-.:\\\\w]+)\\\\s*="},{"include":"#doublequotedString"},{"include":"#singlequotedString"}]}},"scopeName":"text.xml","embeddedLangs":["java"]}`)), xml_default = [...java_default, lang];
 export {
   xml_default as t

package/dist/xml-C7KksLEJ.js

@@ -0,0 +1,5 @@
+import "./java-91iGU5ap.js";
+import { t as xml_default } from "./xml-BgKyT7dU.js";
+export {
+  xml_default as default
+};

package/dist/{xsl-BynZr4Sw.js → xsl-9daNus4h.js}

@@ -1,5 +1,5 @@
-import "./java-Ci6qXyg1.js";
-import { t as xml_default } from "./xml-CEIIhUsl.js";
+import "./java-91iGU5ap.js";
+import { t as xml_default } from "./xml-BgKyT7dU.js";
 var lang = Object.freeze(JSON.parse(`{"displayName":"XSL","name":"xsl","patterns":[{"begin":"(<)(xsl)((:))(template)","captures":{"1":{"name":"punctuation.definition.tag.xml"},"2":{"name":"entity.name.tag.namespace.xml"},"3":{"name":"entity.name.tag.xml"},"4":{"name":"punctuation.separator.namespace.xml"},"5":{"name":"entity.name.tag.localname.xml"}},"end":"(>)","name":"meta.tag.xml.template","patterns":[{"captures":{"1":{"name":"entity.other.attribute-name.namespace.xml"},"2":{"name":"entity.other.attribute-name.xml"},"3":{"name":"punctuation.separator.namespace.xml"},"4":{"name":"entity.other.attribute-name.localname.xml"}},"match":" (?:([-0-9A-Z_a-z]+)((:)))?([-A-Za-z]+)"},{"include":"#doublequotedString"},{"include":"#singlequotedString"}]},{"include":"text.xml"}],"repository":{"doublequotedString":{"begin":"\\"","beginCaptures":{"0":{"name":"punctuation.definition.string.begin.xml"}},"end":"\\"","endCaptures":{"0":{"name":"punctuation.definition.string.end.xml"}},"name":"string.quoted.double.xml"},"singlequotedString":{"begin":"'","beginCaptures":{"0":{"name":"punctuation.definition.string.begin.xml"}},"end":"'","endCaptures":{"0":{"name":"punctuation.definition.string.end.xml"}},"name":"string.quoted.single.xml"}},"scopeName":"text.xml.xsl","embeddedLangs":["xml"]}`)), xsl_default = [...xml_default, lang];
 export {
   xsl_default as default

package/dist/{xychartDiagram-6GGTOJPD-u5660hzT.js → xychartDiagram-6GGTOJPD-DkDWjoGr.js}

@@ -3,25 +3,25 @@ import "./purify.es-DaeeWvOb.js";
 import "./isArrayLikeObject-LulrZoeO.js";
 import "./memoize-CYy6haUi.js";
 import "./merge-B9H0db2e.js";
-import "./marked.esm-CqJtK50L.js";
+import "./marked.esm-DpOvkPbZ.js";
 import "./precisionRound-vxMVRvgy.js";
-import { t as linear } from "./linear-B8XR-NVr.js";
-import { n as ordinal } from "./ordinal-DncHRC0c.js";
+import { t as linear } from "./linear-CUCOukde.js";
+import { n as ordinal } from "./ordinal-CgAjEHLv.js";
 import { t as range } from "./range-CqZlY8CG.js";
 import "./defaultLocale-C98cxApy.js";
-import "./path-B-wCTTNY.js";
-import "./math-B9kWnSVt.js";
-import "./array-lX94FrxB.js";
-import "./step-zYP-E-fB.js";
-import { t as line_default } from "./line-DBxDZ2GZ.js";
-import { i as cleanAndMerge } from "./chunk-S3R3BYOJ-F8AD9lHs.js";
-import { n as initRange } from "./init-BU4YGOOg.js";
-import "./timer--XD4eQXe.js";
-import { i as log, r as __name } from "./src-CePha-_O.js";
-import { B as setAccTitle, C as getDiagramTitle, I as sanitizeText, T as getThemeVariables3, U as setDiagramTitle, _ as getAccDescription, a as clear, c as configureSvgSize, d as defaultConfig_default, v as getAccTitle, y as getConfig, z as setAccDescription } from "./chunk-ABZYJK2D-plHo87kc.js";
-import { t as selectSvgElement } from "./chunk-EXTU4WIE-CzYdpCHC.js";
-import "./dist-CFOn9U6a.js";
-import { t as computeDimensionOfText } from "./chunk-JA3XYJ7Z-iN-ePWJa.js";
+import "./path-DIzMdTua.js";
+import "./math-kvEWD7RZ.js";
+import "./array-vD2Vw0bk.js";
+import "./step-Bixovd6W.js";
+import { t as line_default } from "./line-Bm50ongk.js";
+import { i as cleanAndMerge } from "./chunk-S3R3BYOJ-D8svDLcB.js";
+import { n as initRange } from "./init-BsH2JjGd.js";
+import "./timer-Dde4NBPL.js";
+import { i as log, r as __name } from "./src-DopHipf8.js";
+import { B as setAccTitle, C as getDiagramTitle, I as sanitizeText, T as getThemeVariables3, U as setDiagramTitle, _ as getAccDescription, a as clear, c as configureSvgSize, d as defaultConfig_default, v as getAccTitle, y as getConfig, z as setAccDescription } from "./chunk-ABZYJK2D-ChhHEVnH.js";
+import { t as selectSvgElement } from "./chunk-EXTU4WIE-5gY1kHy6.js";
+import "./dist-RsSoJ-Ow.js";
+import { t as computeDimensionOfText } from "./chunk-JA3XYJ7Z-DoOh1zwr.js";
 function band() {
   var e = ordinal().unknown(void 0), w = e.domain, T = e.range, D = 0, O = 1, k, A, j = false, M = 0, N = 0, P = 0.5;
   delete e.unknown;

package/dist/yaml-zmBXofFy.js

@@ -0,0 +1,4 @@
+import { t as yaml_default } from "./yaml-D1dcMKz3.js";
+export {
+  yaml_default as default
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marimo-team/islands",
-  "version": "0.18.0",
+  "version": "0.18.1",
   "main": "dist/main.js",
   "types": "dist/index.d.ts",
   "type": "module",
@@ -71,15 +71,15 @@
     "@radix-ui/react-dialog": "~1.1.15",
     "@radix-ui/react-dropdown-menu": "~2.1.16",
     "@radix-ui/react-icons": "~1.3.2",
-    "@radix-ui/react-label": "~2.1.7",
+    "@radix-ui/react-label": "~2.1.8",
     "@radix-ui/react-navigation-menu": "~1.2.14",
     "@radix-ui/react-popover": "~1.1.15",
-    "@radix-ui/react-progress": "~1.1.7",
+    "@radix-ui/react-progress": "~1.1.8",
     "@radix-ui/react-radio-group": "~1.3.8",
     "@radix-ui/react-scroll-area": "^1.2.10",
     "@radix-ui/react-select": "~2.2.6",
     "@radix-ui/react-slider": "~1.3.6",
-    "@radix-ui/react-slot": "~1.2.3",
+    "@radix-ui/react-slot": "~1.2.4",
     "@radix-ui/react-switch": "~1.2.6",
     "@radix-ui/react-tabs": "~1.1.13",
     "@radix-ui/react-toast": "~1.2.15",
@@ -168,7 +168,7 @@
     "typescript-memoize": "^1.1.1",
     "use-acp": "0.2.5",
     "use-resize-observer": "^9.1.0",
-    "vega-lite": "6.4.0",
+    "vega-lite": "6.3.1",
     "vega-loader": "^5.1.0",
     "vega-parser": "^7.1.0",
     "vega-tooltip": "^1.1.0",
@@ -225,7 +225,7 @@
     "@types/timestring": "^6.0.5",
     "@typescript-eslint/eslint-plugin": "^7.15.0",
     "@typescript-eslint/parser": "^7.15.0",
-    "@vitejs/plugin-react": "^5.0.4",
+    "@vitejs/plugin-react": "^5.1.1",
     "babel-plugin-react-compiler": "19.1.0-rc.3",
     "blob-polyfill": "^7.0.20220408",
     "cross-env": "^7.0.3",
@@ -249,9 +249,9 @@
     "storybook": "^9.1.16",
     "stylelint": "^16.23.1",
     "stylelint-config-standard": "^36.0.1",
-    "tailwindcss": "^4.1.15",
+    "tailwindcss": "^4.1.17",
     "vega-typings": "^2.1.0",
-    "vite": "npm:rolldown-vite@7.2.2",
+    "vite": "npm:rolldown-vite@7.2.7",
     "vite-plugin-top-level-await": "^1.6.0",
     "vite-plugin-wasm": "^3.5.0",
     "vitest": "^3.2.4"

package/src/components/chat/acp/blocks.tsx

@@ -26,6 +26,7 @@ import { JsonRpcError, mergeToolCalls } from "use-acp";
 import { z } from "zod";
 import { ReadonlyDiff } from "@/components/editor/code/readonly-diff";
 import { JsonOutput } from "@/components/editor/output/JsonOutput";
+import { MarkdownRenderer } from "@/components/markdown/markdown-renderer";
 import { Button } from "@/components/ui/button";
 import {
   Popover,
@@ -36,7 +37,6 @@ import { uniqueByTakeLast } from "@/utils/arrays";
 import { logNever } from "@/utils/assertNever";
 import { cn } from "@/utils/cn";
 import { Strings } from "@/utils/strings";
-import { MarkdownRenderer } from "../markdown-renderer";
 import { SimpleAccordion } from "./common";
 import type {
   AgentNotificationEvent,

package/src/components/chat/chat-panel.tsx

@@ -18,6 +18,7 @@ import {
 } from "lucide-react";
 import { memo, useEffect, useRef, useState } from "react";
 import useEvent from "react-use-event-hook";
+import { MarkdownRenderer } from "@/components/markdown/markdown-renderer";
 import { Button } from "@/components/ui/button";
 import {
   Select,
@@ -74,7 +75,6 @@ import {
   hasPendingToolCalls,
   isLastMessageReasoning,
 } from "./chat-utils";
-import { MarkdownRenderer } from "./markdown-renderer";
 import { ReasoningAccordion } from "./reasoning-accordion";
 import { ToolCallAccordion } from "./tool-call-accordion";
 

package/src/components/chat/reasoning-accordion.tsx

@@ -2,13 +2,13 @@
 
 import { BotMessageSquareIcon } from "lucide-react";
 import React from "react";
+import { MarkdownRenderer } from "@/components/markdown/markdown-renderer";
 import {
   Accordion,
   AccordionContent,
   AccordionItem,
   AccordionTrigger,
 } from "@/components/ui/accordion";
-import { MarkdownRenderer } from "./markdown-renderer";
 
 interface ReasoningAccordionProps {
   reasoning: string;

package/src/components/data-table/__tests__/columns.test.tsx

@@ -1,9 +1,10 @@
 /* Copyright 2024 Marimo. All rights reserved. */
 
 import { render } from "@testing-library/react";
+import { I18nProvider } from "react-aria";
 import { describe, expect, it, test } from "vitest";
 import { TooltipProvider } from "@/components/ui/tooltip";
-import { generateColumns, inferFieldTypes } from "../columns";
+import { generateColumns, inferFieldTypes, LocaleNumber } from "../columns";
 import { getMimeValues, isMimeValue, MimeCell } from "../mime-cell";
 import type { FieldTypesWithExternalType } from "../types";
 import { uniformSample } from "../uniformSample";
@@ -377,3 +378,144 @@ describe("getMimeValues", () => {
     expect(getMimeValues(values)).toBeUndefined();
   });
 });
+
+describe("LocaleNumber", () => {
+  it("should format numbers correctly for en-US locale", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={1_234_567.89} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"1,234,567.89"`);
+  });
+
+  it("should format numbers correctly for de-DE locale", () => {
+    const { container } = render(
+      <I18nProvider locale="de-DE">
+        <LocaleNumber value={1_234_567.89} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"1.234.567,89"`);
+  });
+
+  it("should format integers correctly", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={1000} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"1,000"`);
+  });
+
+  it("should format zero correctly", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={0} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"0"`);
+  });
+
+  it("should format negative numbers correctly", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={-1234.56} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"-1,234.56"`);
+  });
+
+  it("should format small decimal numbers correctly", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={0.123_456_789} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"0.123456789"`);
+  });
+
+  it("should format large numbers correctly", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={999_999_999.99} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"999,999,999.99"`);
+  });
+
+  it("should format numbers correctly for fr-FR locale", () => {
+    const { container } = render(
+      <I18nProvider locale="fr-FR">
+        <LocaleNumber value={1_234_567.89} />
+      </I18nProvider>,
+    );
+    // eslint-disable-next-line no-irregular-whitespace
+    expect(container.textContent).toMatchInlineSnapshot(`"1 234 567,89"`);
+  });
+
+  it("should format numbers correctly for ja-JP locale", () => {
+    const { container } = render(
+      <I18nProvider locale="ja-JP">
+        <LocaleNumber value={1_234_567.89} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"1,234,567.89"`);
+  });
+
+  it("should respect maximumFractionDigits based on locale", () => {
+    // Test with a number that has many decimal places
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={1.123_456_789_012_345_7} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"1.1234567890123457"`);
+  });
+
+  it("should handle very large numbers", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={123_456_789_012_345.67} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(
+      `"123,456,789,012,345.67"`,
+    );
+  });
+
+  it("should handle Infinity", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={Infinity} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"∞"`);
+  });
+
+  it("should handle negative Infinity", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={-Infinity} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"-∞"`);
+  });
+
+  it("should handle NaN", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={Number.NaN} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"NaN"`);
+  });
+
+  it("should handle numbers with scientific notation", () => {
+    const { container } = render(
+      <I18nProvider locale="en-US">
+        <LocaleNumber value={1e10} />
+      </I18nProvider>,
+    );
+    expect(container.textContent).toMatchInlineSnapshot(`"10,000,000,000"`);
+  });
+});

package/src/components/data-table/__tests__/url-detector.test.tsx

@@ -1,7 +1,7 @@
 /* Copyright 2024 Marimo. All rights reserved. */
 import { fireEvent, render, screen } from "@testing-library/react";
 import { describe, expect, it, vi } from "vitest";
-import { parseContent, UrlDetector } from "../url-detector";
+import { isMarkdown, parseContent, UrlDetector } from "../url-detector";
 
 describe("parseContent", () => {
   it("handles data URIs", () => {
@@ -167,3 +167,94 @@ describe("UrlDetector", () => {
     expect(mockStopPropagation).toHaveBeenCalled();
   });
 });
+
+describe("isMarkdown", () => {
+  it("returns true for headings", () => {
+    expect(isMarkdown("# Heading 1")).toBe(true);
+    expect(isMarkdown("## Heading 2")).toBe(true);
+    expect(isMarkdown("### Heading 3")).toBe(true);
+    expect(isMarkdown("Heading\n===")).toBe(true);
+    expect(isMarkdown("Heading\n---")).toBe(true);
+  });
+
+  it.fails("returns true for bold text", () => {
+    expect(isMarkdown("**bold**")).toBe(true);
+    expect(isMarkdown("__bold__")).toBe(true);
+  });
+
+  it.fails("returns true for italic text", () => {
+    expect(isMarkdown("*italic*")).toBe(true);
+    expect(isMarkdown("_italic_")).toBe(true);
+  });
+
+  it("returns false for inline code", () => {
+    expect(isMarkdown("`code`")).toBe(false);
+    expect(isMarkdown("Text with `inline code` in it")).toBe(false);
+  });
+
+  it("returns true for code blocks", () => {
+    expect(isMarkdown("```\ncode block\n```")).toBe(true);
+    expect(isMarkdown("```python\ndef hello():\n    pass\n```")).toBe(true);
+  });
+
+  it("returns true for lists", () => {
+    expect(isMarkdown("- item 1\n- item 2")).toBe(true);
+    expect(isMarkdown("* item 1\n* item 2")).toBe(true);
+    expect(isMarkdown("1. item 1\n2. item 2")).toBe(true);
+  });
+
+  it("returns true for blockquotes", () => {
+    expect(isMarkdown("> This is a quote")).toBe(true);
+    expect(isMarkdown("> Quote line 1\n> Quote line 2")).toBe(true);
+  });
+
+  it("returns true for horizontal rules", () => {
+    expect(isMarkdown("---")).toBe(true);
+    expect(isMarkdown("***")).toBe(true);
+    expect(isMarkdown("___")).toBe(true);
+  });
+
+  it("returns true for tables", () => {
+    expect(
+      isMarkdown("| col1 | col2 |\n|------|------|\n| val1 | val2 |"),
+    ).toBe(true);
+  });
+
+  it("returns true for HTML tags", () => {
+    expect(isMarkdown("<div>content</div>")).toBe(true);
+    expect(isMarkdown("<br />")).toBe(true);
+  });
+
+  it.fails("returns true for escaped characters", () => {
+    expect(isMarkdown("\\*not bold\\*")).toBe(true);
+    expect(isMarkdown("\\# not a heading")).toBe(true);
+  });
+
+  it("returns false for plain text", () => {
+    expect(isMarkdown("Just plain text")).toBe(false);
+    expect(isMarkdown("No markdown here")).toBe(false);
+  });
+
+  it("returns false for empty string", () => {
+    expect(isMarkdown("")).toBe(false);
+  });
+
+  it("returns false for plain URLs without markdown syntax", () => {
+    expect(isMarkdown("https://example.com")).toBe(false);
+    expect(isMarkdown("Visit https://marimo.io for more")).toBe(false);
+  });
+
+  it("returns false for plain text with numbers", () => {
+    expect(isMarkdown("123 456 789")).toBe(false);
+  });
+
+  it.fails("returns true for mixed markdown and plain text", () => {
+    expect(isMarkdown("Plain text with **bold** in it")).toBe(true);
+    expect(isMarkdown("Start with text\n\n# Then a heading")).toBe(true);
+  });
+
+  it.fails("returns true for markdown with URLs", () => {
+    expect(isMarkdown("[Link](https://example.com)")).toBe(true);
+    expect(isMarkdown("Visit [marimo](https://marimo.io)")).toBe(true);
+  });
+});

package/src/components/data-table/columns.tsx

@@ -4,7 +4,7 @@
 import { PopoverClose } from "@radix-ui/react-popover";
 import type { Column, ColumnDef } from "@tanstack/react-table";
 import { formatDate } from "date-fns";
-import { useNumberFormatter } from "react-aria";
+import { useLocale, useNumberFormatter } from "react-aria";
 import { WithLocale } from "@/core/i18n/with-locale";
 import type { DataType } from "@/core/kernel/messages";
 import type { CalculateTopKRows } from "@/plugins/impl/DataTablePlugin";
@@ -12,9 +12,11 @@ import { cn } from "@/utils/cn";
 import { type DateFormat, exactDateTime, getDateFormat } from "@/utils/dates";
 import { Logger } from "@/utils/Logger";
 import { Maps } from "@/utils/maps";
+import { maxFractionalDigits } from "@/utils/numbers";
 import { Objects } from "@/utils/objects";
 import { EmotionCacheProvider } from "../editor/output/EmotionCacheProvider";
 import { JsonOutput } from "../editor/output/JsonOutput";
+import { CopyClipboardIcon } from "../icons/copy-icon";
 import { Button } from "../ui/button";
 import { Checkbox } from "../ui/checkbox";
 import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover";
@@ -33,7 +35,7 @@ import {
   INDEX_COLUMN_NAME,
 } from "./types";
 import { uniformSample } from "./uniformSample";
-import { parseContent, UrlDetector } from "./url-detector";
+import { MarkdownUrlDetector, parseContent, UrlDetector } from "./url-detector";
 
 // Artificial limit to display long strings
 const MAX_STRING_LENGTH = 50;
@@ -332,7 +334,7 @@ const PopoutColumn = ({
     <EmotionCacheProvider container={null}>
       <Popover>
         <PopoverTrigger
-          className={cn(cellStyles, "w-fit outline-hidden")}
+          className={cn(cellStyles, "max-w-fit outline-hidden")}
           onClick={selectCell}
           onMouseDown={(e) => {
             // Prevent cell underneath from being selected
@@ -354,11 +356,18 @@ const PopoutColumn = ({
           align="start"
           alignOffset={10}
         >
-          <PopoverClose className="absolute top-2 right-2">
-            <Button variant="link" size="xs">
-              {buttonText ?? "Close"}
-            </Button>
-          </PopoverClose>
+          <div className="absolute top-2 right-2">
+            <CopyClipboardIcon
+              value={rawStringValue}
+              className="w-2.5 h-2.5"
+              tooltip={false}
+            />
+            <PopoverClose>
+              <Button variant="link" size="xs">
+                {buttonText ?? "Close"}
+              </Button>
+            </PopoverClose>
+          </div>
           {children}
         </PopoverContent>
       </Popover>
@@ -477,6 +486,8 @@ export function renderCellValue<TData, TValue>({
   const dataType = column.columnDef.meta?.dataType;
   const dtype = column.columnDef.meta?.dtype;
 
+  const isWrapped = column.getColumnWrapping?.() === "wrap";
+
   if (dataType === "datetime" && typeof value === "string") {
     try {
       const date = new Date(value);
@@ -508,10 +519,13 @@ export function renderCellValue<TData, TValue>({
       : String(renderValue());
 
     const parts = parseContent(stringValue);
-    const hasMarkup = parts.some((part) => part.type !== "text");
-    if (hasMarkup || stringValue.length < MAX_STRING_LENGTH) {
+    const allMarkup = parts.every((part) => part.type !== "text");
+    if (allMarkup || stringValue.length < MAX_STRING_LENGTH || isWrapped) {
       return (
-        <div onClick={selectCell} className={cellStyles}>
+        <div
+          onClick={selectCell}
+          className={cn(cellStyles, isWrapped && COLUMN_WRAPPING_STYLES)}
+        >
           <UrlDetector parts={parts} />
         </div>
       );
@@ -522,11 +536,11 @@ export function renderCellValue<TData, TValue>({
         cellStyles={cellStyles}
         selectCell={selectCell}
         rawStringValue={stringValue}
-        contentClassName="max-h-64 overflow-auto whitespace-pre-wrap break-words text-sm"
+        contentClassName="max-h-64 overflow-auto whitespace-pre-wrap break-words text-sm w-96"
         buttonText="X"
-        wrapped={column.getColumnWrapping?.() === "wrap"}
+        wrapped={isWrapped}
       >
-        <UrlDetector parts={parts} />
+        <MarkdownUrlDetector content={stringValue} parts={parts} />
       </PopoutColumn>
     );
   }
@@ -575,7 +589,7 @@ export function renderCellValue<TData, TValue>({
         cellStyles={cellStyles}
         selectCell={selectCell}
         rawStringValue={rawStringValue}
-        wrapped={column.getColumnWrapping?.() === "wrap"}
+        wrapped={isWrapped}
       >
         <JsonOutput data={value} format="tree" className="max-h-64" />
       </PopoutColumn>
@@ -589,7 +603,10 @@ export function renderCellValue<TData, TValue>({
   );
 }
 
-const LocaleNumber = ({ value }: { value: number }) => {
-  const format = useNumberFormatter();
+export const LocaleNumber = ({ value }: { value: number }) => {
+  const { locale } = useLocale();
+  const format = useNumberFormatter({
+    maximumFractionDigits: maxFractionalDigits(locale),
+  });
   return format.format(value);
 };

package/src/components/data-table/download-actions.tsx

@@ -12,7 +12,8 @@ import { useLocale } from "react-aria";
 import { logNever } from "@/utils/assertNever";
 import { copyToClipboard } from "@/utils/copy";
 import { downloadByURL } from "@/utils/download";
-import { jsonToTSV } from "@/utils/json/json-parser";
+import { prettyError } from "@/utils/errors";
+import { jsonParseWithSpecialChar, jsonToTSV } from "@/utils/json/json-parser";
 import { Button } from "../ui/button";
 import {
   DropdownMenu,
@@ -152,7 +153,17 @@ export const DownloadAs: React.FC<DownloadActionProps> = (props) => {
             {clipboardOptions.map((option) => (
               <DropdownMenuItem
                 key={option.label}
-                onSelect={() => handleClipboardCopy(option.format)}
+                onSelect={async () => {
+                  try {
+                    await handleClipboardCopy(option.format);
+                  } catch (error) {
+                    toast({
+                      title: "Failed to copy to clipboard",
+                      description: prettyError(error),
+                      variant: "danger",
+                    });
+                  }
+                }}
               >
                 <option.icon className="mo-dropdown-icon" />
                 <div className="flex flex-col">
@@ -171,12 +182,9 @@ export const DownloadAs: React.FC<DownloadActionProps> = (props) => {
 };
 
 function fetchJson(url: string): Promise<Record<string, unknown>[]> {
-  return fetch(url).then((res) => {
-    if (!res.ok) {
-      throw new Error(res.statusText);
-    }
-    return res.json();
-  });
+  return fetchText(url).then(
+    jsonParseWithSpecialChar<Record<string, unknown>[]>,
+  );
 }
 
 function fetchText(url: string): Promise<string> {

package/src/components/data-table/row-viewer-panel/row-viewer.tsx

@@ -18,6 +18,7 @@ import { useRef, useState } from "react";
 import { useLocale } from "react-aria";
 import { ColumnName } from "@/components/datasources/components";
 import { CopyClipboardIcon } from "@/components/icons/copy-icon";
+import { Spinner } from "@/components/icons/spinner";
 import { KeyboardHotkeys } from "@/components/shortcuts/renderShortcut";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
@@ -29,6 +30,7 @@ import {
   TableHeader,
   TableRow,
 } from "@/components/ui/table";
+import { DelayMount } from "@/components/utils/delay-mount";
 import { useAsyncData } from "@/hooks/useAsyncData";
 import { useKeydownOnElement } from "@/hooks/useHotkey";
 import { Banner, ErrorBanner } from "@/plugins/impl/common/error-banner";
@@ -136,11 +138,9 @@ export const RowViewerPanel: React.FC<RowViewerPanelProps> = ({
 
     if (!rows) {
       return (
-        <SimpleBanner
-          kind="warn"
-          Icon={AlertTriangle}
-          message="No data available. Please report the issue."
-        />
+        <DelayMount milliseconds={200}>
+          <Spinner size="medium" centered={true} />
+        </DelayMount>
       );
     }