@bendyline/squisq-editor-react 2.1.0 → 2.3.0

package/src/codeContext/CodeContextZones.tsx

@@ -1,121 +0,0 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { createPortal } from 'react-dom';
-import { useEditorContext } from '../EditorContext';
-import { CodeContextZoneManager } from './CodeContextZoneManager';
-import { CodeContextSectionView } from './CodeContextSectionView';
-import type { ZoneSpec } from './diffContextSections';
-import type { CodeContext, CodeContextSection } from './types';
-
-/**
- * Bridges a host-supplied {@link CodeContext} onto the live Monaco editor:
- * owns a {@link CodeContextZoneManager} per editor instance, reconciles zones
- * when the context prop changes, and portals a `CodeContextSectionView` into
- * each zone's dom node. Mounted by EditorShell in code mode; also exported
- * for hosts composing a custom shell around `RawEditor`.
- */
-export function CodeContextZones({ options }: { options: CodeContext }) {
-  const { monacoEditor } = useEditorContext();
-  const [manager, setManager] = useState<CodeContextZoneManager | null>(null);
-  // Bumped whenever the zone set changes so portals rebuild.
-  const [, setZonesVersion] = useState(0);
-  // Expansion state per section id: seeded from defaultExpanded the first
-  // time an id appears; the user's toggle wins afterwards.
-  const [expandedById, setExpandedById] = useState<Record<string, boolean>>({});
-  const seenIds = useRef(new Set<string>());
-
-  useEffect(() => {
-    if (!monacoEditor) return;
-    const mgr = new CodeContextZoneManager(monacoEditor);
-    const off = mgr.onDidChangeZones(() => setZonesVersion((v) => v + 1));
-    setManager(mgr);
-    return () => {
-      off();
-      mgr.dispose();
-      setManager(null);
-    };
-  }, [monacoEditor]);
-
-  const fileTop = options.fileTop;
-  const sections = options.sections;
-
-  // Resolved render list: fileTop pinned above line 1 at ordinal 0, then the
-  // host's sections in array order.
-  const resolved = useMemo(() => {
-    const out: Array<{ spec: ZoneSpec; section: Omit<CodeContextSection, 'line'> }> = [];
-    if (fileTop) {
-      out.push({ spec: { id: fileTop.id, line: 0, ordinal: 0 }, section: fileTop });
-    }
-    sections?.forEach((s, i) => {
-      out.push({ spec: { id: s.id, line: s.line, ordinal: i + 1 }, section: s });
-    });
-    return out;
-  }, [fileTop, sections]);
-
-  useEffect(() => {
-    if (!manager) return;
-    manager.sync(resolved.map((r) => r.spec));
-    // Seed expansion defaults for ids we haven't seen before (sections can
-    // arrive after mount).
-    setExpandedById((prev) => {
-      let next: Record<string, boolean> | null = null;
-      for (const { section } of resolved) {
-        if (seenIds.current.has(section.id)) continue;
-        seenIds.current.add(section.id);
-        if (section.defaultExpanded) {
-          next = next ?? { ...prev };
-          next[section.id] = true;
-        }
-      }
-      return next ?? prev;
-    });
-  }, [manager, resolved]);
-
-  const onToggleSection = options.onToggleSection;
-  const handleToggle = useCallback(
-    (id: string) => {
-      setExpandedById((prev) => {
-        const expanded = !prev[id];
-        onToggleSection?.(id, expanded);
-        return { ...prev, [id]: expanded };
-      });
-    },
-    [onToggleSection],
-  );
-
-  const handleMeasure = useCallback(
-    (id: string, px: number) => manager?.setHeight(id, px),
-    [manager],
-  );
-
-  const handleRevealLine = useCallback(
-    (line: number) => {
-      monacoEditor?.revealLineInCenter(line);
-      monacoEditor?.setPosition({ lineNumber: line, column: 1 });
-    },
-    [monacoEditor],
-  );
-
-  if (!manager) return null;
-  return (
-    <>
-      {resolved.map(({ section }) => {
-        const domNode = manager.getDomNode(section.id);
-        if (!domNode) return null;
-        return createPortal(
-          <CodeContextSectionView
-            key={section.id}
-            section={section}
-            expanded={!!expandedById[section.id]}
-            onToggle={handleToggle}
-            linkSchemes={options.linkSchemes}
-            onLinkClick={options.onLinkClick}
-            onRevealLine={handleRevealLine}
-            onMeasure={handleMeasure}
-          />,
-          domNode,
-          section.id,
-        );
-      })}
-    </>
-  );
-}

package/src/codeContext/diffContextSections.ts

@@ -1,38 +0,0 @@
-/**
- * Pure reconciler for context-section zones. Diffs the previous resolved spec
- * list against the next by section id, so the zone layer can apply one
- * changeViewZones batch: create `add`, delete `remove`, and re-anchor `move`
- * (same id, different line or ordinal). Content-only changes are not the zone
- * layer's business — React re-renders the portal and the resize observer
- * corrects the height.
- */
-
-export interface ZoneSpec {
-  id: string;
-  /** 1-based anchor line (0 = file-top, above line 1). */
-  line: number;
-  /** Stable order among zones sharing an anchor line. */
-  ordinal: number;
-}
-
-export interface ZoneDiff {
-  add: ZoneSpec[];
-  remove: string[];
-  move: ZoneSpec[];
-}
-
-export function diffContextSections(prev: ZoneSpec[], next: ZoneSpec[]): ZoneDiff {
-  const prevById = new Map(prev.map((z) => [z.id, z]));
-  const nextIds = new Set<string>();
-  const add: ZoneSpec[] = [];
-  const move: ZoneSpec[] = [];
-  for (const spec of next) {
-    if (nextIds.has(spec.id)) continue; // duplicate id — first occurrence wins
-    nextIds.add(spec.id);
-    const before = prevById.get(spec.id);
-    if (!before) add.push(spec);
-    else if (before.line !== spec.line || before.ordinal !== spec.ordinal) move.push(spec);
-  }
-  const remove = prev.filter((z) => !nextIds.has(z.id)).map((z) => z.id);
-  return { add, remove, move };
-}

package/src/codeContext/types.ts

@@ -1,75 +0,0 @@
-/**
- * Host-supplied context sections rendered INSIDE the Monaco (raw/code)
- * surface: collapsible markdown blurbs injected above anchor lines, plus an
- * optional file-top summary. Squisq stays host-agnostic — anchors are plain
- * line numbers, ids are opaque strings, links are intercepted via callback.
- *
- * Accessibility note: Monaco marks its view-zone layer `aria-hidden`, so
- * sections are invisible to screen readers in v1.
- */
-
-/**
- * One host-supplied markdown blurb anchored above a line of the code buffer.
- * Rendered as a compact one-line strip that expands in place to the full
- * markdown body.
- */
-export interface CodeContextSection {
-  /**
-   * Stable identity used to reconcile zones across prop updates — e.g. a
-   * symbol id like 'resolveImportEdges@60'. Zones are diffed by id: same id +
-   * new line moves the zone; same id + new markdown re-renders in place; a
-   * new id creates a new zone.
-   */
-  id: string;
-  /**
-   * 1-based line the section renders ABOVE. Out-of-range values are clamped
-   * by Monaco. In editable buffers the zone rides Monaco's whitespace
-   * semantics — it shifts as lines are inserted/deleted above it and
-   * collapses onto the previous line if its anchor lines are deleted. Squisq
-   * never re-derives anchors from edits; the host re-supplies lines when it
-   * re-analyzes the file.
-   */
-  line: number;
-  /**
-   * Compact markdown for the collapsed strip. Rendered on one line (block
-   * structure flattened, overflow ellipsized). Links work here too and go
-   * through `onLinkClick`.
-   */
-  summaryMarkdown: string;
-  /**
-   * Full markdown body shown when expanded. Omit while still loading — the
-   * expanded view shows a muted loading row and fills in when a later prop
-   * update supplies it.
-   */
-  markdown?: string;
-  /** Start expanded. The user's toggle wins after first interaction. Default false. */
-  defaultExpanded?: boolean;
-}
-
-/** The full context dictionary passed to `EditorShell.codeContext`. */
-export interface CodeContext {
-  /**
-   * Section pinned above line 1 (file summary). Rendered before any line-1
-   * `sections` entry. `line` is implicit.
-   */
-  fileTop?: Omit<CodeContextSection, 'line'>;
-  /** Line-anchored sections. Array order is preserved for equal lines. */
-  sections?: CodeContextSection[];
-  /**
-   * Extra URI schemes section links may use (e.g. `['workspace-nav']`).
-   * http/https/mailto/tel are always allowed; executable schemes
-   * (javascript:, data:) are never allowed regardless.
-   */
-  linkSchemes?: readonly string[];
-  /**
-   * Intercepts link clicks inside sections, receiving the href exactly as
-   * authored in the markdown. Return `false` to let the browser's default
-   * navigation proceed; any other return (or void) suppresses it. Fragment
-   * links of the form `#L<digits>` are handled natively by squisq (reveal
-   * that line in the editor) and never reach this callback. When omitted:
-   * http(s)/mailto links open normally, custom-scheme links do nothing.
-   */
-  onLinkClick?: (href: string, meta: { sectionId: string }) => boolean | undefined;
-  /** Notified on expand/collapse — lets hosts lazy-load bodies on first expand. */
-  onToggleSection?: (sectionId: string, expanded: boolean) => void;
-}

package/src/codeSnippet/CodeSnippetExtension.ts

@@ -1,205 +0,0 @@
-/**
- * Tiptap extension for ordinary explicit-language code fences.
- *
- * The ProseMirror code block remains authoritative. This plugin hides it and
- * mounts a Monaco editor whose edits rewrite only the node's text content, so
- * fence language and source round-trip through Markdown without a parallel model.
- */
-
-import { Extension } from '@tiptap/core';
-import type { Node as PMNode } from '@tiptap/pm/model';
-import { Plugin, PluginKey, type Transaction } from '@tiptap/pm/state';
-import { Decoration, DecorationSet } from '@tiptap/pm/view';
-import type { Editor } from '@tiptap/react';
-import { createElement } from 'react';
-import { createRoot, type Root } from 'react-dom/client';
-import { CodeSnippetWidget } from './CodeSnippetWidget';
-import { isCodeSnippetFenceLanguage } from './codeSnippetLanguages';
-
-export interface CodeSnippetBlockEntry {
-  /** Synthetic session id, stable while this code block remains in the doc. */
-  id: string;
-  /** Current ProseMirror position of the `codeBlock`. */
-  pos: number;
-}
-
-export interface CodeSnippetPluginState {
-  entries: CodeSnippetBlockEntry[];
-  decorations: DecorationSet;
-  seq: number;
-}
-
-export interface CodeSnippetExtensionOptions {
-  /** When false, leave all ordinary language-tagged fences as code blocks. */
-  enabled?: boolean;
-}
-
-export const CODE_SNIPPET_KEY = new PluginKey<CodeSnippetPluginState>('squisq-code-snippet');
-
-export function isCodeSnippetNode(node: PMNode): boolean {
-  const language = (node.attrs as { language?: unknown }).language;
-  return (
-    node.type.name === 'codeBlock' &&
-    isCodeSnippetFenceLanguage(typeof language === 'string' ? language : null)
-  );
-}
-
-export function findCodeSnippetBlockPos(editor: Editor, blockId: string): number | null {
-  const state = CODE_SNIPPET_KEY.getState(editor.state);
-  return state?.entries.find((entry) => entry.id === blockId)?.pos ?? null;
-}
-
-interface WidgetRootRef {
-  root: Root;
-}
-
-function buildDecorations(
-  doc: PMNode,
-  entries: readonly CodeSnippetBlockEntry[],
-  editor: Editor,
-): DecorationSet {
-  const decorations: Decoration[] = [];
-  for (const entry of entries) {
-    const node = doc.nodeAt(entry.pos);
-    if (!node || !isCodeSnippetNode(node)) continue;
-    decorations.push(
-      Decoration.node(entry.pos, entry.pos + node.nodeSize, {
-        class: 'squisq-code-snippet-fence-hidden',
-      }),
-    );
-    const blockId = entry.id;
-    decorations.push(
-      Decoration.widget(
-        entry.pos + node.nodeSize,
-        (view) => {
-          const container = document.createElement('div');
-          container.className = 'squisq-code-snippet-widget-host';
-          container.contentEditable = 'false';
-          container.addEventListener('mousedown', (event) => event.stopPropagation());
-          container.addEventListener('keydown', (event) => event.stopPropagation());
-          const root = createRoot(container);
-          root.render(
-            createElement(CodeSnippetWidget, {
-              editor,
-              blockId,
-              host: view.dom.parentElement ?? view.dom,
-            }),
-          );
-          (
-            container as HTMLElement & { __squisqCodeSnippetRoot?: WidgetRootRef }
-          ).__squisqCodeSnippetRoot = { root };
-          return container;
-        },
-        {
-          destroy: (dom) => {
-            const ref = (dom as HTMLElement & { __squisqCodeSnippetRoot?: WidgetRootRef })
-              .__squisqCodeSnippetRoot;
-            if (ref) setTimeout(() => ref.root.unmount(), 0);
-          },
-          ignoreSelection: true,
-          key: `squisq-code-snippet-${entry.id}`,
-          side: 1,
-        },
-      ),
-    );
-  }
-  return DecorationSet.create(doc, decorations);
-}
-
-function remapEntries(
-  tr: Transaction,
-  previous: CodeSnippetPluginState,
-  doc: PMNode,
-): { entries: CodeSnippetBlockEntry[]; seq: number } {
-  const mapped = new Map<number, string>();
-  const claimed = new Set<string>();
-
-  for (const entry of previous.entries) {
-    const result = tr.mapping.mapResult(entry.pos, 1);
-    if (!result.deleted) {
-      mapped.set(result.pos, entry.id);
-      claimed.add(entry.id);
-    }
-  }
-
-  // Replacing node content can mark its opening token as replaced even though
-  // the same language-tagged code block still occupies the mapped position.
-  for (const entry of previous.entries) {
-    if (claimed.has(entry.id)) continue;
-    const result = tr.mapping.mapResult(entry.pos, 1);
-    if (mapped.has(result.pos)) continue;
-    if (doc.nodeAt(result.pos)?.type.name === 'codeBlock') {
-      mapped.set(result.pos, entry.id);
-      claimed.add(entry.id);
-    }
-  }
-
-  let seq = previous.seq;
-  const entries: CodeSnippetBlockEntry[] = [];
-  doc.descendants((node, pos) => {
-    if (node.type.name !== 'codeBlock') return;
-    if (!isCodeSnippetNode(node)) return false;
-    entries.push({ id: mapped.get(pos) ?? `code-snippet-${++seq}`, pos });
-    return false;
-  });
-  return { entries, seq };
-}
-
-function applyState(
-  tr: Transaction,
-  previous: CodeSnippetPluginState,
-  editor: Editor,
-  doc: PMNode,
-): CodeSnippetPluginState {
-  if (!tr.docChanged) return previous;
-  const { entries, seq } = remapEntries(tr, previous, doc);
-  return {
-    entries,
-    seq,
-    decorations: buildDecorations(doc, entries, editor),
-  };
-}
-
-export const CodeSnippetExtension = Extension.create<CodeSnippetExtensionOptions>({
-  name: 'squisqCodeSnippet',
-
-  addOptions() {
-    return { enabled: true };
-  },
-
-  addProseMirrorPlugins() {
-    if (this.options.enabled === false) return [];
-    const editor = this.editor as Editor;
-    return [
-      new Plugin<CodeSnippetPluginState>({
-        key: CODE_SNIPPET_KEY,
-        state: {
-          init: (_config, state) => {
-            let seq = 0;
-            const entries: CodeSnippetBlockEntry[] = [];
-            state.doc.descendants((node, pos) => {
-              if (node.type.name !== 'codeBlock') return;
-              if (!isCodeSnippetNode(node)) return false;
-              entries.push({ id: `code-snippet-${++seq}`, pos });
-              return false;
-            });
-            return {
-              entries,
-              seq,
-              decorations: buildDecorations(state.doc, entries, editor),
-            };
-          },
-          apply: (tr, previous, _oldState, newState) =>
-            applyState(tr, previous, editor, newState.doc),
-        },
-        props: {
-          decorations(state) {
-            return this.getState(state)?.decorations ?? DecorationSet.empty;
-          },
-        },
-      }),
-    ];
-  },
-});
-
-export default CodeSnippetExtension;

package/src/codeSnippet/CodeSnippetWidget.tsx

@@ -1,109 +0,0 @@
-/** Monaco inset mounted in place of an ordinary language-tagged code fence. */
-
-import { useCallback, useEffect, useState } from 'react';
-import MonacoEditor, { type OnChange } from '@monaco-editor/react';
-import type { Editor } from '@tiptap/react';
-import { Icon } from '../Icon';
-import { useMonacoLoader } from '../useMonacoLoader';
-import { replaceCodeSnippetText } from './codeSnippetCommands';
-import { useCodeSnippetData } from './codeSnippetData';
-import { codeSnippetFenceLanguageToken } from './codeSnippetLanguages';
-
-export interface CodeSnippetWidgetProps {
-  editor: Editor;
-  blockId: string;
-  host?: HTMLElement | null;
-}
-
-function schemeFromHost(host: HTMLElement | null | undefined): 'light' | 'dark' {
-  return host?.closest<HTMLElement>('[data-theme]')?.dataset.theme === 'dark' ? 'dark' : 'light';
-}
-
-function useHostColorScheme(host: HTMLElement | null | undefined): 'light' | 'dark' {
-  const [scheme, setScheme] = useState<'light' | 'dark'>(() => schemeFromHost(host));
-  useEffect(() => {
-    const themedAncestor = host?.closest<HTMLElement>('[data-theme]');
-    setScheme(schemeFromHost(host));
-    if (!themedAncestor || typeof MutationObserver === 'undefined') return;
-    const observer = new MutationObserver(() => setScheme(schemeFromHost(host)));
-    observer.observe(themedAncestor, { attributes: true, attributeFilter: ['data-theme'] });
-    return () => observer.disconnect();
-  }, [host]);
-  return scheme;
-}
-
-function useEditorEditable(editor: Editor): boolean {
-  const [editable, setEditable] = useState(editor.isEditable);
-  useEffect(() => {
-    const sync = () => setEditable(editor.isEditable);
-    editor.on('update', sync);
-    editor.on('transaction', sync);
-    return () => {
-      editor.off('update', sync);
-      editor.off('transaction', sync);
-    };
-  }, [editor]);
-  return editable;
-}
-
-export function CodeSnippetWidget({ editor, blockId, host }: CodeSnippetWidgetProps) {
-  const data = useCodeSnippetData(editor, blockId);
-  const { ready } = useMonacoLoader();
-  const colorScheme = useHostColorScheme(host);
-  const editable = useEditorEditable(editor);
-
-  const handleChange: OnChange = useCallback(
-    (value) => {
-      if (!editable) return;
-      replaceCodeSnippetText(editor, blockId, value ?? '');
-    },
-    [blockId, editable, editor],
-  );
-
-  if (!data) return null;
-  const modelSuffix = codeSnippetFenceLanguageToken(data.fenceLanguage).replace(
-    /[^a-z0-9_-]/g,
-    '-',
-  );
-
-  return (
-    <div className="squisq-code-snippet-shell" data-language={data.fenceLanguage}>
-      <div className="squisq-code-snippet-header">
-        <span className="squisq-code-snippet-title">
-          <Icon icon="fa-solid fa-file-code" />
-          <span>{data.label}</span>
-        </span>
-        <code>{`\`\`\`${data.fenceLanguage}`}</code>
-      </div>
-      <div className="squisq-code-snippet-editor" aria-label={`${data.label} code editor`}>
-        {ready ? (
-          <MonacoEditor
-            path={`inmemory://squisq/code-snippet/${blockId}.${modelSuffix || 'txt'}`}
-            language={data.monacoLanguage}
-            theme={colorScheme === 'dark' ? 'vs-dark' : 'vs'}
-            value={data.source}
-            onChange={handleChange}
-            options={{
-              automaticLayout: true,
-              contextmenu: true,
-              folding: true,
-              fontSize: 13,
-              lineNumbers: 'on',
-              minimap: { enabled: false },
-              padding: { top: 10, bottom: 10 },
-              readOnly: !editable,
-              renderLineHighlight: 'line',
-              scrollBeyondLastLine: false,
-              tabSize: 2,
-              wordWrap: 'off',
-            }}
-          />
-        ) : (
-          <div className="squisq-code-snippet-loading">Loading code editor…</div>
-        )}
-      </div>
-    </div>
-  );
-}
-
-export default CodeSnippetWidget;

package/src/codeSnippet/__tests__/CodeSnippetExtension.test.ts

@@ -1,95 +0,0 @@
-/** @vitest-environment jsdom */
-
-import { Editor } from '@tiptap/core';
-import StarterKit from '@tiptap/starter-kit';
-import { afterEach, describe, expect, it, vi } from 'vitest';
-import { markdownToTiptap, tiptapToMarkdown } from '../../tiptapBridge';
-import { replaceCodeSnippetText } from '../codeSnippetCommands';
-import {
-  CODE_SNIPPET_KEY,
-  CodeSnippetExtension,
-  findCodeSnippetBlockPos,
-} from '../CodeSnippetExtension';
-
-vi.mock('../CodeSnippetWidget', () => ({
-  CodeSnippetWidget: () => null,
-}));
-
-const editors: Editor[] = [];
-
-function makeEditor(markdown: string, enabled = true): Editor {
-  const editor = new Editor({
-    extensions: [StarterKit, CodeSnippetExtension.configure({ enabled })],
-    content: markdownToTiptap(markdown),
-  });
-  editors.push(editor);
-  return editor;
-}
-
-function entriesOf(editor: Editor) {
-  return CODE_SNIPPET_KEY.getState(editor.state)?.entries ?? [];
-}
-
-afterEach(() => {
-  for (const editor of editors) editor.destroy();
-  editors.length = 0;
-});
-
-describe('CodeSnippetExtension', () => {
-  it('claims all explicit ordinary code languages, including unknown ones', () => {
-    const editor = makeEditor(
-      '```typescript\nconst n = 1;\n```\n\n```kusto\nTable | take 5\n```\n',
-    );
-    expect(entriesOf(editor)).toHaveLength(2);
-  });
-
-  it('does not steal plain, Mermaid, diagram, tree, or timeline fences', () => {
-    const editor = makeEditor(
-      [
-        '```text\nplain\n```',
-        '```mermaid\nflowchart LR\n  a --> b\n```',
-        '```diagram\n+---+\n| A |\n+---+\n```',
-        '```tree\nsrc/\n└── index.ts\n```',
-        '```timeline\nMilestones: ● Start ─►\n```',
-        '```\nuntagged\n```',
-        '',
-      ].join('\n\n'),
-    );
-    expect(entriesOf(editor)).toHaveLength(0);
-  });
-
-  it('keeps a stable block id and rewrites only the fence body', () => {
-    const editor = makeEditor('```typescript\nconst before = true;\n```\n');
-    const [before] = entriesOf(editor);
-    editor.commands.insertContentAt(0, '<p>Intro</p>');
-    const [shifted] = entriesOf(editor);
-    expect(shifted.id).toBe(before.id);
-    expect(shifted.pos).toBeGreaterThan(before.pos);
-    expect(findCodeSnippetBlockPos(editor, before.id)).toBe(shifted.pos);
-
-    expect(replaceCodeSnippetText(editor, before.id, 'const after: number = 2;')).toBe(true);
-    expect(tiptapToMarkdown(editor.getHTML())).toContain(
-      '```typescript\nconst after: number = 2;\n```',
-    );
-  });
-
-  it('supports clearing the Monaco model without losing the fence language', () => {
-    const editor = makeEditor('```json\n{"key": true}\n```\n');
-    const [entry] = entriesOf(editor);
-    expect(replaceCodeSnippetText(editor, entry.id, '')).toBe(true);
-    const node = editor.state.doc.nodeAt(findCodeSnippetBlockPos(editor, entry.id) ?? -1);
-    expect(node?.textContent).toBe('');
-    expect(node?.attrs.language).toBe('json');
-  });
-
-  it('round-trips the language tag and source byte-for-byte', () => {
-    const markdown = '```typescript\nconst n: number = 1;\n```\n';
-    const editor = makeEditor(markdown);
-    expect(tiptapToMarkdown(editor.getHTML())).toBe(markdown);
-  });
-
-  it('can be disabled', () => {
-    const editor = makeEditor('```typescript\nconst n = 1;\n```\n', false);
-    expect(CODE_SNIPPET_KEY.getState(editor.state)).toBeUndefined();
-  });
-});

package/src/codeSnippet/__tests__/codeSnippetLanguages.test.ts

@@ -1,50 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import {
-  CODE_SNIPPET_LANGUAGES,
-  codeSnippetFenceLanguageToken,
-  codeSnippetLanguageLabel,
-  codeSnippetMarkdown,
-  isCodeSnippetFenceLanguage,
-  monacoLanguageForFence,
-} from '../codeSnippetLanguages';
-
-describe('code snippet languages', () => {
-  it('offers unique explicit fence languages', () => {
-    const languages = CODE_SNIPPET_LANGUAGES.map((entry) => entry.fenceLanguage);
-    expect(new Set(languages).size).toBe(languages.length);
-    expect(languages).toContain('typescript');
-    expect(languages).toContain('json');
-    expect(languages).toContain('python');
-  });
-
-  it('keeps specialized authored-view languages out of the Monaco inset', () => {
-    for (const language of [
-      '',
-      'text',
-      'txt',
-      'plaintext',
-      'ascii',
-      'diagram',
-      'tree',
-      'timeline',
-      'mermaid',
-    ]) {
-      expect(isCodeSnippetFenceLanguage(language), language).toBe(false);
-    }
-    expect(isCodeSnippetFenceLanguage('typescript')).toBe(true);
-    expect(isCodeSnippetFenceLanguage('kusto')).toBe(true);
-  });
-
-  it('uses the first fence token for Monaco while preserving metadata for round trips', () => {
-    expect(codeSnippetFenceLanguageToken('  json data  ')).toBe('json');
-    expect(monacoLanguageForFence('ts highlight-lines')).toBe('typescript');
-    expect(monacoLanguageForFence('yml')).toBe('yaml');
-    expect(codeSnippetLanguageLabel('csharp')).toBe('C#');
-  });
-
-  it('creates an explicit language-tagged Markdown fence', () => {
-    expect(codeSnippetMarkdown('typescript', 'const n: number = 1;')).toBe(
-      '\n```typescript\nconst n: number = 1;\n```\n',
-    );
-  });
-});