feat(citations): inline citation links with [citation:Title](URL)

- Backend: add citation format to lead_agent and general_purpose prompts - Add CitationLink component (Badge + HoverCard) for citation cards - MarkdownContent: detect citation: prefix in link text, render CitationLink - Message/artifact/subtask: use MarkdownContent or Streamdown with CitationLink - message-list-item: pass img via components prop (remove isHuman/img) - message-group, subtask-card: drop unused imports; fix import order (lint) Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 21:40:20 +08:00
parent 715d7436f1
commit 2f50e5d969
11 changed files with 133 additions and 27 deletions
@@ -0,0 +1,79 @@
+import { ExternalLinkIcon } from "lucide-react";
+import type { ComponentProps } from "react";
+
+import { Badge } from "@/components/ui/badge";
+import {
+  HoverCard,
+  HoverCardContent,
+  HoverCardTrigger,
+} from "@/components/ui/hover-card";
+import { cn } from "@/lib/utils";
+
+export function CitationLink({ 
+  href, 
+  children,
+  ...props 
+}: ComponentProps<"a">) {
+  const domain = extractDomain(href ?? "");
+  
+  // Priority: children > domain
+  const childrenText = typeof children === "string" ? children : null;
+  const isGenericText = childrenText === "Source" || childrenText === "来源";
+  const displayText = (!isGenericText && childrenText) ?? domain;
+
+  return (
+    <HoverCard closeDelay={0} openDelay={0}>
+      <HoverCardTrigger asChild>
+        <a
+          href={href}
+          target="_blank"
+          rel="noopener noreferrer"
+          className="inline-flex items-center"
+          onClick={(e) => e.stopPropagation()}
+          {...props}
+        >
+          <Badge
+            variant="secondary"
+            className="hover:bg-secondary/80 mx-0.5 cursor-pointer gap-1 rounded-full px-2 py-0.5 text-xs font-normal"
+          >
+            {displayText}
+            <ExternalLinkIcon className="size-3" />
+          </Badge>
+        </a>
+      </HoverCardTrigger>
+      <HoverCardContent className={cn("relative w-80 p-0", props.className)}>
+        <div className="p-3">
+          <div className="space-y-1">
+            {displayText && (
+              <h4 className="truncate font-medium text-sm leading-tight">
+                {displayText}
+              </h4>
+            )}
+            {href && (
+              <p className="truncate break-all text-muted-foreground text-xs">
+                {href}
+              </p>
+            )}
+          </div>
+          <a
+            href={href}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="text-primary mt-2 inline-flex items-center gap-1 text-xs hover:underline"
+          >
+            Visit source
+            <ExternalLinkIcon className="size-3" />
+          </a>
+        </div>
+      </HoverCardContent>
+    </HoverCard>
+  );
+}
+
+function extractDomain(url: string): string {
+  try {
+    return new URL(url).hostname.replace(/^www\./i, "");
+  } catch {
+    return url;
+  }
+}