@ai-matrx/rich-content 0.2.4 → 0.2.7

package/dist/code-block/LanguageDisplay.js

@@ -0,0 +1,279 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  FileCode,
+  Coffee,
+  Hash,
+  Globe,
+  File,
+  Code2,
+  Terminal,
+  FileText,
+  Braces,
+  GitCompare
+} from "lucide-react";
+import { cn } from "@ai-matrx/design-system";
+import {
+  SiKotlin,
+  SiSwift,
+  SiDocker,
+  SiGraphql,
+  SiRuby,
+  SiGo,
+  SiRust,
+  SiR
+} from "react-icons/si";
+import { SiJavascript } from "react-icons/si";
+import { SiTypescript } from "react-icons/si";
+import { PiFileSqlBold } from "react-icons/pi";
+import { TwoColorPythonIcon } from "../utils/lifted/custom-icons.js";
+const DEFAULT_ICON_SIZE = 18;
+const MOBILE_ICON_SIZE = 14;
+const languageMap = {
+  code: {
+    name: "Code",
+    icon: (props) => /* @__PURE__ */ jsx(Code2, { ...props }),
+    color: "text-blue-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  diff: {
+    name: "Diff",
+    icon: (props) => /* @__PURE__ */ jsx(GitCompare, { ...props }),
+    color: "text-emerald-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  javascript: {
+    name: "JavaScript",
+    icon: (props) => /* @__PURE__ */ jsx(SiJavascript, { ...props }),
+    color: "text-yellow-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  typescript: {
+    name: "TypeScript",
+    icon: (props) => /* @__PURE__ */ jsx(SiTypescript, { ...props }),
+    color: "text-blue-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  jsx: {
+    name: "JavaScript",
+    icon: (props) => /* @__PURE__ */ jsx(SiJavascript, { ...props }),
+    color: "text-yellow-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  tsx: {
+    name: "TypeScript",
+    icon: (props) => /* @__PURE__ */ jsx(SiTypescript, { ...props }),
+    color: "text-blue-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  python: {
+    name: "Python",
+    icon: () => /* @__PURE__ */ jsx(TwoColorPythonIcon, {}),
+    // Python icon already has perfect size
+    color: "text-green-500",
+    size: null
+    // null means use the icon's default size
+  },
+  java: {
+    name: "Java",
+    icon: (props) => /* @__PURE__ */ jsx(Coffee, { ...props }),
+    color: "text-red-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  csharp: {
+    name: "C#",
+    icon: (props) => /* @__PURE__ */ jsx(Hash, { ...props }),
+    color: "text-purple-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  cpp: {
+    name: "C++",
+    icon: (props) => /* @__PURE__ */ jsx(Code2, { ...props }),
+    color: "text-blue-600",
+    size: DEFAULT_ICON_SIZE
+  },
+  sql: {
+    name: "SQL",
+    icon: (props) => /* @__PURE__ */ jsx(PiFileSqlBold, { ...props }),
+    color: "text-orange-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  html: {
+    name: "HTML",
+    icon: (props) => /* @__PURE__ */ jsx(Globe, { ...props }),
+    color: "text-orange-600",
+    size: DEFAULT_ICON_SIZE
+  },
+  css: {
+    name: "CSS",
+    icon: (props) => /* @__PURE__ */ jsx(FileCode, { ...props }),
+    color: "text-blue-400",
+    size: DEFAULT_ICON_SIZE
+  },
+  php: {
+    name: "PHP",
+    icon: (props) => /* @__PURE__ */ jsx(File, { ...props }),
+    color: "text-indigo-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  bash: {
+    name: "Bash",
+    icon: (props) => /* @__PURE__ */ jsx(Terminal, { ...props }),
+    color: "text-green-600",
+    size: DEFAULT_ICON_SIZE
+  },
+  shell: {
+    name: "Shell",
+    icon: (props) => /* @__PURE__ */ jsx(Terminal, { ...props }),
+    color: "text-gray-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  powershell: {
+    name: "PowerShell",
+    icon: (props) => /* @__PURE__ */ jsx(Terminal, { ...props }),
+    color: "text-blue-700",
+    size: DEFAULT_ICON_SIZE
+  },
+  ruby: {
+    name: "Ruby",
+    icon: (props) => /* @__PURE__ */ jsx(SiRuby, { ...props }),
+    color: "text-red-600",
+    size: DEFAULT_ICON_SIZE
+  },
+  go: {
+    name: "Go",
+    icon: (props) => /* @__PURE__ */ jsx(SiGo, { ...props }),
+    color: "text-cyan-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  rust: {
+    name: "Rust",
+    icon: (props) => /* @__PURE__ */ jsx(SiRust, { ...props }),
+    color: "text-orange-700",
+    size: DEFAULT_ICON_SIZE
+  },
+  json: {
+    name: "JSON",
+    icon: (props) => /* @__PURE__ */ jsx(Braces, { ...props }),
+    color: "text-yellow-600",
+    size: DEFAULT_ICON_SIZE
+  },
+  yaml: {
+    name: "YAML",
+    icon: (props) => /* @__PURE__ */ jsx(FileText, { ...props }),
+    color: "text-purple-400",
+    size: DEFAULT_ICON_SIZE
+  },
+  xml: {
+    name: "XML",
+    icon: (props) => /* @__PURE__ */ jsx(FileCode, { ...props }),
+    color: "text-blue-300",
+    size: DEFAULT_ICON_SIZE
+  },
+  markdown: {
+    name: "Markdown",
+    icon: (props) => /* @__PURE__ */ jsx(FileText, { ...props }),
+    color: "text-gray-600",
+    size: DEFAULT_ICON_SIZE
+  },
+  r: {
+    name: "R",
+    icon: (props) => /* @__PURE__ */ jsx(SiR, { ...props }),
+    color: "text-blue-800",
+    size: DEFAULT_ICON_SIZE
+  },
+  swift: {
+    name: "Swift",
+    icon: (props) => /* @__PURE__ */ jsx(SiSwift, { ...props }),
+    color: "text-orange-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  kotlin: {
+    name: "Kotlin",
+    icon: (props) => /* @__PURE__ */ jsx(SiKotlin, { ...props }),
+    color: "text-purple-600",
+    size: DEFAULT_ICON_SIZE
+  },
+  docker: {
+    name: "Dockerfile",
+    icon: (props) => /* @__PURE__ */ jsx(SiDocker, { ...props }),
+    color: "text-blue-500",
+    size: DEFAULT_ICON_SIZE
+  },
+  graphql: {
+    name: "GraphQL",
+    icon: (props) => /* @__PURE__ */ jsx(SiGraphql, { ...props }),
+    color: "text-pink-600",
+    size: DEFAULT_ICON_SIZE
+  }
+};
+const LANGUAGE_ALIASES = {
+  ts: "typescript",
+  mts: "typescript",
+  cts: "typescript",
+  js: "javascript",
+  mjs: "javascript",
+  cjs: "javascript",
+  py: "python",
+  python3: "python",
+  rb: "ruby",
+  golang: "go",
+  rs: "rust",
+  cs: "csharp",
+  "c#": "csharp",
+  "c++": "cpp",
+  sh: "bash",
+  zsh: "bash",
+  console: "shell",
+  terminal: "shell",
+  ps1: "powershell",
+  pwsh: "powershell",
+  yml: "yaml",
+  md: "markdown",
+  dockerfile: "docker",
+  kt: "kotlin",
+  gql: "graphql",
+  patch: "diff",
+  udiff: "diff",
+  htm: "html"
+};
+function resolveLanguageInfo(language) {
+  const lower = language.trim().toLowerCase();
+  const key = LANGUAGE_ALIASES[lower] ?? lower;
+  const known = languageMap[key];
+  if (known) return known;
+  if (!lower || lower === "code" || lower === "text" || lower === "plaintext") {
+    return languageMap.code;
+  }
+  return { ...languageMap.code, name: language.trim() };
+}
+function getLanguageIconNode(language, compact = false, iconOverride) {
+  if (iconOverride) return iconOverride;
+  const langInfo = resolveLanguageInfo(language);
+  const Icon = langInfo.icon;
+  const size = compact ? 14 : 16;
+  if (langInfo.size === null) {
+    return /* @__PURE__ */ jsx(Icon, { className: cn(langInfo.color) });
+  }
+  return /* @__PURE__ */ jsx(Icon, { size, className: cn(langInfo.color) });
+}
+const LanguageDisplay = ({
+  language = "code",
+  className,
+  iconSize,
+  isMobile
+}) => {
+  const langInfo = resolveLanguageInfo(language);
+  const Icon = langInfo.icon;
+  const size = isMobile ? MOBILE_ICON_SIZE : iconSize || langInfo.size || DEFAULT_ICON_SIZE;
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-1.5", className), children: [
+    langInfo.size === null ? /* @__PURE__ */ jsx(Icon, { className: cn(langInfo.color) }) : /* @__PURE__ */ jsx(Icon, { size, className: cn(langInfo.color) }),
+    /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap text-sm text-neutral-800 dark:text-neutral-200 font-mono", children: langInfo.name })
+  ] });
+};
+var LanguageDisplay_default = LanguageDisplay;
+export {
+  LanguageDisplay_default as default,
+  getLanguageIconNode,
+  languageMap,
+  resolveLanguageInfo
+};

package/dist/code-block/SmallCodeEditor.d.ts

@@ -0,0 +1,30 @@
+export interface CodeEditorProps {
+    language?: string;
+    initialCode?: string;
+    path?: string;
+    onChange?: (value: string | undefined) => void;
+    runCode?: () => void;
+    mode?: "dark" | "light";
+    showFormatButton?: boolean;
+    showCopyButton?: boolean;
+    showResetButton?: boolean;
+    showWordWrapToggle?: boolean;
+    showMinimapToggle?: boolean;
+    autoFormat?: boolean;
+    defaultWordWrap?: "on" | "off";
+    height?: string;
+    readOnly?: boolean;
+    formatTrigger?: number;
+    controlledWordWrap?: "on" | "off";
+    controlledMinimap?: boolean;
+    fileExtension?: string;
+    /**
+     * Called once with the live Monaco instance when it mounts (and with `null`
+     * on unmount). Lets an owner reach the real editor — selection, cursor, and
+     * the undoable edit stack — without forking this component. Used by the
+     * Smart Code Editor to wire its surface write targets onto the SAME edit
+     * stack the user's typing uses.
+     */
+    onEditorMount?: (editor: unknown) => void;
+}
+export default function SmallCodeEditor(props: CodeEditorProps): import("react").FunctionComponentElement<CodeEditorProps>;

package/dist/code-block/SmallCodeEditor.js

@@ -0,0 +1,22 @@
+"use client";
+import { createElement } from "react";
+import { BARE_HOST_ATTR, announceBareHost, hostCapability } from "../host/registry.js";
+function PlainCodeEditor(props) {
+  return createElement("textarea", {
+    ...BARE_HOST_ATTR,
+    className: "h-full min-h-24 w-full resize-y rounded-md border border-border bg-background p-2 font-mono text-sm",
+    defaultValue: props.initialCode ?? "",
+    readOnly: props.readOnly,
+    spellCheck: false,
+    onChange: (e) => props.onChange?.(e.target.value)
+  });
+}
+function SmallCodeEditor(props) {
+  const Impl = hostCapability("app")?.SmallCodeEditor;
+  if (Impl) return createElement(Impl, props);
+  announceBareHost("app.SmallCodeEditor", "code is edited in a plain text area");
+  return createElement(PlainCodeEditor, props);
+}
+export {
+  SmallCodeEditor as default
+};

package/dist/code-block/StickyButtons.d.ts

@@ -0,0 +1,35 @@
+import React from "react";
+interface StickyButtonsProps {
+    linesCount: number;
+    isCollapsed: boolean;
+    isCopied: boolean;
+    handleCopy: (e: React.MouseEvent) => void;
+    toggleCollapse?: (e?: React.MouseEvent) => void;
+}
+/**
+ * Quick Collapse/Copy toolbar shown once the code block's own header has
+ * scrolled away. It is `position: sticky` inside the code block, so it pins to
+ * the top of whatever scroll container the block lives in (page, chat message
+ * list, window panel) — never to the viewport. A viewport-`fixed` toolbar
+ * parked itself over the (core) shell header from any scrolled panel (D153).
+ *
+ * The outer box is zero-height so it consumes no layout space; the buttons
+ * hang inside it absolutely. Sticky stops at the code block's bottom edge
+ * because the block is the sticky element's containing block.
+ *
+ * One offset is needed. `.shell-main` is pulled up by `-(--shell-header-h)` so
+ * (core) content scrolls BEHIND the transparent glass header — and any pane
+ * that fills it (`/chat`'s conversation column is `absolute inset-0` inside it)
+ * inherits that: the scrollport's top edge sits UNDER the header, not below it.
+ * So `top: 0` there would pin the toolbar right back onto the header, which is
+ * the whole defect.
+ *
+ * Rather than name the containers that do this — the first version of this fix
+ * checked for `.shell-main` and missed /chat exactly this way — measure it: how
+ * much of the fixed header actually overlaps our scrollport. Panes that start
+ * below the header overlap by nothing and get `top: 0`. Measured once when the
+ * toolbar mounts; the header is a fixed height and the scrollport's top edge
+ * does not move under it, so there is nothing to re-measure on resize.
+ */
+declare const StickyButtons: React.FC<StickyButtonsProps>;
+export default StickyButtons;

package/dist/code-block/StickyButtons.js

@@ -0,0 +1,88 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { STICKY_CHROME_SELECTOR, stickyRestInset } from "./sticky-inset.js";
+import { useEffect, useRef, useState } from "react";
+import { Copy, Check } from "lucide-react";
+import { BsChevronBarContract, BsChevronBarExpand } from "react-icons/bs";
+import { cn } from "@ai-matrx/design-system";
+const StickyButtons = ({
+  linesCount,
+  isCollapsed,
+  isCopied,
+  handleCopy,
+  toggleCollapse
+}) => {
+  const canCollapse = linesCount > 5;
+  const rootRef = useRef(null);
+  const [topInset, setTopInset] = useState(0);
+  useEffect(() => {
+    let restTop = 0;
+    let scroller = null;
+    let node = rootRef.current?.parentElement ?? null;
+    while (node) {
+      const style = getComputedStyle(node);
+      if (style.overflowY === "auto" || style.overflowY === "scroll") {
+        restTop = node.getBoundingClientRect().top + node.clientTop + (parseFloat(style.paddingTop) || 0);
+        scroller = node;
+        break;
+      }
+      node = node.parentElement;
+    }
+    const headerBottom = document.querySelector(".shell-header")?.getBoundingClientRect().bottom ?? 0;
+    const chromeHeights = Array.from(
+      (scroller ?? document).querySelectorAll(STICKY_CHROME_SELECTOR)
+    ).map((el) => el.offsetHeight);
+    setTopInset(stickyRestInset({ headerBottom, restTop, chromeHeights }));
+  }, []);
+  const buttonClass = cn(
+    "py-2 px-3 rounded-lg bg-zinc-300 dark:bg-zinc-700",
+    "text-neutral-700 dark:text-neutral-300",
+    "hover:text-neutral-900 dark:hover:text-neutral-100",
+    "hover:bg-zinc-200 dark:hover:bg-zinc-600",
+    "transition-colors shadow-sm backdrop-blur-sm",
+    "flex items-center gap-1 text-xs"
+  );
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: rootRef,
+      className: "sticky z-20 h-0",
+      style: { top: topInset },
+      children: /* @__PURE__ */ jsxs("div", { className: "absolute right-2 top-2 flex items-center space-x-2", children: [
+        canCollapse && toggleCollapse && /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: (e) => {
+              e.stopPropagation();
+              toggleCollapse(e);
+            },
+            className: buttonClass,
+            title: isCollapsed ? "Expand code" : "Collapse code",
+            children: [
+              isCollapsed ? /* @__PURE__ */ jsx(BsChevronBarExpand, { size: 16 }) : /* @__PURE__ */ jsx(BsChevronBarContract, { size: 16 }),
+              /* @__PURE__ */ jsx("span", { children: isCollapsed ? "Expand" : "Collapse" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: (e) => {
+              e.stopPropagation();
+              handleCopy(e);
+            },
+            className: buttonClass,
+            title: isCopied ? "Copied!" : "Copy code",
+            children: [
+              isCopied ? /* @__PURE__ */ jsx(Check, { size: 16 }) : /* @__PURE__ */ jsx(Copy, { size: 16 }),
+              /* @__PURE__ */ jsx("span", { children: "Copy" })
+            ]
+          }
+        )
+      ] })
+    }
+  );
+};
+var StickyButtons_default = StickyButtons;
+export {
+  StickyButtons_default as default
+};

package/dist/code-block/highlight/ShikiCodeView.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+export interface ShikiCodeViewProps {
+    code: string;
+    /** The fence language as written (`ts`, `python`, `diff`, …). */
+    language: string | undefined;
+    mode: "light" | "dark";
+    showLineNumbers?: boolean;
+    /** Number shown on the first line (fence `showLineNumbers{10}`). */
+    startLine?: number;
+    wrapLines?: boolean;
+    fontSize?: number;
+    /** 1-based source line numbers to highlight. */
+    highlightLines?: readonly number[];
+    /**
+     * "theme" paints the theme's own background (a standalone code surface);
+     * "transparent" sits on the host's surface (compact snippets, previews).
+     */
+    surface?: "theme" | "transparent";
+    /** Vertical/horizontal padding in rem (default 1 / 1). */
+    padding?: {
+        y: number;
+        x: number;
+    };
+    className?: string;
+}
+export declare function ShikiCodeView({ code, language, mode, showLineNumbers, startLine, wrapLines, fontSize, highlightLines, surface, padding, className, }: ShikiCodeViewProps): React.JSX.Element;

package/dist/code-block/highlight/ShikiCodeView.js

@@ -0,0 +1,134 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "@ai-matrx/design-system";
+import {
+  useHighlightedLines
+} from "./useHighlightedLines.js";
+const DIFF_LANGUAGES = /* @__PURE__ */ new Set(["diff", "patch", "udiff"]);
+function diffKind(text) {
+  if (text.startsWith("+++") || text.startsWith("---")) return null;
+  if (text.startsWith("+")) return "add";
+  if (text.startsWith("-")) return "remove";
+  if (text.startsWith("@@")) return "hunk";
+  return null;
+}
+const DIFF_CLASS = {
+  add: "bg-emerald-500/15 dark:bg-emerald-400/15",
+  remove: "bg-red-500/15 dark:bg-red-400/15",
+  hunk: "bg-sky-500/10 dark:bg-sky-400/10"
+};
+function plainLines(text) {
+  return text.split("\n").map((line) => line ? [{ content: line }] : []);
+}
+function mergeTail(lines, tail) {
+  if (!tail) return lines;
+  const merged = lines.map((line) => [...line]);
+  const [first, ...rest] = tail.split("\n");
+  if (first) merged[merged.length - 1].push({ content: first });
+  for (const line of rest) merged.push(line ? [{ content: line }] : []);
+  return merged;
+}
+function tokenStyle(token, mode) {
+  const color = mode === "dark" ? token.dark : token.light;
+  const style = token.fontStyle ?? 0;
+  if (!color && !style) return void 0;
+  return {
+    color,
+    fontStyle: style & 1 ? "italic" : void 0,
+    fontWeight: style & 2 ? 600 : void 0,
+    textDecoration: style & 4 ? "underline" : void 0
+  };
+}
+function ShikiCodeView({
+  code,
+  language,
+  mode,
+  showLineNumbers = false,
+  startLine = 1,
+  wrapLines = true,
+  fontSize = 12,
+  highlightLines,
+  surface = "theme",
+  padding = { y: 1, x: 1 },
+  className
+}) {
+  const highlighted = useHighlightedLines(code, language);
+  const lines = highlighted.lines && code.startsWith(highlighted.source) ? mergeTail(highlighted.lines, code.slice(highlighted.source.length)) : plainLines(code);
+  const background = surface === "transparent" ? "transparent" : highlighted.background?.[mode] ?? (mode === "dark" ? "#1e1e1e" : "#ffffff");
+  const foreground = surface === "transparent" ? void 0 : mode === "dark" ? "#d4d4d4" : "#000000";
+  const highlightSet = new Set(highlightLines ?? []);
+  const isDiff = DIFF_LANGUAGES.has((language ?? "").toLowerCase());
+  const lastNumber = startLine + lines.length - 1;
+  const gutterWidth = `${String(lastNumber).length + 1}ch`;
+  const whiteSpace = wrapLines ? "pre-wrap" : "pre";
+  return /* @__PURE__ */ jsx(
+    "pre",
+    {
+      className: cn("m-0 font-mono leading-[1.5]", className),
+      "data-language": language ?? "text",
+      style: {
+        background,
+        color: foreground,
+        fontSize: `${fontSize}px`,
+        padding: `${padding.y}rem 0`,
+        overflowX: wrapLines ? "hidden" : "auto",
+        maxWidth: "100%"
+      },
+      children: /* @__PURE__ */ jsx(
+        "code",
+        {
+          className: `language-${language ?? "text"} block`,
+          style: { minWidth: wrapLines ? void 0 : "max-content" },
+          children: lines.map((tokens, index) => {
+            const lineNumber = startLine + index;
+            const sourceLine = index + 1;
+            const text = isDiff ? tokens.map((t) => t.content).join("") : "";
+            const kind = isDiff ? diffKind(text) : null;
+            const marked = highlightSet.has(sourceLine);
+            return /* @__PURE__ */ jsxs(
+              "span",
+              {
+                "data-line": sourceLine,
+                "data-highlighted": marked || void 0,
+                "data-diff": kind ?? void 0,
+                style: { paddingInline: `${padding.x}rem` },
+                className: cn(
+                  "flex",
+                  kind && DIFF_CLASS[kind],
+                  marked && "bg-primary/10 shadow-[inset_3px_0_0_hsl(var(--primary))]"
+                ),
+                children: [
+                  showLineNumbers && /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      "aria-hidden": "true",
+                      className: "shrink-0 select-none pr-4 text-right opacity-45",
+                      style: { minWidth: gutterWidth },
+                      children: lineNumber
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: "min-w-0 flex-1",
+                      style: {
+                        whiteSpace,
+                        overflowWrap: wrapLines ? "anywhere" : "normal",
+                        minHeight: "1.5em"
+                      },
+                      children: tokens.map((token, t) => /* @__PURE__ */ jsx("span", { style: tokenStyle(token, mode), children: token.content }, t))
+                    }
+                  )
+                ]
+              },
+              index
+            );
+          })
+        }
+      )
+    }
+  );
+}
+export {
+  ShikiCodeView
+};

package/dist/code-block/highlight/shiki-highlighter.d.ts

@@ -0,0 +1,14 @@
+import { type HighlighterCore } from "shiki/core";
+export declare const SHIKI_THEME: {
+    readonly light: "matrx-light";
+    readonly dark: "matrx-dark";
+};
+/** The shared highlighter (created once, on first use). */
+export declare function getHighlighter(): Promise<HighlighterCore>;
+/**
+ * The Shiki language id for a fence language, or "text" when Shiki has no
+ * grammar for it (the block then renders as plain, readable text).
+ */
+export declare function resolveShikiLanguage(raw: string | undefined | null): string;
+/** Load a language grammar into the shared highlighter (once). */
+export declare function ensureLanguage(highlighter: HighlighterCore, language: string): Promise<void>;