@frontmcp/ui 0.12.2 → 1.0.0-beta.1

package/esm/renderer/maps/index.mjs

@@ -0,0 +1,217 @@
+// libs/ui/src/renderer/maps/index.ts
+import React, { useEffect as useEffect2 } from "react";
+import Box from "@mui/material/Box";
+import Alert from "@mui/material/Alert";
+import Paper from "@mui/material/Paper";
+import Typography from "@mui/material/Typography";
+import { styled } from "@mui/material/styles";
+
+// libs/ui/src/renderer/common/lazy-import.ts
+var ESM_SH_BASE = "https://esm.sh/";
+function esmShUrl(pkg, options) {
+  let url = `${ESM_SH_BASE}${pkg}`;
+  if (options?.external?.length) {
+    url += `?external=${options.external.join(",")}`;
+  }
+  return url;
+}
+function runtimeImport(specifier) {
+  const dynamicImport = new Function("s", "return import(s)");
+  return dynamicImport(specifier);
+}
+async function runtimeImportWithFallback(bareSpecifier, fallbackUrl) {
+  try {
+    return await runtimeImport(bareSpecifier);
+  } catch {
+    return runtimeImport(fallbackUrl);
+  }
+}
+function createLazyImport(moduleId, importer) {
+  let state = { status: "idle" };
+  const doImport = importer ?? (async () => {
+    const mod = await runtimeImport(moduleId);
+    return mod["default"] ?? mod;
+  });
+  return {
+    load() {
+      if (state.status === "loaded") return Promise.resolve(state.module);
+      if (state.status === "loading") return state.promise;
+      if (state.status === "error") {
+        state = { status: "idle" };
+      }
+      const promise = doImport().then(
+        (mod) => {
+          state = { status: "loaded", module: mod };
+          return mod;
+        },
+        (err) => {
+          const error = err instanceof Error ? err : new Error(`Failed to load module "${moduleId}": ${String(err)}`);
+          state = { status: "error", error };
+          throw error;
+        }
+      );
+      state = { status: "loading", promise };
+      return promise;
+    },
+    get() {
+      return state.status === "loaded" ? state.module : void 0;
+    },
+    getState() {
+      return state;
+    },
+    reset() {
+      state = { status: "idle" };
+    }
+  };
+}
+
+// libs/ui/src/renderer/common/inject-stylesheet.ts
+function injectStylesheet(href, id) {
+  if (typeof document === "undefined") return;
+  if (document.getElementById(id)) return;
+  const link = document.createElement("link");
+  link.id = id;
+  link.rel = "stylesheet";
+  link.href = href;
+  link.crossOrigin = "anonymous";
+  document.head.appendChild(link);
+}
+
+// libs/ui/src/renderer/common/use-lazy-module.ts
+import { useState, useEffect } from "react";
+function useLazyModule(lazy) {
+  const [, forceUpdate] = useState(0);
+  useEffect(() => {
+    if (lazy.getState().status === "loaded") {
+      forceUpdate((n) => n + 1);
+      return;
+    }
+    lazy.load().then(
+      () => forceUpdate((n) => n + 1),
+      () => forceUpdate((n) => n + 1)
+    );
+  }, [lazy]);
+  return lazy.get();
+}
+
+// libs/ui/src/renderer/maps/index.ts
+var LEAFLET_CSS_URL = "https://esm.sh/leaflet@1.9.4/dist/leaflet.css";
+var LEAFLET_CSS_ID = "fmcp-leaflet-css";
+var DEFAULT_TILE_URL = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png";
+var DEFAULT_ATTRIBUTION = '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors';
+var GEOJSON_TYPE_RE = /"type"\s*:\s*"(?:FeatureCollection|Feature|Point|LineString|Polygon|MultiPoint|MultiLineString|MultiPolygon|GeometryCollection)"/;
+function isMap(content) {
+  const trimmed = content.trim();
+  if (trimmed.charCodeAt(0) === 123 && GEOJSON_TYPE_RE.test(trimmed)) return true;
+  try {
+    const parsed = JSON.parse(trimmed);
+    return !!(parsed.center && Array.isArray(parsed.center) || parsed.markers && Array.isArray(parsed.markers) || parsed.geojson && typeof parsed.geojson === "object");
+  } catch {
+    return false;
+  }
+}
+var lazyReactLeaflet = createLazyImport("react-leaflet", async () => {
+  const mod = await runtimeImportWithFallback(
+    "react-leaflet",
+    esmShUrl("react-leaflet@5", { external: ["react", "react-dom"] })
+  );
+  return mod;
+});
+var MapRoot = styled(Box, {
+  name: "FrontMcpMap",
+  slot: "Root"
+})(({ theme }) => ({
+  width: "100%",
+  borderRadius: theme.shape.borderRadius,
+  overflow: "hidden",
+  border: `1px solid ${theme.palette.divider}`
+}));
+function parseMapConfig(content) {
+  const parsed = JSON.parse(content);
+  if (parsed.type && [
+    "FeatureCollection",
+    "Feature",
+    "Point",
+    "LineString",
+    "Polygon",
+    "MultiPoint",
+    "MultiLineString",
+    "MultiPolygon",
+    "GeometryCollection"
+  ].includes(parsed.type)) {
+    return {
+      center: [0, 0],
+      zoom: 2,
+      geojson: parsed
+    };
+  }
+  return parsed;
+}
+function MapView({ config, className }) {
+  useEffect2(() => {
+    injectStylesheet(LEAFLET_CSS_URL, LEAFLET_CSS_ID);
+  }, []);
+  const leaflet = useLazyModule(lazyReactLeaflet);
+  const height = config.height ?? 400;
+  const center = config.center ?? [51.505, -0.09];
+  const zoom = config.zoom ?? 13;
+  if (!leaflet) {
+    return React.createElement(Alert, { severity: "info" }, "Loading map library...");
+  }
+  const { MapContainer, TileLayer, Marker, Popup, GeoJSON } = leaflet;
+  const tileUrl = config.tileLayer?.url ?? DEFAULT_TILE_URL;
+  const attribution = config.tileLayer?.attribution ?? DEFAULT_ATTRIBUTION;
+  return React.createElement(
+    MapRoot,
+    { className },
+    config.title && React.createElement(
+      Typography,
+      { variant: "subtitle1", fontWeight: 600, sx: { p: 1.5, borderBottom: 1, borderColor: "divider" } },
+      config.title
+    ),
+    React.createElement(
+      MapContainer,
+      {
+        center,
+        zoom,
+        style: { height, width: "100%" },
+        scrollWheelZoom: true
+      },
+      React.createElement(TileLayer, { url: tileUrl, attribution }),
+      config.markers?.map(
+        (marker, i) => React.createElement(
+          Marker,
+          { key: i, position: marker.position },
+          marker.popup && React.createElement(Popup, null, React.createElement(Paper, { elevation: 0, sx: { p: 1 } }, marker.popup))
+        )
+      ),
+      config.geojson && React.createElement(GeoJSON, { data: config.geojson })
+    )
+  );
+}
+lazyReactLeaflet.load().catch(() => {
+});
+var MapsRenderer = class {
+  type = "map";
+  priority = 60;
+  canHandle(content) {
+    return isMap(content);
+  }
+  render(content, options) {
+    try {
+      const config = parseMapConfig(content);
+      return React.createElement(MapView, {
+        config,
+        className: options?.className ?? "fmcp-map-content"
+      });
+    } catch {
+      return React.createElement(Alert, { severity: "error" }, "Invalid map/GeoJSON data");
+    }
+  }
+};
+var mapsRenderer = new MapsRenderer();
+export {
+  MapsRenderer,
+  isMap,
+  mapsRenderer
+};

package/esm/renderer/math/index.mjs

@@ -0,0 +1,229 @@
+// libs/ui/src/renderer/math/index.ts
+import React, { useEffect as useEffect2, useMemo } from "react";
+import Box from "@mui/material/Box";
+import Alert from "@mui/material/Alert";
+import { styled } from "@mui/material/styles";
+
+// libs/ui/src/renderer/common/lazy-import.ts
+var ESM_SH_BASE = "https://esm.sh/";
+function esmShUrl(pkg, options) {
+  let url = `${ESM_SH_BASE}${pkg}`;
+  if (options?.external?.length) {
+    url += `?external=${options.external.join(",")}`;
+  }
+  return url;
+}
+function runtimeImport(specifier) {
+  const dynamicImport = new Function("s", "return import(s)");
+  return dynamicImport(specifier);
+}
+async function runtimeImportWithFallback(bareSpecifier, fallbackUrl) {
+  try {
+    return await runtimeImport(bareSpecifier);
+  } catch {
+    return runtimeImport(fallbackUrl);
+  }
+}
+function createLazyImport(moduleId, importer) {
+  let state = { status: "idle" };
+  const doImport = importer ?? (async () => {
+    const mod = await runtimeImport(moduleId);
+    return mod["default"] ?? mod;
+  });
+  return {
+    load() {
+      if (state.status === "loaded") return Promise.resolve(state.module);
+      if (state.status === "loading") return state.promise;
+      if (state.status === "error") {
+        state = { status: "idle" };
+      }
+      const promise = doImport().then(
+        (mod) => {
+          state = { status: "loaded", module: mod };
+          return mod;
+        },
+        (err) => {
+          const error = err instanceof Error ? err : new Error(`Failed to load module "${moduleId}": ${String(err)}`);
+          state = { status: "error", error };
+          throw error;
+        }
+      );
+      state = { status: "loading", promise };
+      return promise;
+    },
+    get() {
+      return state.status === "loaded" ? state.module : void 0;
+    },
+    getState() {
+      return state;
+    },
+    reset() {
+      state = { status: "idle" };
+    }
+  };
+}
+
+// libs/ui/src/renderer/common/inject-stylesheet.ts
+function injectStylesheet(href, id) {
+  if (typeof document === "undefined") return;
+  if (document.getElementById(id)) return;
+  const link = document.createElement("link");
+  link.id = id;
+  link.rel = "stylesheet";
+  link.href = href;
+  link.crossOrigin = "anonymous";
+  document.head.appendChild(link);
+}
+
+// libs/ui/src/renderer/common/use-lazy-module.ts
+import { useState, useEffect } from "react";
+function useLazyModule(lazy) {
+  const [, forceUpdate] = useState(0);
+  useEffect(() => {
+    if (lazy.getState().status === "loaded") {
+      forceUpdate((n) => n + 1);
+      return;
+    }
+    lazy.load().then(
+      () => forceUpdate((n) => n + 1),
+      () => forceUpdate((n) => n + 1)
+    );
+  }, [lazy]);
+  return lazy.get();
+}
+
+// libs/ui/src/renderer/math/index.ts
+var KATEX_CSS_URL = "https://esm.sh/katex@0.16.11/dist/katex.min.css";
+var KATEX_CSS_ID = "fmcp-katex-css";
+var MATH_DISPLAY = /\$\$(?:[^$]|\$(?!\$))+\$\$/s;
+var MATH_INLINE = /\$[^$\n]+?\$/;
+var MATH_BRACKET_DISPLAY = /\\\[(?:[^\\]|\\.)*\\\]/s;
+var MATH_PAREN_INLINE = /\\\((?:[^\\]|\\.)*\\\)/s;
+var MATH_BEGIN = /\\begin\{(?:equation|align|gather|matrix|pmatrix|bmatrix|cases)\}/;
+function isMath(content) {
+  const trimmed = content.trim();
+  return MATH_DISPLAY.test(trimmed) || MATH_INLINE.test(trimmed) || MATH_BRACKET_DISPLAY.test(trimmed) || MATH_PAREN_INLINE.test(trimmed) || MATH_BEGIN.test(trimmed);
+}
+var lazyKatex = createLazyImport("katex", async () => {
+  const mod = await runtimeImportWithFallback("katex", esmShUrl("katex@0.16"));
+  return mod;
+});
+var MathRoot = styled(Box, {
+  name: "FrontMcpMath",
+  slot: "Root"
+})(({ theme }) => ({
+  color: theme.palette.text.primary,
+  "& .katex-display": {
+    margin: theme.spacing(2, 0),
+    textAlign: "center"
+  }
+}));
+var MathDisplay = styled(Box, {
+  name: "FrontMcpMath",
+  slot: "Display"
+})(({ theme }) => ({
+  display: "block",
+  textAlign: "center",
+  margin: theme.spacing(2, 0),
+  fontSize: "1.2em",
+  overflow: "auto"
+}));
+var MathInline = styled("span", {
+  name: "FrontMcpMath",
+  slot: "Inline"
+})({
+  display: "inline"
+});
+function parseMathContent(source) {
+  const segments = [];
+  const mathRegex = /(\$\$(?:[^$]|\$(?!\$))+\$\$|\$[^$\n]+?\$|\\\[(?:[^\\]|\\.)*\\\]|\\\((?:[^\\]|\\.)*\\\)|\\begin\{(?:[^\\]|\\.)*\\end\{[^}]+\})/gs;
+  let lastIndex = 0;
+  let match;
+  while ((match = mathRegex.exec(source)) !== null) {
+    if (match.index > lastIndex) {
+      segments.push({ type: "text", content: source.slice(lastIndex, match.index) });
+    }
+    const raw = match[0];
+    if (raw.startsWith("$$")) {
+      segments.push({ type: "display", content: raw.slice(2, -2).trim() });
+    } else if (raw.startsWith("\\[")) {
+      segments.push({ type: "display", content: raw.slice(2, -2).trim() });
+    } else if (raw.startsWith("\\begin")) {
+      segments.push({ type: "display", content: raw });
+    } else if (raw.startsWith("\\(")) {
+      segments.push({ type: "inline", content: raw.slice(2, -2).trim() });
+    } else if (raw.startsWith("$")) {
+      segments.push({ type: "inline", content: raw.slice(1, -1).trim() });
+    }
+    lastIndex = match.index + raw.length;
+  }
+  if (lastIndex < source.length) {
+    segments.push({ type: "text", content: source.slice(lastIndex) });
+  }
+  return segments;
+}
+function MathView({ content, className }) {
+  useEffect2(() => {
+    injectStylesheet(KATEX_CSS_URL, KATEX_CSS_ID);
+  }, []);
+  const katexMod = useLazyModule(lazyKatex);
+  const segments = useMemo(() => parseMathContent(content), [content]);
+  const renderToString = katexMod?.default?.renderToString ?? katexMod?.renderToString;
+  if (!renderToString) {
+    return React.createElement(
+      MathRoot,
+      { className },
+      React.createElement("pre", { style: { fontFamily: "monospace", whiteSpace: "pre-wrap" } }, content)
+    );
+  }
+  const elements = segments.map((seg, i) => {
+    if (seg.type === "text") {
+      return React.createElement("span", { key: i }, seg.content);
+    }
+    try {
+      const html = renderToString(seg.content, {
+        displayMode: seg.type === "display",
+        throwOnError: false
+      });
+      if (seg.type === "display") {
+        return React.createElement(MathDisplay, {
+          key: i,
+          dangerouslySetInnerHTML: { __html: html }
+        });
+      }
+      return React.createElement(MathInline, {
+        key: i,
+        dangerouslySetInnerHTML: { __html: html }
+      });
+    } catch (err) {
+      return React.createElement(
+        Alert,
+        { key: i, severity: "error", sx: { my: 1 } },
+        `LaTeX error: ${err instanceof Error ? err.message : String(err)}
+Source: ${seg.content}`
+      );
+    }
+  });
+  return React.createElement(MathRoot, { className }, ...elements);
+}
+lazyKatex.load().catch(() => {
+});
+var MathRenderer = class {
+  type = "math";
+  priority = 40;
+  canHandle(content) {
+    return isMath(content);
+  }
+  render(content, options) {
+    return React.createElement(MathView, {
+      content,
+      className: options?.className ?? "fmcp-math-content"
+    });
+  }
+};
+var mathRenderer = new MathRenderer();
+export {
+  MathRenderer,
+  isMath,
+  mathRenderer
+};

package/esm/renderer/mdx/index.mjs

@@ -0,0 +1,261 @@
+// libs/ui/src/renderer/mdx/index.ts
+import React, { useMemo } from "react";
+import Box from "@mui/material/Box";
+import Typography from "@mui/material/Typography";
+import Link from "@mui/material/Link";
+import MuiTable from "@mui/material/Table";
+import TableBody from "@mui/material/TableBody";
+import TableCell from "@mui/material/TableCell";
+import TableHead from "@mui/material/TableHead";
+import TableRow from "@mui/material/TableRow";
+import { styled } from "@mui/material/styles";
+
+// libs/ui/src/renderer/common/lazy-import.ts
+var ESM_SH_BASE = "https://esm.sh/";
+function esmShUrl(pkg, options) {
+  let url = `${ESM_SH_BASE}${pkg}`;
+  if (options?.external?.length) {
+    url += `?external=${options.external.join(",")}`;
+  }
+  return url;
+}
+function runtimeImport(specifier) {
+  const dynamicImport = new Function("s", "return import(s)");
+  return dynamicImport(specifier);
+}
+async function runtimeImportWithFallback(bareSpecifier, fallbackUrl) {
+  try {
+    return await runtimeImport(bareSpecifier);
+  } catch {
+    return runtimeImport(fallbackUrl);
+  }
+}
+function createLazyImport(moduleId, importer) {
+  let state = { status: "idle" };
+  const doImport = importer ?? (async () => {
+    const mod = await runtimeImport(moduleId);
+    return mod["default"] ?? mod;
+  });
+  return {
+    load() {
+      if (state.status === "loaded") return Promise.resolve(state.module);
+      if (state.status === "loading") return state.promise;
+      if (state.status === "error") {
+        state = { status: "idle" };
+      }
+      const promise = doImport().then(
+        (mod) => {
+          state = { status: "loaded", module: mod };
+          return mod;
+        },
+        (err) => {
+          const error = err instanceof Error ? err : new Error(`Failed to load module "${moduleId}": ${String(err)}`);
+          state = { status: "error", error };
+          throw error;
+        }
+      );
+      state = { status: "loading", promise };
+      return promise;
+    },
+    get() {
+      return state.status === "loaded" ? state.module : void 0;
+    },
+    getState() {
+      return state;
+    },
+    reset() {
+      state = { status: "idle" };
+    }
+  };
+}
+
+// libs/ui/src/renderer/common/use-lazy-module.ts
+import { useState, useEffect } from "react";
+function useLazyModule(lazy) {
+  const [, forceUpdate] = useState(0);
+  useEffect(() => {
+    if (lazy.getState().status === "loaded") {
+      forceUpdate((n) => n + 1);
+      return;
+    }
+    lazy.load().then(
+      () => forceUpdate((n) => n + 1),
+      () => forceUpdate((n) => n + 1)
+    );
+  }, [lazy]);
+  return lazy.get();
+}
+
+// libs/ui/src/renderer/mdx/index.ts
+var lazyReactMarkdown = createLazyImport(
+  "react-markdown",
+  async () => {
+    const mod = await runtimeImportWithFallback(
+      "react-markdown",
+      esmShUrl("react-markdown@9", { external: ["react", "react-dom"] })
+    );
+    return mod;
+  }
+);
+var lazyRemarkGfm = createLazyImport("remark-gfm", async () => {
+  const mod = await runtimeImportWithFallback("remark-gfm", esmShUrl("remark-gfm@4"));
+  return mod;
+});
+var lazyRehypeHighlight = createLazyImport("rehype-highlight", async () => {
+  const mod = await runtimeImportWithFallback("rehype-highlight", esmShUrl("rehype-highlight@7"));
+  return mod;
+});
+var lazyRehypeRaw = createLazyImport("rehype-raw", async () => {
+  const mod = await runtimeImportWithFallback("rehype-raw", esmShUrl("rehype-raw@7"));
+  return mod;
+});
+var MarkdownRoot = styled(Box, {
+  name: "FrontMcpMarkdown",
+  slot: "Root"
+})(() => ({
+  lineHeight: 1.7,
+  "& > *:first-of-type": { marginTop: 0 },
+  "& > *:last-child": { marginBottom: 0 },
+  "& img": { maxWidth: "100%", height: "auto" }
+}));
+var CodeBlock = styled("pre", {
+  name: "FrontMcpMarkdown",
+  slot: "Code"
+})(({ theme }) => {
+  const monoFont = String(
+    theme.typography["monoFontFamily"] ?? '"SF Mono", "Fira Code", "Roboto Mono", monospace'
+  );
+  return {
+    backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[900] : theme.palette.grey[100],
+    padding: theme.spacing(2),
+    borderRadius: Number(theme.shape.borderRadius),
+    overflow: "auto",
+    fontFamily: monoFont,
+    fontSize: "0.875rem",
+    "& code": {
+      backgroundColor: "transparent",
+      padding: 0,
+      fontSize: "inherit",
+      fontFamily: "inherit"
+    }
+  };
+});
+var InlineCode = styled("code")(({ theme }) => {
+  const monoFont = String(
+    theme.typography["monoFontFamily"] ?? '"SF Mono", "Fira Code", "Roboto Mono", monospace'
+  );
+  return {
+    backgroundColor: theme.palette.mode === "dark" ? theme.palette.grey[800] : theme.palette.grey[200],
+    padding: "2px 6px",
+    borderRadius: Number(theme.shape.borderRadius) / 2,
+    fontFamily: monoFont,
+    fontSize: "0.85em"
+  };
+});
+var Blockquote = styled("blockquote", {
+  name: "FrontMcpMarkdown",
+  slot: "Blockquote"
+})(({ theme }) => ({
+  borderLeft: `4px solid ${theme.palette.primary.main}`,
+  margin: theme.spacing(2, 0),
+  padding: theme.spacing(1, 2),
+  color: theme.palette.text.secondary,
+  "& > p": { margin: 0 }
+}));
+function createMuiComponents() {
+  return {
+    h1: (props) => React.createElement(Typography, { ...props, variant: "h4", gutterBottom: true }),
+    h2: (props) => React.createElement(Typography, { ...props, variant: "h5", gutterBottom: true }),
+    h3: (props) => React.createElement(Typography, { ...props, variant: "h6", gutterBottom: true }),
+    h4: (props) => React.createElement(Typography, { ...props, variant: "subtitle1", gutterBottom: true, fontWeight: 600 }),
+    h5: (props) => React.createElement(Typography, { ...props, variant: "subtitle2", gutterBottom: true }),
+    h6: (props) => React.createElement(Typography, { ...props, variant: "subtitle2", gutterBottom: true }),
+    p: (props) => React.createElement(Typography, { ...props, variant: "body1", paragraph: true }),
+    a: (props) => React.createElement(Link, { ...props, target: "_blank", rel: "noopener noreferrer" }),
+    blockquote: (props) => React.createElement(Blockquote, props),
+    pre: (props) => React.createElement(CodeBlock, props),
+    code: ({ inline, className, children, ...rest }) => {
+      if (inline) return React.createElement(InlineCode, rest, children);
+      return React.createElement("code", { className, ...rest }, children);
+    },
+    table: (props) => React.createElement(MuiTable, { ...props, size: "small" }),
+    thead: (props) => React.createElement(TableHead, props),
+    tbody: (props) => React.createElement(TableBody, props),
+    tr: (props) => React.createElement(TableRow, { ...props, hover: true }),
+    th: (props) => React.createElement(TableCell, { ...props, sx: { fontWeight: 600 } }),
+    td: (props) => React.createElement(TableCell, props)
+  };
+}
+function MarkdownView({ content, className }) {
+  const components = useMemo(() => createMuiComponents(), []);
+  const ReactMarkdownMod = useLazyModule(lazyReactMarkdown);
+  const remarkGfmMod = lazyRemarkGfm.get();
+  const rehypeHighlightMod = lazyRehypeHighlight.get();
+  const rehypeRawMod = lazyRehypeRaw.get();
+  if (ReactMarkdownMod) {
+    const ReactMarkdown = ReactMarkdownMod.default;
+    const remarkPlugins = [];
+    const rehypePlugins = [];
+    if (remarkGfmMod) remarkPlugins.push(remarkGfmMod.default);
+    if (rehypeHighlightMod) rehypePlugins.push(rehypeHighlightMod.default);
+    if (rehypeRawMod) rehypePlugins.push(rehypeRawMod.default);
+    return React.createElement(
+      MarkdownRoot,
+      { className },
+      React.createElement(ReactMarkdown, {
+        children: content,
+        remarkPlugins,
+        rehypePlugins,
+        components
+      })
+    );
+  }
+  return React.createElement(MarkdownRoot, { className }, ...renderFallback(content));
+}
+function renderFallback(content) {
+  const lines = content.split("\n");
+  const elements = [];
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+    if (line.startsWith("# ")) {
+      elements.push(React.createElement(Typography, { key: i, variant: "h4", gutterBottom: true }, line.slice(2)));
+    } else if (line.startsWith("## ")) {
+      elements.push(React.createElement(Typography, { key: i, variant: "h5", gutterBottom: true }, line.slice(3)));
+    } else if (line.startsWith("### ")) {
+      elements.push(React.createElement(Typography, { key: i, variant: "h6", gutterBottom: true }, line.slice(4)));
+    } else if (line.startsWith("- ") || line.startsWith("* ")) {
+      elements.push(React.createElement("li", { key: i }, line.slice(2)));
+    } else if (line.startsWith("**") && line.endsWith("**")) {
+      elements.push(React.createElement(Typography, { key: i, variant: "body1", fontWeight: 700 }, line.slice(2, -2)));
+    } else if (line.trim()) {
+      elements.push(React.createElement(Typography, { key: i, variant: "body1", paragraph: true }, line));
+    }
+  }
+  return elements;
+}
+lazyReactMarkdown.load().catch(() => {
+});
+lazyRemarkGfm.load().catch(() => {
+});
+lazyRehypeHighlight.load().catch(() => {
+});
+lazyRehypeRaw.load().catch(() => {
+});
+var MdxRenderer = class {
+  type = "mdx";
+  priority = 5;
+  canHandle(content) {
+    return /^---\s*\n/.test(content) || /import\s+/.test(content) || /<[A-Z]/.test(content) || /^#{1,6}\s+\S/m.test(content) || /^\s*[-*+]\s+\S/m.test(content);
+  }
+  render(content, options) {
+    return React.createElement(MarkdownView, {
+      content,
+      className: options?.className ?? "fmcp-mdx-content"
+    });
+  }
+};
+var mdxRenderer = new MdxRenderer();
+export {
+  MdxRenderer,
+  mdxRenderer
+};