@ai-matrx/rich-content 0.2.3 → 0.2.6

package/dist/display/chat-markdown/ConfigurableMarkdownContent.js

@@ -0,0 +1,649 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import React from "react";
+import MarkdownCore from "../../markdown-core/MarkdownCore.js";
+import { cn } from "@ai-matrx/design-system";
+import { Checkbox } from "@ai-matrx/design-system";
+import { PencilIcon } from "lucide-react";
+import { useState, useMemo, useEffect } from "react";
+import {
+  guardMarkdownDelimiters,
+  reportDelimiterViolations
+} from "@ai-matrx/kit/delimiter-guard";
+import { captureError } from "../../host/diagnostics.js";
+import { LinkComponent } from "../blocks/links/LinkComponent.js";
+import { InlineCopyButton } from "../../host/app-bindings.js";
+import {
+  useMediaBlob,
+  useMediaLoadRecovery
+} from "@ai-matrx/media/core";
+import { recognizeOurFileUrl } from "@ai-matrx/media/files/engine/media/our-file-sources";
+import { detectTextDirection } from "../../levels/prose/prose-prepare.js";
+import { RemoteImageGate, remoteImageHost, withImagePolicy } from "../../levels/prose/remote-image-policy.js";
+import { fileSourceToMediaRef } from "../../utils/lifted/media-refs.js";
+import { KindTextGate } from "./KindTextGate.js";
+function DurableMarkdownImg(props) {
+  const src = typeof props.src === "string" ? props.src : "";
+  return /* @__PURE__ */ jsx(RemoteImageGate, { src, alt: props.alt, children: /* @__PURE__ */ jsx(DurableMarkdownImgImpl, { ...props }) });
+}
+function DurableMarkdownImgImpl({
+  src,
+  alt,
+  className,
+  ...props
+}) {
+  const raw = typeof src === "string" ? src : null;
+  const ourFile = raw ? recognizeOurFileUrl(raw) : null;
+  const fileRef = fileSourceToMediaRef(ourFile?.source);
+  const authenticatedBlob = useMediaBlob(fileRef);
+  const effectiveSrc = fileRef ? authenticatedBlob.url : raw;
+  const { retryKey, onLoadError: onError, failed } = useMediaLoadRecovery(
+    effectiveSrc,
+    {
+      // Owned images already crossed the authenticated byte boundary before
+      // they reach the element. A blob URL cannot be repaired by refreshing
+      // the file-session cookie; blob-read failures are captured by
+      // useMediaBlob itself.
+      recoverable: false,
+      failureRef: fileRef
+    }
+  );
+  if (!effectiveSrc || failed) return null;
+  return /* @__PURE__ */ jsx(
+    "img",
+    {
+      className,
+      ...props,
+      src: effectiveSrc,
+      alt: alt || "Image",
+      referrerPolicy: remoteImageHost(effectiveSrc) ? "no-referrer" : props.referrerPolicy,
+      onError
+    },
+    retryKey
+  );
+}
+const DEFAULT_TYPOGRAPHY = {
+  fontFamily: "font-sans",
+  fontSizeLtr: "text-sm",
+  fontSizeRtl: "text-base",
+  tracking: "tracking-wide",
+  leading: "leading-relaxed"
+};
+const DEFAULT_COLORS = {
+  accent: "blue",
+  codeBgLight: "bg-blue-100",
+  codeTextLight: "text-blue-800",
+  codeBgDark: "dark:bg-blue-900/30",
+  codeTextDark: "dark:text-blue-300",
+  blockquoteBorderLight: "border-blue-200",
+  blockquoteBorderDark: "dark:border-blue-700",
+  blockquoteBgLight: "bg-blue-50",
+  blockquoteBgDark: "dark:bg-blue-950/20",
+  blockquoteTextLight: "text-gray-700",
+  blockquoteTextDark: "dark:text-gray-300",
+  emColorLight: "text-blue-600",
+  emColorDark: "dark:text-blue-400",
+  headingColor: "text-blue-500",
+  hrBorderLight: "border-gray-300",
+  hrBorderDark: "dark:border-gray-600",
+  checkboxBorderLight: "border-blue-400",
+  checkboxCheckedBgLight: "bg-blue-600",
+  editButtonColor: "text-gray-500",
+  editButtonHoverColor: "hover:text-gray-700"
+};
+const DEFAULT_SPACING = {
+  paragraphMb: "mb-2",
+  listMb: "mb-3",
+  listPl: "pl-6",
+  listItemMb: "mb-1",
+  blockquotePl: "pl-4",
+  blockquotePr: "pr-4",
+  blockquotePy: "py-3",
+  preMy: "my-3",
+  imgMy: "my-4",
+  hrMy: "my-3",
+  mathParagraphMb: "mb-4",
+  blankLineHeight: "h-[0.75em]",
+  wrapperMy: "my-2"
+};
+const DEFAULT_HEADINGS = {
+  h1: "text-2xl font-bold pt-2 mb-1 font-heading",
+  h2: "text-xl font-medium pt-1 mb-1 font-heading",
+  h3: "text-lg font-medium pt-1 mb-2 font-heading",
+  h4: "text-lg pt-2 font-medium mb-1 mt-3 font-heading"
+};
+function resolveConfig(partial) {
+  return {
+    typography: { ...DEFAULT_TYPOGRAPHY, ...partial?.typography },
+    colors: { ...DEFAULT_COLORS, ...partial?.colors },
+    spacing: { ...DEFAULT_SPACING, ...partial?.spacing },
+    headings: { ...DEFAULT_HEADINGS, ...partial?.headings },
+    wrapperClassName: partial?.wrapperClassName ?? ""
+  };
+}
+const getDirectionClasses = (direction) => direction === "rtl" ? "text-right rtl" : "text-left ltr";
+const ConfigurableMarkdownContent = (props) => /* @__PURE__ */ jsx(
+  KindTextGate,
+  {
+    component: "ConfigurableMarkdownContent",
+    content: props.content,
+    isStreamActive: props.isStreamActive,
+    imagePolicy: props.imagePolicy,
+    showSource: props.showSource,
+    showCopyButton: props.showCopyButton ?? true,
+    children: /* @__PURE__ */ jsx(ConfigurableMarkdownContentBody, { ...props })
+  }
+);
+const ConfigurableMarkdownContentBody = ({
+  content,
+  isStreamActive,
+  onEditRequest,
+  messageId,
+  showCopyButton = true,
+  styleConfig,
+  componentOverrides,
+  imagePolicy
+}) => {
+  const [isHovering, setIsHovering] = useState(false);
+  const { typography, colors, spacing, headings, wrapperClassName } = useMemo(
+    () => resolveConfig(styleConfig),
+    [styleConfig]
+  );
+  const textDirection = useMemo(() => detectTextDirection(content), [content]);
+  const directionClasses = getDirectionClasses(textDirection);
+  const getFontSize = (direction) => direction === "rtl" ? typography.fontSizeRtl : typography.fontSizeLtr;
+  const LinkWrapper = useMemo(() => {
+    if (componentOverrides?.a) return componentOverrides.a;
+    return ({ node, href, children, ...props }) => href ? /* @__PURE__ */ jsx(LinkComponent, { href, children }) : /* @__PURE__ */ jsx(Fragment, { children });
+  }, [componentOverrides?.a]);
+  const preprocessContent = (rawContent) => {
+    let processed = rawContent;
+    processed = processed.replace(/<(\/?[\w][\w-]*)([^>]*?)>/g, "&lt;$1$2&gt;");
+    processed = processed.replace(
+      /^( +)/gm,
+      (spaces) => "\xA0\xA0".repeat(spaces.length)
+    );
+    processed = processed.replace(
+      /\[(https?:\/\/[^\]\s]+)\](?!\()/g,
+      "[$1]($1)"
+    );
+    processed = processed.replace(/^(\s*)\*([ \t]+)/gm, "$1-$2");
+    processed = processed.replace(
+      /(^[ \t]*-[ \t]+[^\n]+)\n\n(\*\*\d)/gm,
+      "$1\n\n<!-- -->\n$2"
+    );
+    processed = processed.replace(/([^\n])\n---/g, "$1\n\n---");
+    processed = processed.replace(/(\*\*[^*]+\*\*)\n([^\n*\-])/g, "$1\n\n$2");
+    processed = processed.replace(
+      /([^\n])\n(\*[^*]+\*)\n([^\n])/g,
+      "$1\n\n$2\n\n$3"
+    );
+    processed = processed.replace(
+      /(\*\*[^*]+\*\*|\*[^*]+\*)\n([^\n*\s\-])/g,
+      "$1\n\n$2"
+    );
+    processed = processed.replace(
+      /(^|\n)(\s+[*-] .+)\n(?!\s*[*-]\s)([^\n\s\-#\d][^\n]*)/gm,
+      "$1$2\n\n$3"
+    );
+    processed = processed.replace(
+      /(^|\n)(- .+)\n(?!\s*[*-]\s)([^\n\s\-#\d][^\n]*)/gm,
+      "$1$2\n\n$3"
+    );
+    processed = processed.replace(
+      /(^|\n)(\d+\. .+)\n(?!\s*\d+[.)]\s)([^\n\s\-#\d][^\n]*)/gm,
+      "$1$2\n\n$3"
+    );
+    processed = processed.replace(
+      /(^|\n)(\d+\) .+)\n(?!\s*\d+[.)]\s)([^\n\s\-#\d][^\n]*)/gm,
+      "$1$2\n\n$3"
+    );
+    processed = processed.replace(/\n{2,}/g, (match) => {
+      const blankLines = Math.min(match.length - 1, 2);
+      return "\n\n" + "&nbsp;\n\n".repeat(blankLines);
+    });
+    return processed;
+  };
+  const { text: processedContent, violations: delimiterViolations } = guardMarkdownDelimiters(preprocessContent(content));
+  const delimiterViolationSignature = delimiterViolations.map((v) => `${v.reason}@${v.index}`).join("|");
+  useEffect(() => {
+    if (isStreamActive || !delimiterViolationSignature) return;
+    reportDelimiterViolations(delimiterViolations, {
+      renderPath: "ConfigurableMarkdownContent",
+      messageId,
+      capture: (input) => captureError({ ...input })
+    });
+  }, [delimiterViolationSignature, isStreamActive, messageId]);
+  const handleEdit = () => onEditRequest?.();
+  const handleMouseEnter = !isStreamActive ? () => setIsHovering(true) : void 0;
+  const handleMouseLeave = !isStreamActive ? () => setIsHovering(false) : void 0;
+  const components = useMemo(
+    () => {
+      const extractText = (children) => {
+        if (typeof children === "string") return children;
+        if (Array.isArray(children)) return children.map(extractText).join("");
+        if (children && typeof children === "object" && "props" in children && children.props && typeof children.props === "object" && "children" in children.props) {
+          return extractText(children.props.children);
+        }
+        return "";
+      };
+      return {
+        // ---- input (checkbox) ----
+        input: ({ node, type, checked, disabled, ...props }) => {
+          if (type === "checkbox") {
+            return /* @__PURE__ */ jsx(
+              Checkbox,
+              {
+                checked,
+                disabled,
+                className: "mr-2"
+              }
+            );
+          }
+          return /* @__PURE__ */ jsx("input", { type, ...props });
+        },
+        // ---- p ----
+        p: componentOverrides?.p ?? (({ node, children, ...props }) => {
+          const childArray = React.Children.toArray(children);
+          if (childArray.length === 1 && childArray[0] === "\xA0") {
+            return /* @__PURE__ */ jsx("div", { className: spacing.blankLineHeight });
+          }
+          let isMathOnly = false;
+          if (childArray.length === 1) {
+            const child = childArray[0];
+            if (child && typeof child === "object" && "props" in child && child.props && typeof child.props === "object" && "className" in child.props && typeof child.props.className === "string") {
+              isMathOnly = child.props.className.includes("katex");
+            }
+          }
+          const paragraphText = extractText(children);
+          const paragraphDirection = detectTextDirection(paragraphText);
+          const paragraphDirClasses = getDirectionClasses(paragraphDirection);
+          if (isMathOnly) {
+            return /* @__PURE__ */ jsx(
+              "p",
+              {
+                className: cn(
+                  typography.fontFamily,
+                  typography.tracking,
+                  typography.leading,
+                  "text-base text-center",
+                  spacing.mathParagraphMb
+                ),
+                ...props,
+                children
+              }
+            );
+          }
+          return /* @__PURE__ */ jsx(
+            "p",
+            {
+              className: cn(
+                typography.fontFamily,
+                typography.tracking,
+                typography.leading,
+                getFontSize(paragraphDirection),
+                spacing.paragraphMb,
+                "pl-0 ml-0",
+                paragraphDirClasses
+              ),
+              dir: paragraphDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        // ---- strong ----
+        strong: componentOverrides?.strong ?? (({ node, children, ...props }) => {
+          const isInHeading = false;
+          const boldText = extractText(children);
+          const boldDirection = detectTextDirection(boldText);
+          return /* @__PURE__ */ jsx(
+            "strong",
+            {
+              className: cn(
+                isInHeading ? "" : "font-extrabold",
+                getDirectionClasses(boldDirection)
+              ),
+              dir: boldDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        // ---- em ----
+        em: componentOverrides?.em ?? (({ node, children, ...props }) => {
+          const isInHeading = false;
+          const italicText = extractText(children);
+          const italicDirection = detectTextDirection(italicText);
+          return /* @__PURE__ */ jsx(
+            "em",
+            {
+              className: cn(
+                "italic",
+                isInHeading ? "" : cn(colors.emColorLight, colors.emColorDark),
+                getDirectionClasses(italicDirection)
+              ),
+              dir: italicDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        // ---- blockquote ----
+        blockquote: componentOverrides?.blockquote ?? (({ node, children, ...props }) => {
+          const blockquoteText = extractText(children);
+          const blockquoteDirection = detectTextDirection(blockquoteText);
+          const isRtl = blockquoteDirection === "rtl";
+          return /* @__PURE__ */ jsx(
+            "blockquote",
+            {
+              className: cn(
+                isRtl ? cn(spacing.blockquotePr, "border-r-4") : cn(spacing.blockquotePl, "border-l-4"),
+                spacing.blockquotePy,
+                colors.blockquoteBorderLight,
+                colors.blockquoteBorderDark,
+                "italic",
+                colors.blockquoteTextLight,
+                colors.blockquoteTextDark,
+                colors.blockquoteBgLight,
+                colors.blockquoteBgDark,
+                getDirectionClasses(blockquoteDirection)
+              ),
+              dir: blockquoteDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        // ---- ul ----
+        ul: componentOverrides?.ul ?? (({ node, children, ...props }) => {
+          const listText = extractText(children);
+          const listDirection = detectTextDirection(listText);
+          return /* @__PURE__ */ jsx(
+            "ul",
+            {
+              className: cn(
+                // L1 disc, L2 hollow circle, L3+ dash (depth cascade).
+                "matrx-md-ul",
+                spacing.listMb,
+                typography.leading,
+                getFontSize(listDirection),
+                spacing.listPl,
+                getDirectionClasses(listDirection)
+              ),
+              dir: listDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        // ---- ol ----
+        ol: componentOverrides?.ol ?? (({ node, children, ...props }) => {
+          const listText = extractText(children);
+          const listDirection = detectTextDirection(listText);
+          return /* @__PURE__ */ jsx(
+            "ol",
+            {
+              className: cn(
+                // L1 decimal, L2 lower-roman, L3+ lower-alpha (depth cascade).
+                "matrx-md-ol",
+                spacing.listMb,
+                typography.leading,
+                getFontSize(listDirection),
+                spacing.listPl,
+                getDirectionClasses(listDirection)
+              ),
+              dir: listDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        // ---- li ----
+        li: componentOverrides?.li ?? (({ node, children, ...props }) => {
+          const itemText = extractText(children);
+          const itemDirection = detectTextDirection(itemText);
+          const nodeClassName = node?.properties?.className;
+          const isTaskItem = Array.isArray(nodeClassName) && nodeClassName.includes("task-list-item");
+          if (isTaskItem) {
+            return /* @__PURE__ */ jsx(
+              "li",
+              {
+                className: cn(
+                  spacing.listItemMb,
+                  "flex items-center",
+                  getFontSize(itemDirection),
+                  getDirectionClasses(itemDirection)
+                ),
+                dir: itemDirection,
+                children
+              }
+            );
+          }
+          return /* @__PURE__ */ jsx(
+            "li",
+            {
+              className: cn(
+                spacing.listItemMb,
+                getFontSize(itemDirection),
+                getDirectionClasses(itemDirection)
+              ),
+              dir: itemDirection,
+              children
+            }
+          );
+        }),
+        // ---- link ----
+        a: LinkWrapper,
+        // ---- headings ----
+        h1: componentOverrides?.h1 ?? (({ node, children, ...props }) => {
+          const headingText = extractText(children);
+          const headingDirection = detectTextDirection(headingText);
+          return /* @__PURE__ */ jsx(
+            "h1",
+            {
+              className: cn(
+                headings.h1,
+                colors.headingColor,
+                getDirectionClasses(headingDirection)
+              ),
+              dir: headingDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        h2: componentOverrides?.h2 ?? (({ node, children, ...props }) => {
+          const headingText = extractText(children);
+          const headingDirection = detectTextDirection(headingText);
+          return /* @__PURE__ */ jsx(
+            "h2",
+            {
+              className: cn(
+                headings.h2,
+                colors.headingColor,
+                getDirectionClasses(headingDirection)
+              ),
+              dir: headingDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        h3: componentOverrides?.h3 ?? (({ node, children, ...props }) => {
+          const headingText = extractText(children);
+          const headingDirection = detectTextDirection(headingText);
+          return /* @__PURE__ */ jsx(
+            "h3",
+            {
+              className: cn(
+                headings.h3,
+                colors.headingColor,
+                getDirectionClasses(headingDirection)
+              ),
+              dir: headingDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        h4: componentOverrides?.h4 ?? (({ node, children, ...props }) => {
+          const headingText = extractText(children);
+          const headingDirection = detectTextDirection(headingText);
+          return /* @__PURE__ */ jsx(
+            "h4",
+            {
+              className: cn(
+                headings.h4,
+                colors.headingColor,
+                getDirectionClasses(headingDirection)
+              ),
+              dir: headingDirection,
+              ...props,
+              children
+            }
+          );
+        }),
+        // ---- pre ----
+        pre: componentOverrides?.pre ?? (({ node, children, ...props }) => /* @__PURE__ */ jsx("pre", { className: spacing.preMy, ...props, children })),
+        // ---- code (inline only) ----
+        code: componentOverrides?.code ?? (({ node, className, children, ...props }) => {
+          const isCodeBlock = Array.isArray(children) && children.length === 1 && typeof children[0] === "string" && children[0] === "pygame";
+          if (!isCodeBlock) {
+            return /* @__PURE__ */ jsx(
+              "code",
+              {
+                className: cn(
+                  "px-1.5 py-0 rounded font-mono text-sm font-medium",
+                  colors.codeBgLight,
+                  colors.codeTextLight,
+                  colors.codeBgDark,
+                  colors.codeTextDark,
+                  className
+                ),
+                style: { overflowWrap: "anywhere", wordBreak: "normal" },
+                ...props,
+                children
+              }
+            );
+          }
+          return null;
+        }),
+        // ---- img ----
+        img: componentOverrides?.img ?? (({ node, ...props }) => /* @__PURE__ */ jsx(
+          DurableMarkdownImg,
+          {
+            className: cn("max-w-full h-auto rounded-md", spacing.imgMy),
+            ...props,
+            alt: props.alt || "Image"
+          }
+        )),
+        // ---- hr ----
+        hr: componentOverrides?.hr ?? (({ node, ...props }) => /* @__PURE__ */ jsx(
+          "hr",
+          {
+            className: cn(
+              spacing.hrMy,
+              "border-t",
+              colors.hrBorderLight,
+              colors.hrBorderDark
+            ),
+            ...props
+          }
+        )),
+        // ---- br ----
+        br: ({ node, ...props }) => /* @__PURE__ */ jsx("br", {}),
+        // ---- div / span (pass-through) ----
+        div: ({ node, className, children, ...props }) => /* @__PURE__ */ jsx("div", { className, ...props, children }),
+        span: ({ node, className, children, ...props }) => /* @__PURE__ */ jsx("span", { className, ...props, children }),
+        // ---- tables (hidden by default, overridable) ----
+        table: componentOverrides?.table ?? (() => null),
+        thead: () => null,
+        tbody: () => null,
+        tr: () => null,
+        th: () => null,
+        td: () => null
+      };
+    },
+    // Re-derive when config or overrides change
+    [typography, colors, spacing, headings, componentOverrides, LinkWrapper]
+  );
+  const dynamicStyles = `
+    /* Center display math that appears after a line break */
+    .math-content-wrapper p > .block + .katex {
+        display: block;
+        text-align: center;
+        margin: 1em 0;
+        font-size: 1.5em;
+    }
+    /* Increase font size for standalone math paragraphs */
+    .math-content-wrapper p.text-center .katex {
+        font-size: 1.5em;
+    }
+    /* Override pre tags that contain inline code (indented text blocks) */
+    .math-content-wrapper pre:has(> code.${colors.codeBgLight.replace("bg-", "").replace("/", "\\/").replace("[", "\\[").replace("]", "\\]")}) {
+        white-space: pre-wrap;
+        word-wrap: break-word;
+        overflow-wrap: anywhere;
+        font-family: inherit;
+        background: transparent;
+        padding: 0;
+        margin: 0;
+    }
+    .math-content-wrapper pre:has(> code.${colors.codeBgLight.replace("bg-", "").replace("/", "\\/").replace("[", "\\[").replace("]", "\\]")}) > code {
+        white-space: normal;
+        display: inline;
+        overflow-wrap: anywhere;
+        word-break: normal;
+    }
+  `;
+  const rendered = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "relative group math-content-wrapper overflow-x-hidden min-w-0 break-words",
+        spacing.wrapperMy,
+        directionClasses,
+        wrapperClassName
+      ),
+      dir: textDirection,
+      onMouseEnter: handleMouseEnter,
+      onMouseLeave: handleMouseLeave,
+      children: [
+        /* @__PURE__ */ jsx("style", { dangerouslySetInnerHTML: { __html: dynamicStyles } }),
+        /* @__PURE__ */ jsx(MarkdownCore, { preset: "rich", components, children: processedContent }),
+        !isStreamActive && isHovering && /* @__PURE__ */ jsxs("div", { className: "absolute top-0 right-0 p-1 opacity-0 group-hover:opacity-100 transition-opacity duration-200", children: [
+          showCopyButton && /* @__PURE__ */ jsx(
+            InlineCopyButton,
+            {
+              markdownContent: content,
+              position: "top-right",
+              className: "mt-1 mr-1",
+              isMarkdown: true
+            }
+          ),
+          onEditRequest && /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: handleEdit,
+              className: cn(
+                "p-1 pt-6 rounded-md ml-1",
+                colors.editButtonColor,
+                colors.editButtonHoverColor
+              ),
+              title: "Edit content",
+              children: /* @__PURE__ */ jsx(PencilIcon, { className: "w-4 h-4" })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsx(Fragment, { children: withImagePolicy(imagePolicy, rendered) });
+};
+var ConfigurableMarkdownContent_default = ConfigurableMarkdownContent;
+export {
+  ConfigurableMarkdownContent,
+  DurableMarkdownImg,
+  ConfigurableMarkdownContent_default as default
+};

package/dist/display/chat-markdown/InlineCodeSnippet.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+interface InlineCodeSnippetProps {
+    code: string;
+    language?: string;
+    className?: string;
+    /**
+     * When true, `{{variable_name}}` tokens inside the code block are rendered
+     * as interactive MatrxVariableInline pills instead of plain text.
+     * The raw `code` string is still copied verbatim — only the visual display changes.
+     * Defaults to false to preserve existing behaviour everywhere else.
+     */
+    renderVariables?: boolean;
+    /** The text is still streaming — never decided as a kind here (the stream's gates own it). */
+    isStreamActive?: boolean;
+    /** A deliberate source view: kind JSON shows as code (as `CodeBlock`'s `showSource`). */
+    showSource?: boolean;
+}
+export declare const InlineCodeSnippet: React.FC<InlineCodeSnippetProps>;
+export default InlineCodeSnippet;