@arbidocs/react 0.5.111 → 0.5.112

package/dist/ai/CitationRenderer.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/ai/CitationRenderer.tsx"],
+  "sourcesContent": ["import React, { useMemo, useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport ReactMarkdown, { Components } from 'react-markdown'\nimport type { components } from '@arbidocs/client'\nimport { MarkMenu, returnFocusToMark, type MarkMenuItem } from '../ui/mark-menu'\nimport { cn } from '../lib/utils'\nimport { normalizeCitationMarkup } from './normalize-citations'\n\n/**\n * Presentational core of the ARBI citation renderer \u2014 promoted from the monolith\n * as the callback-injection reference for the AI family. It owns all the hard-won\n * citation behaviour (numbering, per-doc grouping, hover/active highlighting,\n * click/open flows, emphasis-safe markdown parsing) but knows NOTHING about the\n * app's store, router or React Query. Every app coupling is injected:\n *\n *  - `renderMarkdown` \u2014 the app's `MarkdownRenderer` (KaTeX / Mermaid / doc-entity\n *    pills all stay app-side; the core just hands it the citation `a` override).\n *  - `ExternalLink` \u2014 the app's confirm-before-open external-link component.\n *  - `onOpenCitation` / `onActivateChunk` \u2014 replace the two store writes that used\n *    to fire when a citation opens / a chunk card is clicked.\n *  - `useCitationState` \u2014 an injected hook the popover calls to read the reactive\n *    active-citation / viewing-passage / active-page state (kept as a hook so the\n *    subscription stays local to each popover, exactly as before \u2014 the top-level\n *    renderer never re-renders on citation state changes, so the markdown is never\n *    re-parsed mid-interaction).\n *  - `onCloseCitation` / `onDismissCitation` \u2014 the two distinct close flows.\n */\n\n// Renders markdown inline (no block wrappers) for single-line truncated display\nconst INLINE_MD_COMPONENTS = {\n  p: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  strong: ({ children }: { children?: React.ReactNode }) => (\n    <strong className=\"font-semibold\">{children}</strong>\n  ),\n  em: ({ children }: { children?: React.ReactNode }) => <em>{children}</em>,\n  code: ({ children }: { children?: React.ReactNode }) => (\n    <code className=\"font-mono\">{children}</code>\n  ),\n  a: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  ul: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  ol: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  li: ({ children }: { children?: React.ReactNode }) => <span>{children} </span>,\n  h1: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  h2: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  h3: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  h4: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  h5: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  h6: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  blockquote: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n  pre: ({ children }: { children?: React.ReactNode }) => <>{children}</>,\n}\n\n// Structural citation types, sourced from the canonical OpenAPI schema so the\n// core stays in lockstep with the app's `Chunk` / `ToolResponses` shapes.\nexport type Chunk = components['schemas']['Chunk']\nexport interface ToolResponses {\n  [docId: string]: Chunk[]\n}\n\n/** Reactive citation state the popover reads (injected as a hook by the app). */\nexport interface CitationState {\n  activeCitationKey: string | null\n  viewingPassageId: string | null\n  isOnConversationPage: boolean\n}\n\n/** Payload handed to the app when a chunk card is clicked / a citation opens. */\nexport interface ChunkActivation {\n  messageId: string\n  citationNum: string\n  chunkIds: string[]\n  chunk: Chunk\n  citationData?: ToolResponses\n}\n\n/** Renders the citation content as markdown \u2014 the app supplies its MarkdownRenderer. */\nexport type RenderMarkdown = (args: {\n  components: Partial<Components>\n  isStreaming: boolean\n  children: string\n}) => React.ReactNode\n\nexport interface CitationRendererProps {\n  content: string\n  citations?: Record<string, string[]>\n  citationData?: ToolResponses\n  className?: string\n  messageId: string\n  isStreaming?: boolean\n  // \u2500\u2500 injected app bindings \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n  renderMarkdown: RenderMarkdown\n  ExternalLink: React.ComponentType<React.ComponentPropsWithoutRef<'a'>>\n  onOpenCitation: (citationKey: string) => void\n  onActivateChunk: (activation: ChunkActivation) => void\n  useCitationState: () => CitationState\n  onCloseCitation: () => void\n  onDismissCitation: () => void\n  /** Tells the user a citation was copied (or could not be). Optional: copying is silent without it. */\n  notify?: (message: string, kind?: 'success' | 'error' | 'info') => void\n  /** Display names keyed by doc_ext_id. A chunk's `doc_title` is the raw upload name, which can\n   *  differ from the name the workspace shows; when a name is given here it is used instead. */\n  docTitles?: ReadonlyMap<string, string>\n}\n\nconst CitationRendererComponent: React.FC<CitationRendererProps> = ({\n  content,\n  citations,\n  citationData,\n  className,\n  messageId,\n  isStreaming = false,\n  renderMarkdown,\n  ExternalLink,\n  onOpenCitation,\n  onActivateChunk,\n  useCitationState,\n  onCloseCitation,\n  onDismissCitation,\n  notify,\n  docTitles,\n}) => {\n  const chunkMap = useMemo(() => {\n    const map = new Map<string, Chunk>()\n    if (citationData) {\n      Object.entries(citationData as ToolResponses).forEach(([, docChunks]) => {\n        if (docChunks && Array.isArray(docChunks)) {\n          docChunks.forEach((chunk: Chunk) => {\n            if (chunk.metadata && chunk.metadata.chunk_ext_id) {\n              const displayTitle = chunk.metadata.doc_ext_id\n                ? docTitles?.get(chunk.metadata.doc_ext_id)\n                : undefined\n              map.set(\n                chunk.metadata.chunk_ext_id,\n                displayTitle\n                  ? { ...chunk, metadata: { ...chunk.metadata, doc_title: displayTitle } }\n                  : chunk\n              )\n            }\n          })\n        }\n      })\n    }\n    return map\n  }, [citationData, docTitles])\n\n  const getChunkDetails = useCallback(\n    (chunkIds: string[]): Chunk[] =>\n      [...new Set(chunkIds)]\n        .map((id) => chunkMap.get(id))\n        .filter((c): c is Chunk => c !== undefined),\n    [chunkMap]\n  )\n\n  const handleChunkClick = useCallback(\n    (citationNum: string, chunkIds: string[], chunk: Chunk) => {\n      onActivateChunk({ messageId, citationNum, chunkIds, chunk, citationData })\n    },\n    [messageId, citationData, onActivateChunk]\n  )\n\n  // What the citation links read. It reaches them through context, not through the markdown\n  // components, so the components keep one identity and a new copy of the answer (a refetch, a\n  // cache write, new document titles) re-renders the citations instead of remounting them: a\n  // remount drops the mark an open citation dialog returns focus to.\n  const anchorContext = useMemo<CitationAnchorContextValue>(\n    () => ({\n      citations,\n      messageId,\n      isStreaming,\n      getChunkDetails,\n      handleChunkClick,\n      onOpenCitation,\n      ExternalLink,\n      useCitationState,\n      onCloseCitation,\n      onDismissCitation,\n      notify,\n    }),\n    [\n      citations,\n      messageId,\n      isStreaming,\n      getChunkDetails,\n      handleChunkClick,\n      onOpenCitation,\n      ExternalLink,\n      useCitationState,\n      onCloseCitation,\n      onDismissCitation,\n      notify,\n    ]\n  )\n\n  // Citation markers `[text](#cite-N)` are already valid markdown link syntax.\n  // We let react-markdown parse them natively (the `a` override above keys on the\n  // `#cite-` href) instead of pre-converting to raw HTML \u2014 so emphasis inside the\n  // cited text (**bold**, *italic*, `code`) and literal `*`/`_` characters survive\n  // intact, and link boundaries can never split an emphasis span.\n  return (\n    <CitationAnchorContext.Provider value={anchorContext}>\n      <div className={cn('citation-container', className)} data-testid=\"citation-renderer\">\n        {renderMarkdown({\n          components: CITATION_MARKDOWN_COMPONENTS,\n          isStreaming,\n          children: normalizeCitationMarkup(content),\n        })}\n      </div>\n    </CitationAnchorContext.Provider>\n  )\n}\n\n// \u2500\u2500 CitationAnchor \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\ninterface CitationAnchorContextValue {\n  citations?: Record<string, string[]>\n  messageId: string\n  isStreaming: boolean\n  getChunkDetails: (chunkIds: string[]) => Chunk[]\n  handleChunkClick: (citationNum: string, chunkIds: string[], chunk: Chunk) => void\n  onOpenCitation: (citationKey: string) => void\n  ExternalLink: React.ComponentType<React.ComponentPropsWithoutRef<'a'>>\n  useCitationState: () => CitationState\n  onCloseCitation: () => void\n  onDismissCitation: () => void\n  notify?: CitationRendererProps['notify']\n}\n\nconst CitationAnchorContext = React.createContext<CitationAnchorContextValue | null>(null)\n\n/** Every link in an answer: `#cite-N` is a citation, anything else a plain or external link. */\nfunction CitationAnchor({\n  href,\n  children,\n  ...rest\n}: React.ComponentPropsWithoutRef<'a'> & { node?: unknown }) {\n  // react-markdown's syntax-tree node is not a DOM attribute.\n  const { node, ...props } = rest\n  void node\n  const ctx = React.useContext(CitationAnchorContext)\n  if (!ctx || !href?.startsWith('#cite-')) {\n    if (!ctx || !href || href.startsWith('#')) {\n      return (\n        <a className=\"text-primary underline underline-offset-2\" href={href} {...props}>\n          {children}\n        </a>\n      )\n    }\n    const { ExternalLink } = ctx\n    return (\n      <ExternalLink href={href} {...props}>\n        {children}\n      </ExternalLink>\n    )\n  }\n\n  const citationNum = href.slice(6)\n  const { messageId, citations, getChunkDetails, handleChunkClick, onOpenCitation } = ctx\n  const citationKey = `${messageId}-${citationNum}`\n  const chunkIds = citations?.[citationNum] || []\n  const chunks = getChunkDetails(chunkIds)\n\n  return (\n    <CitationPopover\n      key={citationKey}\n      citationNum={citationNum}\n      messageId={messageId}\n      chunks={chunks}\n      isStreaming={ctx.isStreaming}\n      onOpen={() => onOpenCitation(citationKey)}\n      onChunkClick={(chunk) => handleChunkClick(citationNum, chunkIds, chunk)}\n      useCitationState={ctx.useCitationState}\n      onCloseCitation={ctx.onCloseCitation}\n      onDismissCitation={ctx.onDismissCitation}\n      notify={ctx.notify}\n    >\n      {children}\n    </CitationPopover>\n  )\n}\n\n/** One identity for the life of the module: see `anchorContext`. */\nconst CITATION_MARKDOWN_COMPONENTS: Partial<Components> = { a: CitationAnchor }\n\n// \u2500\u2500 CitationPopover \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\n/** Space between the docked popover and the composer below it (and the screen top above it). */\nconst DOCK_GAP_PX = 8\n\ninterface CitationPopoverProps {\n  citationNum: string\n  messageId: string\n  chunks: Chunk[]\n  isStreaming: boolean\n  onOpen: () => void\n  onChunkClick: (chunk: Chunk) => void\n  useCitationState: () => CitationState\n  onCloseCitation: () => void\n  onDismissCitation: () => void\n  notify?: CitationRendererProps['notify']\n  children: React.ReactNode\n}\n\nconst CitationPopover: React.FC<CitationPopoverProps> = ({\n  citationNum,\n  messageId,\n  chunks,\n  isStreaming,\n  onOpen,\n  onChunkClick,\n  useCitationState,\n  onCloseCitation,\n  onDismissCitation,\n  notify,\n  children,\n}) => {\n  const { activeCitationKey, viewingPassageId, isOnConversationPage } = useCitationState()\n  const isActive = activeCitationKey === `${messageId}-${citationNum}`\n  // Gate on the app's navigation state, not useLocation(): in-app navigation\n  // rewrites the hash via history.replaceState, which react-router never\n  // observes, so its location stays frozen at the page-load value.\n  const open = isActive && isOnConversationPage\n\n  // The popover belongs to the conversation view. If the user leaves it (another page, or a\n  // full-screen panel over it) while it is open, drop the active key so it neither floats over\n  // the new view nor reappears when they come back.\n  useEffect(() => {\n    if (isActive && !isOnConversationPage) onDismissCitation()\n  }, [isActive, isOnConversationPage, onDismissCitation])\n\n  const triggerRef = useRef<HTMLElement>(null)\n  const dialogRef = useRef<HTMLDivElement>(null)\n  // Set when the user closes it (Escape / the X): focus then goes back to the citation they came\n  // from. A close caused by something else (another citation, leaving the page) leaves focus alone.\n  const restoreFocusRef = useRef(false)\n\n  const dismiss = useCallback(() => {\n    restoreFocusRef.current = true\n    onDismissCitation()\n  }, [onDismissCitation])\n\n  // The popover is portalled to the end of <body>, so a keyboard or screen-reader user who\n  // opened it would otherwise have to Tab through the whole page to reach it. Move focus into the\n  // dialog on open (taps do not focus a span on iOS, so this is not gated on the trigger) and\n  // return it to the citation when the user dismisses.\n  useEffect(() => {\n    if (!open) return\n    dialogRef.current?.focus({ preventScroll: true })\n    return () => {\n      if (!restoreFocusRef.current) return\n      restoreFocusRef.current = false\n      if (triggerRef.current) returnFocusToMark(triggerRef.current)\n    }\n  }, [open])\n\n  // Escape closes like the X: the popover goes, the passage stays in the viewer.\n  useEffect(() => {\n    if (!open) return\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') dismiss()\n    }\n    document.addEventListener('keydown', onKeyDown)\n    return () => document.removeEventListener('keydown', onKeyDown)\n  }, [open, dismiss])\n\n  // The popover docks to the top edge of the composer (full chat width) instead of the cited\n  // word, so it never covers the answer paragraph being cited. The edge is measured while it is\n  // open, and again whenever the composer changes size: opening a citation also opens the document\n  // viewer, which narrows the chat column after the first measurement.\n  const [dock, setDock] = useState({ left: 0, top: 0, width: 0 })\n\n  // Measured whenever it opens, however it was opened (click, keyboard, a source chip).\n  useLayoutEffect(() => {\n    if (!open) return\n    // The composer is exactly the chat column (the main element also spans a docked viewer).\n    const edge =\n      document.querySelector('[data-testid=\"message-input-container\"]') ??\n      document.querySelector('main[data-testid^=\"conversation-\"]') ??\n      document.body\n    const measure = () => {\n      const rect = edge.getBoundingClientRect()\n      setDock({ left: rect.left, top: rect.top, width: rect.width })\n    }\n    measure()\n    const observer = new ResizeObserver(measure)\n    observer.observe(edge)\n    window.addEventListener('resize', measure)\n    return () => {\n      observer.disconnect()\n      window.removeEventListener('resize', measure)\n    }\n  }, [open])\n\n  const handleOpen = useCallback(() => {\n    onOpen()\n    if (chunks.length > 0) {\n      onChunkClick(chunks[0])\n    }\n  }, [onOpen, onChunkClick, chunks])\n\n  const byDoc = useMemo(() => {\n    const map = new Map<string, { title: string; chunks: Chunk[] }>()\n    chunks.forEach((chunk) => {\n      const docId = chunk.metadata.doc_ext_id ?? 'unknown'\n      const title = chunk.metadata.doc_title ?? docId\n      if (!map.has(docId)) map.set(docId, { title, chunks: [] })\n      map.get(docId)!.chunks.push(chunk)\n    })\n    return Array.from(map.entries()).map(([docId, val]) => ({ docId, ...val }))\n  }, [chunks])\n\n  const first = chunks[0]\n  const firstText = first ? first.content.replace(/\\n+/g, ' ').trim() : ''\n  const firstTitle = first ? (first.metadata.doc_title ?? first.metadata.doc_ext_id ?? '') : ''\n  const firstPage = first?.metadata.page_number\n\n  const copyCitation = useCallback(async () => {\n    const source = [firstTitle, firstPage != null ? `p.${firstPage}` : null]\n      .filter(Boolean)\n      .join(', ')\n    try {\n      await navigator.clipboard.writeText(source ? `\u201C${firstText}\u201D (${source})` : firstText)\n      notify?.('Citation copied', 'success')\n    } catch {\n      notify?.('Could not copy the citation', 'error')\n    }\n  }, [firstText, firstTitle, firstPage, notify])\n\n  const items: MarkMenuItem[] =\n    isStreaming || chunks.length === 0\n      ? []\n      : [\n          {\n            id: 'open',\n            label: 'Open in viewer',\n            primary: true,\n            onSelect: handleOpen,\n            testId: `citation-open-${citationNum}`,\n          },\n          {\n            id: 'copy',\n            label: 'Copy citation',\n            onSelect: () => void copyCitation(),\n            testId: `citation-copy-${citationNum}`,\n          },\n        ]\n\n  // The cited passage itself: quoted text, its source and page, before anything is opened.\n  const preview = first ? (\n    <div className=\"max-w-xs\" data-testid={`citation-preview-${citationNum}`}>\n      <span className=\"block text-xs font-medium text-foreground\">{firstTitle}</span>\n      {firstPage != null && (\n        <span className=\"block text-xs text-muted-foreground\">Page {firstPage}</span>\n      )}\n      <span className=\"mt-1 line-clamp-4 block text-sm text-foreground\">\n        <ReactMarkdown components={INLINE_MD_COMPONENTS}>{firstText}</ReactMarkdown>\n      </span>\n      {chunks.length > 1 && (\n        <span className=\"mt-1 block text-xs text-muted-foreground\">\n          +{chunks.length - 1} more passage{chunks.length > 2 ? 's' : ''}\n        </span>\n      )}\n    </div>\n  ) : undefined\n\n  return (\n    <>\n      <CitationLink\n        triggerRef={triggerRef}\n        citationNum={citationNum}\n        isActive={isActive}\n        isStreaming={isStreaming}\n        items={items}\n        preview={preview}\n      >\n        {children}\n      </CitationLink>\n      {open &&\n        createPortal(\n          <div\n            className=\"pointer-events-none fixed z-[42] flex justify-center px-2\"\n            style={{\n              left: dock.left,\n              width: dock.width,\n              bottom: window.innerHeight - dock.top + DOCK_GAP_PX,\n            }}\n          >\n            <div\n              ref={dialogRef}\n              role=\"dialog\"\n              tabIndex={-1}\n              aria-label={`Citation ${citationNum}`}\n              // Never taller than the room above the composer (it sits 8px above it, and keeps 8px\n              // from the top of the screen): on a landscape phone 45vh is more than that room, and\n              // the header rose off the top of the screen.\n              style={{ maxHeight: `min(45vh, ${Math.max(dock.top - 2 * DOCK_GAP_PX, 0)}px)` }}\n              className=\"pointer-events-auto z-[42] outline-none w-[min(100%,48rem)] min-w-0 overflow-y-auto rounded-md border border-border bg-popover p-0 text-popover-foreground shadow-xl\"\n              data-testid={`citation-popover-${citationNum}`}\n            >\n              <div className=\"px-3 py-2 pointer-coarse:py-0 border-b border-border sticky top-0 bg-popover z-10 flex items-center justify-between gap-2\">\n                <span className=\"text-xs font-semibold text-muted-foreground tracking-wide\">\n                  Citation {citationNum} ({chunks.length} passage{chunks.length !== 1 ? 's' : ''})\n                </span>\n                <button\n                  onClick={dismiss}\n                  // A bare 12px glyph is a tiny target \u2014 easy to miss, so closing takes\n                  // several tries. Pad it out to a comfortable ~28px tap area (negative\n                  // margin keeps the icon where it sat, so the header layout is\n                  // unchanged) and give it a hover background so it reads as a button.\n                  className=\"-m-1.5 flex shrink-0 items-center justify-center rounded p-1.5 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground pointer-coarse:m-0 pointer-coarse:size-11 pointer-coarse:p-0\"\n                  aria-label=\"Close\"\n                  data-testid={`citation-popover-close-${citationNum}`}\n                >\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 12 12\"\n                    fill=\"none\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                  >\n                    <path\n                      d=\"M1 1L11 11M11 1L1 11\"\n                      stroke=\"currentColor\"\n                      strokeWidth=\"1.5\"\n                      strokeLinecap=\"round\"\n                    />\n                  </svg>\n                </button>\n              </div>\n              {byDoc.map(({ docId, title, chunks: docChunks }) => (\n                <div key={docId} className=\"px-3 py-2 border-b border-border last:border-0\">\n                  <p className=\"text-sm font-semibold text-foreground mb-1 truncate\" title={title}>\n                    {title}\n                  </p>\n                  {docChunks.map((chunk) => {\n                    const isSelected = viewingPassageId === chunk.metadata.chunk_ext_id\n                    return (\n                      <button\n                        key={chunk.metadata.chunk_ext_id}\n                        data-testid={`citation-chunk-${chunk.metadata.chunk_ext_id}`}\n                        onClick={() => onChunkClick(chunk)}\n                        className={cn(\n                          'w-full text-left text-sm rounded-md px-2 py-1.5 pointer-coarse:min-h-11 pointer-coarse:py-3 transition-colors flex items-start gap-2 mb-1 last:mb-0',\n                          isSelected\n                            ? 'bg-ai-soft text-foreground ring-1 ring-ai-accent/40'\n                            : 'text-muted-foreground hover:text-primary hover:bg-muted'\n                        )}\n                      >\n                        <span className=\"min-w-0 flex-1\">\n                          {chunk.metadata.page_number != null && (\n                            <span className=\"block text-xs text-muted-foreground\">\n                              Page {chunk.metadata.page_number}\n                            </span>\n                          )}\n                          <span className=\"line-clamp-3 italic\">\n                            <ReactMarkdown components={INLINE_MD_COMPONENTS}>\n                              {chunk.content.replace(/\\n+/g, ' ').trim()}\n                            </ReactMarkdown>\n                          </span>\n                        </span>\n                      </button>\n                    )\n                  })}\n                </div>\n              ))}\n            </div>\n          </div>,\n          document.body\n        )}\n    </>\n  )\n}\n\n// \u2500\u2500 CitationLink \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\ninterface CitationLinkProps {\n  citationNum: string\n  isActive: boolean\n  isStreaming: boolean\n  items: MarkMenuItem[]\n  preview: React.ReactNode\n  triggerRef: React.Ref<HTMLElement>\n  children: React.ReactNode\n}\n\n/**\n * The cited words with a faint wash and a superscript number: quiet text, not a badge.\n * Its one menu (preview of the passage, Open in viewer, Copy citation) is the shared `MarkMenu`.\n */\nconst CitationLink: React.FC<CitationLinkProps> = ({\n  citationNum,\n  isActive,\n  isStreaming,\n  items,\n  preview,\n  triggerRef,\n  children,\n}) => (\n  <MarkMenu\n    triggerRef={triggerRef}\n    items={items}\n    preview={isStreaming ? undefined : preview}\n    menuLabel={`Citation ${citationNum}`}\n    testId={`citation-link-${citationNum}`}\n    tabIndex={isStreaming ? -1 : 0}\n    data-mark-kind=\"citation\"\n    className={cn(\n      'cited-text relative rounded-sm px-0.5 transition-colors',\n      // 44px touch hit area without changing the text layout. `touch-hit` grows only up to\n      // 44px (never past the mark's own width), so it doesn't reach over the neighbouring\n      // citation: a fixed inset let citation 2's area cover citation 1, and a tap on [1]\n      // opened [2].\n      'touch-hit',\n      isStreaming ? 'cursor-default' : 'cursor-pointer',\n      isActive ? 'bg-ai-soft text-foreground' : 'bg-ai-soft/30 hover:bg-ai-soft/70'\n    )}\n  >\n    {children}\n    {/* Readable floor: never below the text-xs token, bold, so the number is easy to spot.\n        `top-0` cancels preflight's `sup { top: -0.5em }`, which would raise the number a second\n        time and push it up into the line above (most visible in table cells). */}\n    <sup className=\"ml-px top-0 align-super text-[max(0.8em,var(--text-xs))] font-bold leading-none tabular-nums text-ai-ink\">\n      {citationNum}\n    </sup>\n  </MarkMenu>\n)\n\nexport const CitationRenderer = React.memo(CitationRendererComponent)\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/{chunk-WL2Y2T47.js → ai/MarkdownRenderer.js}

@@ -1,86 +1,17 @@
-import { normalizeCitationMarkup, closeOpenEmphasis, trimOpenCitation } from './chunk-VSCU7K4V.js';
-import { cn } from './chunk-SN5YV6FF.js';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import React, { createContext, useMemo, useRef, useState, useCallback, useEffect, useReducer } from 'react';
-import Markdown from 'react-markdown';
-import remarkGfm from 'remark-gfm';
-import rehypeRaw from 'rehype-raw';
-import rehypeSanitize, { defaultSchema } from 'rehype-sanitize';
-import rehypeSlug from 'rehype-slug';
-import { Check, Copy } from 'lucide-react';
-
-var markdownBaseComponents = {
-  h1: ({ children, ...props }) => /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold", "data-testid": "markdown-heading-1", ...props, children }),
-  h2: ({ children, ...props }) => /* @__PURE__ */ jsx("h2", { className: "font-semibold text-base", "data-testid": "markdown-heading-2", ...props, children }),
-  h3: ({ children, ...props }) => /* @__PURE__ */ jsx("h3", { className: "font-semibold text-base", "data-testid": "markdown-heading-3", ...props, children }),
-  h4: ({ children, ...props }) => /* @__PURE__ */ jsx("h4", { className: "font-semibold text-base", ...props, children }),
-  h5: ({ children, ...props }) => /* @__PURE__ */ jsx("h5", { className: "font-medium", ...props, children }),
-  strong: ({ children, ...props }) => /* @__PURE__ */ jsx("strong", { className: "font-semibold", ...props, children }),
-  blockquote: ({ children, ...props }) => /* @__PURE__ */ jsx("blockquote", { className: "border-l-2 border-primary pl-4", ...props, children }),
-  ol: ({ children, ...props }) => /* @__PURE__ */ jsx("ol", { className: "list-decimal space-y-2 pl-6", "data-testid": "markdown-ordered-list", ...props, children }),
-  ul: ({ children, ...props }) => /* @__PURE__ */ jsx("ul", { className: "list-none space-y-2 pl-6", "data-testid": "markdown-unordered-list", ...props, children }),
-  li: ({ children, ...props }) => /* @__PURE__ */ jsx("li", { className: "my-1.5", ...props, children }),
-  table: ({ children, ...props }) => /* @__PURE__ */ jsx("table", { "data-testid": "markdown-table", ...props, children }),
-  th: ({ children, ...props }) => /* @__PURE__ */ jsx("th", { ...props, children }),
-  td: ({ children, ...props }) => /* @__PURE__ */ jsx("td", { ...props, children }),
-  tr: ({ children, ...props }) => /* @__PURE__ */ jsx("tr", { ...props, children }),
-  p: ({ children, ...props }) => /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap", ...props, children }),
-  hr: (props) => /* @__PURE__ */ jsx("hr", { className: "border-foreground/20", ...props }),
-  sup: ({ children, ...props }) => /* @__PURE__ */ jsx("sup", { className: "text-xs", ...props, children }),
-  sub: ({ children, ...props }) => /* @__PURE__ */ jsx("sub", { className: "text-xs", ...props, children }),
-  div: ({ children, className, ...props }) => /* @__PURE__ */ jsx("div", { className, ...props, children }),
-  br: (props) => /* @__PURE__ */ jsx("br", { ...props }),
-  kbd: ({ children, ...props }) => /* @__PURE__ */ jsx(
-    "kbd",
-    {
-      className: "px-1.5 py-0.5 text-xs font-mono bg-muted border border-border rounded",
-      ...props,
-      children
-    }
-  ),
-  abbr: ({ children, title, ...props }) => /* @__PURE__ */ jsx("abbr", { title, className: "underline decoration-dotted cursor-help", ...props, children }),
-  cite: ({ children, ...props }) => /* @__PURE__ */ jsx("cite", { className: "italic", ...props, children })
-};
-var MarkdownStreamingContext = createContext(false);
-
-// src/ai/split-markdown-blocks.ts
-var LIST_ITEM_RE = /^\s*([-*+]|\d+[.)])\s/;
-var BLOCKQUOTE_RE = /^\s*>/;
-function splitMarkdownBlocks(content) {
-  if (!content) return [];
-  const blocks = [];
-  let start = 0;
-  let inFence = false;
-  let i = 0;
-  while (i < content.length) {
-    if (content.startsWith("```", i)) {
-      inFence = !inFence;
-      i += 3;
-      continue;
-    }
-    if (!inFence && content[i] === "\n" && content[i + 1] === "\n") {
-      const before = content.slice(start, i);
-      const lastLine = before.slice(before.lastIndexOf("\n") + 1);
-      const afterStart = i + 2;
-      const nextNewline = content.indexOf("\n", afterStart);
-      const nextLine = content.slice(afterStart, nextNewline === -1 ? void 0 : nextNewline);
-      const bothListItems = LIST_ITEM_RE.test(lastLine) && LIST_ITEM_RE.test(nextLine);
-      const bothBlockquotes = BLOCKQUOTE_RE.test(lastLine) && BLOCKQUOTE_RE.test(nextLine);
-      if (bothListItems || bothBlockquotes) {
-        i += 2;
-        continue;
-      }
-      blocks.push(content.slice(start, afterStart));
-      start = afterStart;
-      i = afterStart;
-      continue;
-    }
-    i++;
-  }
-  if (start < content.length) blocks.push(content.slice(start));
-  return blocks;
-}
-var EDGE_FADE = "1.5rem";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import React, { useCallback, useEffect, useMemo, useReducer, useRef, useState } from "react";
+import Markdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+import rehypeRaw from "rehype-raw";
+import rehypeSanitize, { defaultSchema } from "rehype-sanitize";
+import rehypeSlug from "rehype-slug";
+import { Copy, Check } from "lucide-react";
+import { cn } from "../lib/utils.js";
+import { markdownBaseComponents } from "./markdown-base-components.js";
+import { MarkdownStreamingContext } from "./markdown-streaming-context.js";
+import { splitMarkdownBlocks } from "./split-markdown-blocks.js";
+import { closeOpenEmphasis, normalizeCitationMarkup, trimOpenCitation } from "./normalize-citations.js";
+const EDGE_FADE = "1.5rem";
 function MarkdownTable({ children, ...props }) {
   const ref = useRef(null);
   const [edges, setEdges] = useState({ start: false, end: false });
@@ -204,7 +135,7 @@ function MarkdownCode({
   }
   return /* @__PURE__ */ jsx(CodeBlock, { language: match[1], code: String(children).replace(/\n$/, "") });
 }
-var defaultComponents = {
+const defaultComponents = {
   ...markdownBaseComponents,
   a: MarkdownLink,
   em: ({ children, ...props }) => /* @__PURE__ */ jsx("em", { className: "italic", ...props, children }),
@@ -229,7 +160,7 @@ var defaultComponents = {
   ins: ({ children, ...props }) => /* @__PURE__ */ jsx("ins", { className: "underline decoration-primary/60", ...props, children }),
   mark: ({ children, ...props }) => /* @__PURE__ */ jsx("mark", { className: "rounded bg-primary/15 px-0.5 text-inherit", ...props, children })
 };
-var markdownSanitizeSchema = {
+const markdownSanitizeSchema = {
   ...defaultSchema,
   tagNames: [...defaultSchema.tagNames ?? [], "mark"],
   attributes: {
@@ -242,16 +173,16 @@ var markdownSanitizeSchema = {
     del: [...defaultSchema.attributes?.del ?? [], "dataCid"]
   }
 };
-var loadedMath = null;
-var mathLoadStarted = false;
-var mathSubscribers = /* @__PURE__ */ new Set();
+let loadedMath = null;
+let mathLoadStarted = false;
+const mathSubscribers = /* @__PURE__ */ new Set();
 function loadMath() {
   if (mathLoadStarted) return;
   mathLoadStarted = true;
   void Promise.all([
-    import('remark-math'),
-    import('rehype-katex'),
-    import('katex/dist/katex.min.css')
+    import("remark-math"),
+    import("rehype-katex"),
+    import("katex/dist/katex.min.css")
   ]).then(([remarkMath, rehypeKatex]) => {
     loadedMath = { remarkMath: remarkMath.default, rehypeKatex: rehypeKatex.default };
     mathSubscribers.forEach((notify) => notify());
@@ -259,7 +190,7 @@ function loadMath() {
     mathLoadStarted = false;
   });
 }
-var MATH_RE = /\$\$[\s\S]+?\$\$|(?<!\\)\$(?![\s$])(?:\\\$|[^$\n])+?(?<![\s\\])\$/;
+const MATH_RE = /\$\$[\s\S]+?\$\$|(?<!\\)\$(?![\s$])(?:\\\$|[^$\n])+?(?<![\s\\])\$/;
 function escapeCurrencyDollars(markdown) {
   return markdown.split(/(```[\s\S]*?```|`[^`\n]*`)/).map((part, i) => i % 2 === 1 ? part : part.replace(/(?<!\\)\$(?=\d)/g, "\\$")).join("");
 }
@@ -276,7 +207,7 @@ function useMathReady(content) {
   }, [hasMath]);
   return hasMath && loadedMath !== null;
 }
-var NO_PLUGINS = [];
+const NO_PLUGINS = [];
 function usePlugins(allowHtml, mathReady, extra) {
   return useMemo(() => {
     const math = mathReady && loadedMath ? loadedMath : null;
@@ -291,7 +222,7 @@ function usePlugins(allowHtml, mathReady, extra) {
     return { remarkPlugins, rehypePlugins };
   }, [allowHtml, mathReady, extra]);
 }
-var MemoizedBlock = React.memo(function MarkdownBlock({
+const MemoizedBlock = React.memo(function MarkdownBlock({
   content,
   components,
   remarkPlugins,
@@ -299,7 +230,7 @@ var MemoizedBlock = React.memo(function MarkdownBlock({
 }) {
   return /* @__PURE__ */ jsx(Markdown, { remarkPlugins, rehypePlugins, components, children: content });
 });
-var MarkdownErrorBoundary = class extends React.Component {
+class MarkdownErrorBoundary extends React.Component {
   state = { hasError: false };
   static getDerivedStateFromError() {
     return { hasError: true };
@@ -307,7 +238,7 @@ var MarkdownErrorBoundary = class extends React.Component {
   render() {
     return this.state.hasError ? this.props.fallback : this.props.children;
   }
-};
+}
 function MarkdownRendererComponent({
   children,
   components: customComponents,
@@ -360,8 +291,11 @@ function MarkdownRendererComponent({
     }
   );
 }
-var MarkdownRenderer = React.memo(MarkdownRendererComponent);
-
-export { MarkdownCode, MarkdownLink, MarkdownRenderer, MarkdownStreamingContext, markdownBaseComponents, markdownSanitizeSchema, splitMarkdownBlocks };
-//# sourceMappingURL=chunk-WL2Y2T47.js.map
-//# sourceMappingURL=chunk-WL2Y2T47.js.map
+const MarkdownRenderer = React.memo(MarkdownRendererComponent);
+export {
+  MarkdownCode,
+  MarkdownLink,
+  MarkdownRenderer,
+  markdownSanitizeSchema
+};
+//# sourceMappingURL=MarkdownRenderer.js.map

package/dist/ai/MarkdownRenderer.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/ai/MarkdownRenderer.tsx"],
+  "sourcesContent": ["import React, { useCallback, useEffect, useMemo, useReducer, useRef, useState } from 'react'\nimport Markdown, { type Components, type Options as MarkdownOptions } from 'react-markdown'\nimport remarkGfm from 'remark-gfm'\nimport rehypeRaw from 'rehype-raw'\nimport rehypeSanitize, { defaultSchema, type Options as SanitizeSchema } from 'rehype-sanitize'\nimport rehypeSlug from 'rehype-slug'\nimport { Copy, Check } from 'lucide-react'\nimport { cn } from '../lib/utils'\nimport { markdownBaseComponents } from './markdown-base-components'\nimport { MarkdownStreamingContext } from './markdown-streaming-context'\nimport { splitMarkdownBlocks } from './split-markdown-blocks'\nimport { closeOpenEmphasis, normalizeCitationMarkup, trimOpenCitation } from './normalize-citations'\n\n/** remark/rehype plugin lists, as react-markdown takes them. */\ntype PluggableList = NonNullable<MarkdownOptions['rehypePlugins']>\n\n/**\n * MarkdownRenderer \u2014 the single, full-featured markdown surface for the kit.\n *\n * Renders AI answers, chat/DM messages and parsed-document panes with one house\n * style: headings, paragraphs, bold/italic, ordered/unordered lists, GFM tables,\n * fenced code blocks (monospace + copy button), inline code, blockquotes, safe\n * links (`rel=\"noopener\"`, new tab) and horizontal rules.\n *\n * Styling is 100% semantic Tailwind tokens (`text-foreground`,\n * `text-muted-foreground`, `border-border`, `bg-muted`, `text-primary`) so it\n * themes per firm \u2014 no hardcoded brand colours. It sizes to its container, so it\n * looks right in a compact chat bubble and in a full-width document pane alike.\n *\n * Streaming: the content is split into block-level chunks (see\n * `splitMarkdownBlocks`) and each chunk is memoised, so streaming token updates\n * only re-parse the trailing block instead of the whole message. Pass\n * `isStreaming` to let heavy custom components defer via `MarkdownStreamingContext`.\n *\n * Safety: inline HTML (redlines, `<mark>` highlights, parser tables) is parsed and then sanitised\n * (`markdownSanitizeSchema`), so a model or a document cannot inject scripts, handlers or styles.\n * Headings get slug ids, so `#section` links and bookmarks land.\n *\n * Math: `$\u2026$` and `$$\u2026$$` are typeset with KaTeX. remark-math, rehype-katex and KaTeX's CSS\n * (~90 kB gzip) load only once some content actually contains math. A `$` before a digit is a\n * currency sign, never a formula delimiter.\n *\n * Extending: pass `components` to override any element (the kit's `AiMarkdown`\n * and `CitationRenderer` layer their accent links / citation popovers on top; a host composes\n * `MarkdownLink` / `MarkdownCode` into its own overrides), and `rehypePlugins` for trusted\n * transforms that run after sanitising (e.g. turning entity ids into pills).\n */\n\nconst EDGE_FADE = '1.5rem'\n\n/**\n * A GFM table in its own horizontal scroller. The table keeps a minimum width per column\n * (`min-w-[7rem]` cells, words never broken mid-word), so on a narrow screen it scrolls sideways\n * inside this wrapper instead of squeezing cells to a letter per line. The edge(s) with more\n * content to scroll to fade out, which is the scroll hint. Wide containers are unchanged: the\n * table is `w-full` and nothing overflows.\n */\nfunction MarkdownTable({ children, ...props }: React.ComponentPropsWithoutRef<'table'>) {\n  const ref = useRef<HTMLDivElement>(null)\n  const [edges, setEdges] = useState({ start: false, end: false })\n  const measure = useCallback(() => {\n    const el = ref.current\n    if (!el) return\n    const start = el.scrollLeft > 1\n    const end = el.scrollLeft + el.clientWidth < el.scrollWidth - 1\n    setEdges((prev) => (prev.start === start && prev.end === end ? prev : { start, end }))\n  }, [])\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    measure()\n    if (typeof ResizeObserver === 'undefined') return\n    const observer = new ResizeObserver(measure)\n    observer.observe(el)\n    if (el.firstElementChild) observer.observe(el.firstElementChild)\n    return () => observer.disconnect()\n  }, [measure])\n  const mask =\n    edges.start || edges.end\n      ? `linear-gradient(to right, ${edges.start ? 'transparent' : '#000'}, #000 ${EDGE_FADE}, #000 calc(100% - ${EDGE_FADE}), ${edges.end ? 'transparent' : '#000'})`\n      : undefined\n  return (\n    <div\n      ref={ref}\n      onScroll={measure}\n      data-testid=\"markdown-table-scroller\"\n      data-scroll-start={edges.start || undefined}\n      data-scroll-end={edges.end || undefined}\n      className=\"my-3 overflow-x-auto rounded-lg border border-border\"\n      style={mask ? { maskImage: mask, WebkitMaskImage: mask } : undefined}\n    >\n      <table\n        data-testid=\"markdown-table\"\n        className=\"w-full border-collapse text-sm [overflow-wrap:normal] [word-break:normal]\"\n        {...props}\n      >\n        {children}\n      </table>\n    </div>\n  )\n}\n\n/** Fenced code block with a language label and copy-to-clipboard button. */\nfunction CodeBlock({ language, code }: { language: string; code: string }) {\n  const [copied, setCopied] = useState(false)\n\n  const handleCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(code)\n      setCopied(true)\n      setTimeout(() => setCopied(false), 2000)\n    } catch {\n      // Clipboard unavailable (insecure context / permissions) \u2014 no-op.\n    }\n  }\n\n  return (\n    <div\n      className=\"code-block relative my-3 overflow-hidden rounded-md border border-current/20 bg-current/5\"\n      data-testid=\"markdown-code-block\"\n    >\n      <div className=\"flex items-center justify-between border-b border-current/20 px-3 py-1.5\">\n        <span className=\"font-mono text-xs text-muted-foreground\">{language || 'code'}</span>\n        <button\n          type=\"button\"\n          onClick={handleCopy}\n          className=\"flex items-center gap-1 text-xs text-muted-foreground transition-colors hover:text-foreground\"\n          title={copied ? 'Copied!' : 'Copy code'}\n        >\n          {copied ? <Check size={12} /> : <Copy size={12} />}\n          <span>{copied ? 'Copied' : 'Copy'}</span>\n        </button>\n      </div>\n      <pre className=\"overflow-x-auto p-3 text-sm leading-relaxed\">\n        <code className={cn('font-mono', language && `language-${language}`)}>{code}</code>\n      </pre>\n    </div>\n  )\n}\n\n/**\n * Links. Internal hash/anchor links stay in-page; everything else opens safely in a new tab\n * (`rel=\"noopener noreferrer\"` prevents reverse-tabnabbing). A backend citation marker\n * (`#cite-N`) has no popover here: the cited words stay in the surface's own colour with a quiet\n * superscript number after them (no underline, so a cited sentence does not read as a link).\n * Pass `renderCitation` to `MarkdownRenderer` to swap in a real source popover.\n */\nexport function MarkdownLink({ href, children, ...props }: React.ComponentPropsWithoutRef<'a'>) {\n  if (href?.startsWith('#cite-')) {\n    return (\n      <span\n        className=\"cited-text after:ml-px after:align-super after:text-[max(0.8em,var(--text-xs))] after:font-semibold after:text-muted-foreground after:content-[attr(data-cite)]\"\n        data-cite={href.slice(6)}\n      >\n        {children}\n      </span>\n    )\n  }\n  const isInternal = !href || href.startsWith('#') || href.startsWith('cite:')\n  return (\n    <a\n      className=\"text-primary underline underline-offset-2\"\n      href={href}\n      // A `cite:` reference is not a place to go: the click must not navigate.\n      onClick={href?.startsWith('cite:') ? (e) => e.preventDefault() : undefined}\n      {...(isInternal ? {} : { target: '_blank', rel: 'noopener noreferrer' })}\n      {...props}\n    >\n      {children}\n    </a>\n  )\n}\n\n/**\n * Inline code, and fenced code as a `CodeBlock` (language label + copy). Exported so a host's own\n * `code` override can handle its special cases (a diagram language, an id shown as a pill) and\n * hand everything else back here.\n */\nexport function MarkdownCode({\n  className,\n  children,\n  ...props\n}: React.ComponentPropsWithoutRef<'code'>) {\n  const match = /language-(\\w+)/.exec(className || '')\n  if (!match) {\n    return (\n      <code\n        className=\"rounded bg-current/10 px-1 py-0.5 font-mono text-[0.9em]\"\n        data-testid=\"markdown-inline-code\"\n        {...props}\n      >\n        {children}\n      </code>\n    )\n  }\n  return <CodeBlock language={match[1]} code={String(children).replace(/\\n$/, '')} />\n}\n\n/**\n * Default component overrides. Spreads the shared brand-neutral base\n * (`markdownBaseComponents`: headings, lists, paragraphs, emphasis, hr\u2026) and adds\n * the elements that carry behaviour or need self-contained styling: safe links,\n * code (inline + fenced), bordered tables and blockquotes. Module-scoped so the\n * reference is stable across renders and react-markdown can skip re-parsing.\n */\nconst defaultComponents: Partial<Components> = {\n  ...markdownBaseComponents,\n  a: MarkdownLink,\n  em: ({ children, ...props }: React.ComponentPropsWithoutRef<'em'>) => (\n    <em className=\"italic\" {...props}>\n      {children}\n    </em>\n  ),\n  code: MarkdownCode,\n  // The CodeBlock renders its own <pre>; unwrap react-markdown's wrapper so we\n  // don't nest <pre><pre>.\n  pre: ({ children }: React.ComponentPropsWithoutRef<'pre'>) => <>{children}</>,\n  blockquote: ({ children, ...props }: React.ComponentPropsWithoutRef<'blockquote'>) => (\n    <blockquote className=\"border-l-2 border-border pl-4 italic text-muted-foreground\" {...props}>\n      {children}\n    </blockquote>\n  ),\n  table: MarkdownTable,\n  thead: ({ children, ...props }: React.ComponentPropsWithoutRef<'thead'>) => (\n    <thead className=\"bg-current/10\" {...props}>\n      {children}\n    </thead>\n  ),\n  th: ({ children, ...props }: React.ComponentPropsWithoutRef<'th'>) => (\n    <th\n      className=\"min-w-[7rem] border-b border-border px-3 py-2 text-left font-semibold\"\n      {...props}\n    >\n      {children}\n    </th>\n  ),\n  td: ({ children, ...props }: React.ComponentPropsWithoutRef<'td'>) => (\n    <td className=\"min-w-[7rem] border-b border-border px-3 py-2 align-top\" {...props}>\n      {children}\n    </td>\n  ),\n  // General emphasis marks (GFM `~~strikethrough~~` \u2192 <del>, raw <ins>/<mark>).\n  del: ({ children, ...props }: React.ComponentPropsWithoutRef<'del'>) => (\n    <del className=\"text-muted-foreground line-through\" {...props}>\n      {children}\n    </del>\n  ),\n  ins: ({ children, ...props }: React.ComponentPropsWithoutRef<'ins'>) => (\n    <ins className=\"underline decoration-primary/60\" {...props}>\n      {children}\n    </ins>\n  ),\n  mark: ({ children, ...props }: React.ComponentPropsWithoutRef<'mark'>) => (\n    <mark className=\"rounded bg-primary/15 px-0.5 text-inherit\" {...props}>\n      {children}\n    </mark>\n  ),\n}\n\n/**\n * What survives sanitising inline HTML: GitHub's schema, plus the classes the downstream steps and\n * renderers read (KaTeX's `math-*` placeholders, `language-*` on code), `<mark>` for search\n * highlights, and `data-cid` on `<ins>`/`<del>` (the redline's per-change id, minted from diff\n * positions, never from content). Scripts, event handlers, inline styles and `javascript:` URLs\n * stay out.\n */\nexport const markdownSanitizeSchema: SanitizeSchema = {\n  ...defaultSchema,\n  tagNames: [...(defaultSchema.tagNames ?? []), 'mark'],\n  attributes: {\n    ...defaultSchema.attributes,\n    span: [...(defaultSchema.attributes?.span ?? []), 'className'],\n    div: [...(defaultSchema.attributes?.div ?? []), 'className'],\n    code: [...(defaultSchema.attributes?.code ?? []), 'className'],\n    pre: [...(defaultSchema.attributes?.pre ?? []), 'className'],\n    ins: [...(defaultSchema.attributes?.ins ?? []), 'dataCid'],\n    del: [...(defaultSchema.attributes?.del ?? []), 'dataCid'],\n  },\n}\n\n// \u2500\u2500 Lazy KaTeX (math) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n// Loaded once, module-wide, the first time content with math renders; mounted renderers that\n// were waiting re-render when it lands.\ntype MathPlugins = { remarkMath: PluggableList[number]; rehypeKatex: PluggableList[number] }\nlet loadedMath: MathPlugins | null = null\nlet mathLoadStarted = false\nconst mathSubscribers = new Set<() => void>()\n\nfunction loadMath() {\n  if (mathLoadStarted) return\n  mathLoadStarted = true\n  void Promise.all([\n    import('remark-math'),\n    import('rehype-katex'),\n    import('katex/dist/katex.min.css'),\n  ])\n    .then(([remarkMath, rehypeKatex]) => {\n      loadedMath = { remarkMath: remarkMath.default, rehypeKatex: rehypeKatex.default }\n      mathSubscribers.forEach((notify) => notify())\n    })\n    .catch(() => {\n      // Retry on the next math-bearing render if the chunk failed to load.\n      mathLoadStarted = false\n    })\n}\n\n// remark-math's inline rule: `$\u2026$` with no whitespace just inside, or a `$$\u2026$$` block. A lone\n// price (\"$5,000\") never matches.\nconst MATH_RE = /\\$\\$[\\s\\S]+?\\$\\$|(?<!\\\\)\\$(?![\\s$])(?:\\\\\\$|[^$\\n])+?(?<![\\s\\\\])\\$/\n\n/**\n * A `$` straight before a digit is a currency sign (\"$2,000\", \"\u2248$50,000\"), not the start of inline\n * math: two in one paragraph would otherwise pair up and typeset everything between as a formula.\n * Escape them (outside code, where a backslash would show) so they stay text.\n */\nfunction escapeCurrencyDollars(markdown: string): string {\n  return markdown\n    .split(/(```[\\s\\S]*?```|`[^`\\n]*`)/)\n    .map((part, i) => (i % 2 === 1 ? part : part.replace(/(?<!\\\\)\\$(?=\\d)/g, '\\\\$')))\n    .join('')\n}\n\n/** True once the math plugins are loaded for content that contains math. */\nfunction useMathReady(content: string): boolean {\n  const hasMath = useMemo(() => MATH_RE.test(content), [content])\n  const [, rerender] = useReducer((n: number) => n + 1, 0)\n  useEffect(() => {\n    if (!hasMath || loadedMath) return\n    mathSubscribers.add(rerender)\n    loadMath()\n    return () => {\n      mathSubscribers.delete(rerender)\n    }\n  }, [hasMath])\n  return hasMath && loadedMath !== null\n}\n\nconst NO_PLUGINS: PluggableList = []\n\n/**\n * The remark/rehype pipelines. Raw HTML (when allowed) is parsed and sanitised before the trusted\n * steps (KaTeX, slugs, the host's plugins), so their output is not stripped again. Memoised on\n * its inputs so react-markdown sees stable arrays and memoised blocks do not re-parse.\n */\nfunction usePlugins(allowHtml: boolean, mathReady: boolean, extra: PluggableList) {\n  return useMemo(() => {\n    const math = mathReady && loadedMath ? loadedMath : null\n    const remarkPlugins: PluggableList = math ? [remarkGfm, math.remarkMath] : [remarkGfm]\n    const rehypePlugins: PluggableList = [\n      // Text someone else wrote (a Word comment from any .docx): raw HTML stays text.\n      ...(allowHtml ? [rehypeRaw, [rehypeSanitize, markdownSanitizeSchema]] : []),\n      ...(math ? [math.rehypeKatex] : []),\n      rehypeSlug,\n      ...extra,\n    ] as PluggableList\n    return { remarkPlugins, rehypePlugins }\n  }, [allowHtml, mathReady, extra])\n}\n\n/**\n * One parsed markdown block, memoised on (content, components) so already-rendered\n * blocks don't re-parse when a later block streams new tokens. This is the core\n * of the streaming-rendering optimisation.\n */\nconst MemoizedBlock = React.memo(function MarkdownBlock({\n  content,\n  components,\n  remarkPlugins,\n  rehypePlugins,\n}: {\n  content: string\n  components: Partial<Components>\n  remarkPlugins: PluggableList\n  rehypePlugins: PluggableList\n}) {\n  return (\n    <Markdown remarkPlugins={remarkPlugins} rehypePlugins={rehypePlugins} components={components}>\n      {content}\n    </Markdown>\n  )\n})\n\n/** Prevents a malformed-markdown render error from crashing the whole surface. */\nclass MarkdownErrorBoundary extends React.Component<\n  { fallback: React.ReactNode; children: React.ReactNode },\n  { hasError: boolean }\n> {\n  state = { hasError: false }\n  static getDerivedStateFromError() {\n    return { hasError: true }\n  }\n  render() {\n    return this.state.hasError ? this.props.fallback : this.props.children\n  }\n}\n\nexport interface MarkdownRendererProps {\n  /** Markdown content to render. */\n  children: string\n  /** Custom component overrides merged on top of the defaults. */\n  components?: Partial<Components>\n  /**\n   * When true, signals heavy custom components (via `MarkdownStreamingContext`)\n   * to defer their work while tokens are still arriving. Defaults to false.\n   */\n  isStreaming?: boolean\n  /**\n   * Renders a citation marker `[words](#cite-N)`: `children` are the cited words, `num` the N.\n   * Keep it referentially stable (`useCallback`/`useMemo`), or every block re-parses.\n   */\n  renderCitation?: (citation: { num: string; children: React.ReactNode }) => React.ReactNode\n  /** Extra classes on the wrapper (font-size, prose width, etc.). */\n  className?: string\n  /** Overrides the `data-testid` on the wrapper (default `markdown-renderer`). */\n  testId?: string\n  /**\n   * Inline HTML in the markdown becomes elements, sanitised (default). False keeps it as text: for\n   * content from outside the app, such as a comment in a Word file anyone could have written.\n   */\n  allowHtml?: boolean\n  /**\n   * Trusted rehype plugins run after sanitising, KaTeX and heading slugs (e.g. a pass that turns\n   * entity ids into elements the host's `components` render). Keep the array referentially\n   * stable (module scope), or every block re-parses.\n   */\n  rehypePlugins?: PluggableList\n}\n\nfunction MarkdownRendererComponent({\n  children,\n  components: customComponents,\n  renderCitation,\n  isStreaming = false,\n  className,\n  testId = 'markdown-renderer',\n  allowHtml = true,\n  rehypePlugins: extraRehypePlugins = NO_PLUGINS,\n}: MarkdownRendererProps) {\n  const components = useMemo(() => {\n    const base = customComponents\n      ? { ...defaultComponents, ...customComponents }\n      : defaultComponents\n    if (!renderCitation) return base\n    const Link = base.a ?? MarkdownLink\n    return {\n      ...base,\n      a: (props: React.ComponentPropsWithoutRef<'a'>) =>\n        props.href?.startsWith('#cite-')\n          ? renderCitation({ num: props.href.slice(6), children: props.children })\n          : React.createElement(Link as React.ElementType, props),\n    }\n  }, [customComponents, renderCitation])\n\n  const text = useMemo(() => {\n    const escaped = escapeCurrencyDollars(children)\n    return normalizeCitationMarkup(\n      isStreaming ? closeOpenEmphasis(trimOpenCitation(escaped)) : escaped\n    )\n  }, [children, isStreaming])\n  const blocks = useMemo(() => splitMarkdownBlocks(text), [text])\n  const mathReady = useMathReady(text)\n  const { remarkPlugins, rehypePlugins } = usePlugins(allowHtml, mathReady, extraRehypePlugins)\n\n  return (\n    <MarkdownErrorBoundary\n      fallback={<div className={cn('whitespace-pre-wrap break-words', className)}>{children}</div>}\n    >\n      <MarkdownStreamingContext.Provider value={isStreaming}>\n        <div\n          className={cn('markdown-content space-y-3 break-words leading-relaxed', className)}\n          data-testid={testId}\n        >\n          {blocks.map((block, index) => (\n            <MemoizedBlock\n              key={index}\n              content={block}\n              components={components}\n              remarkPlugins={remarkPlugins}\n              rehypePlugins={rehypePlugins}\n            />\n          ))}\n        </div>\n      </MarkdownStreamingContext.Provider>\n    </MarkdownErrorBoundary>\n  )\n}\n\n/**\n * Memoised so a stable message in a long thread doesn't re-parse when unrelated\n * tokens arrive elsewhere; a streaming message gets a fresh `children` each flush\n * and re-renders (only its trailing block re-parses, thanks to `MemoizedBlock`).\n */\nexport const MarkdownRenderer = React.memo(MarkdownRendererComponent)\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/ai/MessageArtifactCard.js

@@ -0,0 +1,75 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { AppWindow, FileText, Image as ImageIcon } from "lucide-react";
+import { Card } from "../ui/card.js";
+const LABELS = {
+  document: {
+    Icon: FileText,
+    busy: "Drafting\u2026",
+    ready: "Draft ready",
+    action: "Open in Editor",
+    untitled: "Untitled draft"
+  },
+  live: {
+    Icon: AppWindow,
+    busy: "Building\u2026",
+    ready: "Preview ready",
+    action: "Open preview",
+    untitled: "Untitled app"
+  },
+  image: {
+    Icon: ImageIcon,
+    busy: "Generating\u2026",
+    ready: "Image ready",
+    action: "View image",
+    untitled: "Generated image"
+  }
+};
+function labelsFor(mode) {
+  if (mode === "image") return LABELS.image;
+  if (mode === "html" || mode === "react") return LABELS.live;
+  return LABELS.document;
+}
+function MessageArtifactCard({
+  artifact,
+  onOpen
+}) {
+  const { docExtId, title, isComplete, mode } = artifact;
+  const labels = labelsFor(mode);
+  const Icon = labels.Icon;
+  return /* @__PURE__ */ jsxs(
+    Card,
+    {
+      variant: "outline",
+      className: "mt-3 flex items-center gap-3 px-3 py-2.5",
+      "data-testid": `message-artifact-card-${docExtId}`,
+      children: [
+        /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4 shrink-0 text-muted-foreground", "aria-hidden": true }),
+        /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "truncate text-chat font-semibold text-foreground",
+              "data-testid": "artifact-title",
+              children: title || labels.untitled
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground", "data-testid": "artifact-status", children: isComplete ? labels.ready : labels.busy })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => onOpen(docExtId),
+            className: "shrink-0 rounded-md bg-secondary/15 px-3 py-1.5 text-sm font-semibold text-secondary transition-colors hover:bg-secondary/25",
+            "data-testid": `view-artifact-button-${docExtId}`,
+            children: labels.action
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  MessageArtifactCard
+};
+//# sourceMappingURL=MessageArtifactCard.js.map

package/dist/ai/MessageArtifactCard.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/ai/MessageArtifactCard.tsx"],
+  "sourcesContent": ["import React from 'react'\nimport { AppWindow, FileText, Image as ImageIcon } from 'lucide-react'\nimport { Card } from '../ui/card'\n\n/**\n * The minimal artifact shape this card renders. A structural subset of the\n * ARBI app's `StreamingDocument`, defined here so the light package doesn't\n * depend on the app store \u2014 any object carrying these fields is accepted.\n */\nexport interface MessageArtifact {\n  /** External id of the drafted document; opened in the docked viewer. */\n  docExtId: string\n  /** Display title; falls back when empty. */\n  title: string\n  /** Whether generation has finished. */\n  isComplete: boolean\n  /**\n   * Content mode. `markdown` / `text` are document drafts, which the server stores as Word\n   * documents (.docx); `html` / `react` are live UI artifacts; `image` is a generated image.\n   */\n  mode: 'markdown' | 'html' | 'text' | 'react' | 'image'\n}\n\nconst LABELS = {\n  document: {\n    Icon: FileText,\n    busy: 'Drafting\u2026',\n    ready: 'Draft ready',\n    action: 'Open in Editor',\n    untitled: 'Untitled draft',\n  },\n  live: {\n    Icon: AppWindow,\n    busy: 'Building\u2026',\n    ready: 'Preview ready',\n    action: 'Open preview',\n    untitled: 'Untitled app',\n  },\n  image: {\n    Icon: ImageIcon,\n    busy: 'Generating\u2026',\n    ready: 'Image ready',\n    action: 'View image',\n    untitled: 'Generated image',\n  },\n} as const\n\nfunction labelsFor(mode: MessageArtifact['mode']) {\n  if (mode === 'image') return LABELS.image\n  if (mode === 'html' || mode === 'react') return LABELS.live\n  return LABELS.document\n}\n\ninterface MessageArtifactCardProps {\n  /** The streaming/drafted document linked to this assistant message. */\n  artifact: MessageArtifact\n  /** Opens the drafted document (docExtId) in the docked viewer. */\n  onOpen: (docExtId: string) => void\n}\n\n/**\n * Inline \"Open in Editor\" (document drafts) / \"Open preview\" / \"View image\" affordance shown inside the assistant message that\n * produced a drafted document \u2014 so the artifact lives in the conversation\n * narrative (dyad-style) instead of only a hidden docked panel.\n *\n * Clean-ARBI contract: flat outline card, one chat type size, brand\n * accent on the action, tap-friendly (a real button \u2014 no hover-only).\n */\nexport function MessageArtifactCard({\n  artifact,\n  onOpen,\n}: MessageArtifactCardProps): React.JSX.Element {\n  const { docExtId, title, isComplete, mode } = artifact\n  const labels = labelsFor(mode)\n  const Icon = labels.Icon\n  return (\n    <Card\n      variant=\"outline\"\n      className=\"mt-3 flex items-center gap-3 px-3 py-2.5\"\n      data-testid={`message-artifact-card-${docExtId}`}\n    >\n      <Icon className=\"h-4 w-4 shrink-0 text-muted-foreground\" aria-hidden />\n      <div className=\"min-w-0 flex-1\">\n        <div\n          className=\"truncate text-chat font-semibold text-foreground\"\n          data-testid=\"artifact-title\"\n        >\n          {title || labels.untitled}\n        </div>\n        <div className=\"text-sm text-muted-foreground\" data-testid=\"artifact-status\">\n          {isComplete ? labels.ready : labels.busy}\n        </div>\n      </div>\n      <button\n        type=\"button\"\n        onClick={() => onOpen(docExtId)}\n        className=\"shrink-0 rounded-md bg-secondary/15 px-3 py-1.5 text-sm font-semibold text-secondary transition-colors hover:bg-secondary/25\"\n        data-testid={`view-artifact-button-${docExtId}`}\n      >\n        {labels.action}\n      </button>\n    </Card>\n  )\n}\n"],
+  "mappings": "AAiFM,cACA,YADA;AAhFN,SAAS,WAAW,UAAU,SAAS,iBAAiB;AACxD,SAAS,YAAY;AAqBrB,MAAM,SAAS;AAAA,EACb,UAAU;AAAA,IACR,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,EACZ;AAAA,EACA,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,EACZ;AAAA,EACA,OAAO;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,EACZ;AACF;AAEA,SAAS,UAAU,MAA+B;AAChD,MAAI,SAAS,QAAS,QAAO,OAAO;AACpC,MAAI,SAAS,UAAU,SAAS,QAAS,QAAO,OAAO;AACvD,SAAO,OAAO;AAChB;AAiBO,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AACF,GAAgD;AAC9C,QAAM,EAAE,UAAU,OAAO,YAAY,KAAK,IAAI;AAC9C,QAAM,SAAS,UAAU,IAAI;AAC7B,QAAM,OAAO,OAAO;AACpB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,WAAU;AAAA,MACV,eAAa,yBAAyB,QAAQ;AAAA,MAE9C;AAAA,4BAAC,QAAK,WAAU,0CAAyC,eAAW,MAAC;AAAA,QACrE,qBAAC,SAAI,WAAU,kBACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAY;AAAA,cAEX,mBAAS,OAAO;AAAA;AAAA,UACnB;AAAA,UACA,oBAAC,SAAI,WAAU,iCAAgC,eAAY,mBACxD,uBAAa,OAAO,QAAQ,OAAO,MACtC;AAAA,WACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS,MAAM,OAAO,QAAQ;AAAA,YAC9B,WAAU;AAAA,YACV,eAAa,wBAAwB,QAAQ;AAAA,YAE5C,iBAAO;AAAA;AAAA,QACV;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "names": []
+}

package/dist/ai/PassageCard.js

@@ -0,0 +1,79 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/utils.js";
+const TIERS = [
+  { min: 0.7, tone: "bg-emerald-500", label: "High relevance" },
+  { min: 0.4, tone: "bg-amber-500", label: "Medium relevance" },
+  { min: -Infinity, tone: "bg-muted-foreground/40", label: "Low relevance" }
+];
+function RelevanceDot({ score }) {
+  if (score == null) return null;
+  const tier = TIERS.find((t) => score >= t.min) ?? TIERS[TIERS.length - 1];
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      role: "img",
+      "aria-label": tier.label,
+      title: `${tier.label} (${score.toFixed(2)})`,
+      className: cn("size-1.5 shrink-0 rounded-full", tier.tone),
+      "data-testid": "passage-relevance"
+    }
+  );
+}
+function PassageCard({
+  header,
+  score,
+  headerRight,
+  active,
+  onClick,
+  footer,
+  className,
+  children,
+  "data-testid": testId
+}) {
+  const body = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-1.5 flex items-center gap-2", children: [
+      header,
+      (score != null || headerRight) && /* @__PURE__ */ jsxs("div", { className: "ml-auto flex shrink-0 items-center gap-2", children: [
+        /* @__PURE__ */ jsx(RelevanceDot, { score }),
+        headerRight
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "[&_mark]:rounded-sm [&_mark]:bg-ai-accent/20 [&_mark]:px-0.5 [&_mark]:font-medium [&_mark]:text-foreground", children })
+  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "group rounded-lg border border-border bg-card p-3 text-left transition-colors",
+        onClick && "hover:border-ai-accent/40 focus-within:ring-2 focus-within:ring-ai-accent/40",
+        active && "border-ai-accent/60 ring-1 ring-ai-accent/30",
+        className
+      ),
+      children: [
+        onClick ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            role: "button",
+            tabIndex: 0,
+            onClick,
+            onKeyDown: (e) => {
+              if (e.key === "Enter" || e.key === " ") {
+                e.preventDefault();
+                onClick(e);
+              }
+            },
+            "aria-current": active || void 0,
+            "data-testid": testId,
+            className: "cursor-pointer focus:outline-none",
+            children: body
+          }
+        ) : /* @__PURE__ */ jsx("div", { "aria-current": active || void 0, "data-testid": testId, children: body }),
+        footer
+      ]
+    }
+  );
+}
+export {
+  PassageCard
+};
+//# sourceMappingURL=PassageCard.js.map

package/dist/ai/PassageCard.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/ai/PassageCard.tsx"],
+  "sourcesContent": ["/**\n * PassageCard \u2014 the card (\"bubble\") a single retrieved passage is rendered as.\n *\n * One presentation shared by every surface that lists retrieval hits: the\n * blocks search page (`SearchHit`) and the conversation search. Those had drifted into two different looks for the same object; this\n * is the single one.\n *\n * The card owns the chrome only \u2014 the rounded border, the AI-accent hover /\n * focus / selected states, the header row and the relevance dot. What goes in\n * the header and how the snippet itself is rendered stays with the caller,\n * because those genuinely differ: the block shows a plain-text excerpt in a\n * narrow sidebar, the monolith renders markdown with a show-more toggle.\n *\n * Theming is semantic tokens only (shadcn + the AI-accent contract).\n */\n\nimport React from 'react'\nimport { cn } from '../lib/utils'\n\n/** Relevance bands. Shared so a hit is coloured the same wherever it appears. */\nconst TIERS = [\n  { min: 0.7, tone: 'bg-emerald-500', label: 'High relevance' },\n  { min: 0.4, tone: 'bg-amber-500', label: 'Medium relevance' },\n  { min: -Infinity, tone: 'bg-muted-foreground/40', label: 'Low relevance' },\n] as const\n\n/**\n * A dot conveying relevance \u2014 green (high) / amber (mid) / muted (low).\n *\n * The band is shown, the raw number is not: scores are not on a normalized 0-1\n * scale across search modes (BM25 keyword scores can exceed 1), so a printed\n * figure invites a comparison it cannot support. The value is kept in the\n * tooltip for anyone debugging a ranking.\n */\nfunction RelevanceDot({ score }: { score?: number | null }) {\n  if (score == null) return null\n  const tier = TIERS.find((t) => score >= t.min) ?? TIERS[TIERS.length - 1]\n  return (\n    <span\n      role=\"img\"\n      aria-label={tier.label}\n      title={`${tier.label} (${score.toFixed(2)})`}\n      className={cn('size-1.5 shrink-0 rounded-full', tier.tone)}\n      data-testid=\"passage-relevance\"\n    />\n  )\n}\n\nexport interface PassageCardProps {\n  /** Left of the header row \u2014 the source affordance (document pill, page label). */\n  header: React.ReactNode\n  /** Relevance score for the dot. Omit to hide it. */\n  score?: number | null\n  /** Extra affordance pinned right of the dot (e.g. a hover-revealed open icon). */\n  headerRight?: React.ReactNode\n  /** Marks the card as the currently open passage. */\n  active?: boolean\n  onClick?: (e: React.MouseEvent) => void\n  /** Rendered under the snippet, outside the click target's typography. */\n  footer?: React.ReactNode\n  className?: string\n  children: React.ReactNode\n  'data-testid'?: string\n}\n\nexport function PassageCard({\n  header,\n  score,\n  headerRight,\n  active,\n  onClick,\n  footer,\n  className,\n  children,\n  'data-testid': testId,\n}: PassageCardProps) {\n  const body = (\n    <>\n      <div className=\"mb-1.5 flex items-center gap-2\">\n        {header}\n        {(score != null || headerRight) && (\n          <div className=\"ml-auto flex shrink-0 items-center gap-2\">\n            <RelevanceDot score={score} />\n            {headerRight}\n          </div>\n        )}\n      </div>\n      {/* Query-term highlights are styled here rather than by each caller, so a\n       * <mark> reads as an accent on the passage instead of browser yellow. */}\n      <div className=\"[&_mark]:rounded-sm [&_mark]:bg-ai-accent/20 [&_mark]:px-0.5 [&_mark]:font-medium [&_mark]:text-foreground\">\n        {children}\n      </div>\n    </>\n  )\n\n  return (\n    <div\n      className={cn(\n        'group rounded-lg border border-border bg-card p-3 text-left transition-colors',\n        onClick && 'hover:border-ai-accent/40 focus-within:ring-2 focus-within:ring-ai-accent/40',\n        active && 'border-ai-accent/60 ring-1 ring-ai-accent/30',\n        className\n      )}\n    >\n      {/* The footer sits OUTSIDE the click target on purpose. It holds the\n       * caller's own controls (a show-more toggle), and a button nested inside a\n       * role=\"button\" is both invalid and ambiguous to hit \u2014 the whole passage\n       * would otherwise become that control's accessible name.\n       *\n       * `data-testid` rides on the click target rather than this shell, so\n       * \"click the result row\" keeps working for every caller's tests. */}\n      {onClick ? (\n        <div\n          role=\"button\"\n          tabIndex={0}\n          onClick={onClick}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              onClick(e as unknown as React.MouseEvent)\n            }\n          }}\n          aria-current={active || undefined}\n          data-testid={testId}\n          className=\"cursor-pointer focus:outline-none\"\n        >\n          {body}\n        </div>\n      ) : (\n        <div aria-current={active || undefined} data-testid={testId}>\n          {body}\n        </div>\n      )}\n      {footer}\n    </div>\n  )\n}\n"],
+  "mappings": "AAsCI,SAuCA,UAvCA,KA2CM,YA3CN;AArBJ,SAAS,UAAU;AAGnB,MAAM,QAAQ;AAAA,EACZ,EAAE,KAAK,KAAK,MAAM,kBAAkB,OAAO,iBAAiB;AAAA,EAC5D,EAAE,KAAK,KAAK,MAAM,gBAAgB,OAAO,mBAAmB;AAAA,EAC5D,EAAE,KAAK,WAAW,MAAM,0BAA0B,OAAO,gBAAgB;AAC3E;AAUA,SAAS,aAAa,EAAE,MAAM,GAA8B;AAC1D,MAAI,SAAS,KAAM,QAAO;AAC1B,QAAM,OAAO,MAAM,KAAK,CAAC,MAAM,SAAS,EAAE,GAAG,KAAK,MAAM,MAAM,SAAS,CAAC;AACxE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY,KAAK;AAAA,MACjB,OAAO,GAAG,KAAK,KAAK,KAAK,MAAM,QAAQ,CAAC,CAAC;AAAA,MACzC,WAAW,GAAG,kCAAkC,KAAK,IAAI;AAAA,MACzD,eAAY;AAAA;AAAA,EACd;AAEJ;AAmBO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,GAAqB;AACnB,QAAM,OACJ,iCACE;AAAA,yBAAC,SAAI,WAAU,kCACZ;AAAA;AAAA,OACC,SAAS,QAAQ,gBACjB,qBAAC,SAAI,WAAU,4CACb;AAAA,4BAAC,gBAAa,OAAc;AAAA,QAC3B;AAAA,SACH;AAAA,OAEJ;AAAA,IAGA,oBAAC,SAAI,WAAU,8GACZ,UACH;AAAA,KACF;AAGF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,WAAW;AAAA,QACX,UAAU;AAAA,QACV;AAAA,MACF;AAAA,MASC;AAAA,kBACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,UAAU;AAAA,YACV;AAAA,YACA,WAAW,CAAC,MAAM;AAChB,kBAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,kBAAE,eAAe;AACjB,wBAAQ,CAAgC;AAAA,cAC1C;AAAA,YACF;AAAA,YACA,gBAAc,UAAU;AAAA,YACxB,eAAa;AAAA,YACb,WAAU;AAAA,YAET;AAAA;AAAA,QACH,IAEA,oBAAC,SAAI,gBAAc,UAAU,QAAW,eAAa,QAClD,gBACH;AAAA,QAED;AAAA;AAAA;AAAA,EACH;AAEJ;",
+  "names": []
+}