@curvenote/renderers 1.0.1 → 2.0.1

package/dist/articles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"articles.d.ts","sourceRoot":"","sources":["../src/articles.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAoC1D,eAAO,MAAM,kBAAkB;;CAA0C,CAAC"}
+{"version":3,"file":"articles.d.ts","sourceRoot":"","sources":["../src/articles.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAgD1D,eAAO,MAAM,kBAAkB;;CAA0C,CAAC"}

package/dist/articles.js

@@ -1,6 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ArticleCard } from '@curvenote/theme-ui';
+import { ArticleCard, useAnalytics } from '@curvenote/theme-ui';
 const ArticlesRenderer = ({ node }) => {
-    return (_jsxs("div", { children: [!node.error && (_jsx("div", { className: "space-y-6", children: node.items.map((article) => (_jsx(ArticleCard, { to: `/articles/${article.slug ?? article.id}`, article: article, showThumbnails: node['show-thumbnails'] ?? false, showAuthors: node['show-authors'] ?? false, showDoi: node['show-doi'] ?? false, showDate: node['show-date'] ?? false }, article.id))) })), !node.error && node.items.length === 0 && (_jsx("div", { className: "px-2 py-4 text-gray-600 border-gray-500 border-gray-[1px] rounded-sm bg-gray-50", children: "There are no articles in this listing yet." })), node.error && (_jsx("div", { className: "text-red-500 p-4 my-2 bg-red-50 border-[1px] border-red-500 rounded-sm", children: node.error }))] }));
+    const capture = useAnalytics();
+    return (_jsxs("div", { children: [!node.error && (_jsx("div", { className: "space-y-6", children: node.items.map((article) => (_jsx("div", { onClick: () => capture('content_article_card_clicked', {
+                        surface: 'content',
+                        articleId: article.id,
+                        articleSlug: article.slug,
+                        articleTitle: article.title,
+                    }), children: _jsx(ArticleCard, { to: `/articles/${article.slug ?? article.id}`, article: article, showThumbnails: node['show-thumbnails'] ?? false, showAuthors: node['show-authors'] ?? false, showDoi: node['show-doi'] ?? false, showDate: node['show-date'] ?? false }) }, article.id))) })), !node.error && node.items.length === 0 && (_jsx("div", { className: "px-2 py-4 text-gray-600 border-gray-500 border-gray-[1px] rounded-sm bg-gray-50", children: "There are no articles in this listing yet." })), node.error && (_jsx("div", { className: "text-red-500 p-4 my-2 bg-red-50 border-[1px] border-red-500 rounded-sm", children: node.error }))] }));
 };
 export const ARTICLES_RENDERERS = { curvenoteArticles: ArticlesRenderer };

package/dist/components/admonition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"admonition.d.ts","sourceRoot":"","sources":["../../src/components/admonition.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AA8B1D,oBAAY,cAAc;IACxB,UAAU,eAAe;IACzB,SAAS,cAAc;IACvB,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,IAAI,SAAS;IACb,OAAO,YAAY;IACnB,GAAG,QAAQ;IACX,OAAO,YAAY;CACpB;AA8PD,eAAO,MAAM,oBAAoB;;CAAqC,CAAC"}
+{"version":3,"file":"admonition.d.ts","sourceRoot":"","sources":["../../src/components/admonition.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AA+B1D,oBAAY,cAAc;IACxB,UAAU,eAAe;IACzB,SAAS,cAAc;IACvB,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,SAAS,cAAc;IACvB,IAAI,SAAS;IACb,IAAI,SAAS;IACb,OAAO,YAAY;IACnB,GAAG,QAAQ;IACX,OAAO,YAAY;CACpB;AAoRD,eAAO,MAAM,oBAAoB;;CAAqC,CAAC"}

package/dist/components/admonition.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Collapsible, CollapsibleContent, CollapsibleTrigger, Button, SimpleTooltip, } from '@curvenote/theme-ui';
+import { Collapsible, CollapsibleContent, CollapsibleTrigger, Button, SimpleTooltip, useAnalytics, } from '@curvenote/theme-ui';
 import { ChevronRight, Link as LinkIcon, Info, AlertTriangle, AlertCircle, XCircle, Megaphone, Lightbulb, Zap, ArrowRight, SquarePen, } from 'lucide-react';
 import { useState } from 'react';
 import { MyST } from 'myst-to-react';
@@ -54,7 +54,7 @@ const admonitionVariants = cva('border border-muted border-l-2 bg-muted/30', {
         variant: 'default',
     },
 });
-const iconVariants = cva('w-5 h-5 mt-0.5 flex-shrink-0 self-center', {
+const iconVariants = cva('w-5 h-5 mt-0.5 shrink-0 self-center', {
     variants: {
         color: {
             blue: 'text-blue-600 dark:text-blue-400',
@@ -108,16 +108,28 @@ function getFirstKind({ kind, classes = [], }) {
     return ADMONITION_CONFIGS[AdmonitionKind.note];
 }
 const AdmonitionComponent = ({ id, title, content, defaultOpen, config, isDropdown, hideIcon, className, }) => {
+    const capture = useAnalytics();
     const [isOpen, setIsOpen] = useState(defaultOpen);
     const IconComponent = config.icon;
     const handleCopyLink = async () => {
         const url = `${window.location.origin}${window.location.pathname}#${id}`;
         try {
             await navigator.clipboard.writeText(url);
-            toast.success('Link copied to clipboard');
         }
         catch (err) {
             console.error('Failed to copy link:', err);
+            return;
+        }
+        toast.success('Link copied to clipboard');
+        try {
+            capture('content_admonition_link_copied', {
+                surface: 'content',
+                admonitionKind: config.kind,
+                targetId: id,
+            });
+        }
+        catch {
+            // best-effort analytics — errors must not surface to the user here
         }
     };
     if (!isDropdown) {
@@ -126,7 +138,15 @@ const AdmonitionComponent = ({ id, title, content, defaultOpen, config, isDropdo
     return (_jsx("div", { className: "overflow-hidden my-4 rounded-xs", children: _jsx("div", { className: cn(admonitionVariants({
                 color: config.color,
                 variant: 'collapsible',
-            }), className), children: _jsxs(Collapsible, { open: isOpen, onOpenChange: setIsOpen, children: [_jsx(CollapsibleTrigger, { asChild: true, children: _jsxs("button", { className: "flex justify-between items-start p-4 w-full text-left cursor-pointer", children: [_jsxs("div", { className: "flex gap-3 items-start", children: [_jsx("div", { className: "flex-shrink-0 mt-1.5", children: _jsx(ChevronRight, { className: cn('w-4 h-4 transition-transform duration-200', {
+            }), className), children: _jsxs(Collapsible, { open: isOpen, onOpenChange: (open) => {
+                    setIsOpen(open);
+                    capture('content_admonition_toggled', {
+                        surface: 'content',
+                        admonitionKind: config.kind,
+                        targetId: id,
+                        open,
+                    });
+                }, children: [_jsx(CollapsibleTrigger, { asChild: true, children: _jsxs("button", { className: "flex justify-between items-start p-4 w-full text-left cursor-pointer", children: [_jsxs("div", { className: "flex gap-3 items-start", children: [_jsx("div", { className: "shrink-0 mt-1.5", children: _jsx(ChevronRight, { className: cn('w-4 h-4 transition-transform duration-200', {
                                                     'rotate-90': isOpen,
                                                 }) }) }), _jsxs("div", { className: "flex gap-3 items-start", children: [!hideIcon && (_jsx(IconComponent, { className: iconVariants({ color: config.color }) })), _jsx("span", { className: "font-medium text-foreground", children: title })] })] }), _jsx(SimpleTooltip, { title: "Copy link", children: _jsx(Button, { variant: "ghost", size: "sm", onClick: (e) => {
                                             e.stopPropagation();

package/dist/components/anywidget-host.d.ts

@@ -0,0 +1,7 @@
+import { type ReactNode } from 'react';
+import { type AnywidgetIdentity } from '../utils/anywidget-analytics';
+export declare function AnywidgetClickHost({ children, identity, }: {
+    children: ReactNode;
+    identity: AnywidgetIdentity;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=anywidget-host.d.ts.map

package/dist/components/anywidget-host.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"anywidget-host.d.ts","sourceRoot":"","sources":["../../src/components/anywidget-host.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAA2B,KAAK,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAE/F,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,EAAE,iBAAiB,CAAC;CAC7B,2CAYA"}

package/dist/components/anywidget-host.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useAnalytics } from '@curvenote/theme-ui';
+import { useCallback } from 'react';
+import { captureAnywidgetClicked } from '../utils/anywidget-analytics';
+export function AnywidgetClickHost({ children, identity, }) {
+    const capture = useAnalytics();
+    const handleClick = useCallback(() => {
+        captureAnywidgetClicked(capture, identity);
+    }, [capture, identity]);
+    return (_jsx("div", { className: "relative w-full", style: { position: 'relative' }, onClick: handleClick, children: children }));
+}

package/dist/components/bluesky.d.ts

@@ -0,0 +1,6 @@
+import type { GenericNode } from 'myst-common';
+import type { NodeRenderer, NodeRenderers } from '@myst-theme/providers';
+export declare const BlueskyBlockRenderer: NodeRenderer<GenericNode>;
+export declare const BlueskyLinkRenderer: NodeRenderer<GenericNode>;
+export declare const BLUESKY_LINK_RENDERERS: NodeRenderers;
+//# sourceMappingURL=bluesky.d.ts.map

package/dist/components/bluesky.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bluesky.d.ts","sourceRoot":"","sources":["../../src/components/bluesky.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAsNzE,eAAO,MAAM,oBAAoB,EAAE,YAAY,CAAC,WAAW,CAI1D,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,YAAY,CAAC,WAAW,CAsCzD,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,aAOpC,CAAC"}

package/dist/components/bluesky.js

@@ -0,0 +1,113 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { default as useSWR } from 'swr';
+import { MyST } from 'myst-to-react';
+import { HoverPopover } from './hover-popover';
+import { useAnalytics } from '@curvenote/theme-ui';
+import { useCallback } from 'react';
+import { captureContentLinkClicked, useContentEnrichmentDisplay, } from '../utils/content-analytics';
+// ─── Bluesky logo SVG ──────────────────────────────────────────────────────────
+// Official logomark from github.com/bluesky-social/social-app
+function BskyIcon() {
+    return (_jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", className: "flex-shrink-0", children: _jsx("path", { d: "M6.335 4.212c2.293 1.76 4.76 5.327 5.665 7.241.906-1.914 3.372-5.482 5.665-7.241C19.319 2.942 22 1.96 22 5.086c0 .624-.35 5.244-.556 5.994-.713 2.608-3.315 3.273-5.629 2.87 4.045.704 5.074 3.035 2.852 5.366-4.22 4.426-6.066-1.111-6.54-2.53-.086-.26-.126-.382-.127-.278 0-.104-.041.018-.128.278-.473 1.419-2.318 6.956-6.539 2.53-2.222-2.331-1.193-4.662 2.852-5.366-2.314.403-4.916-.262-5.63-2.87C2.35 10.33 2 5.71 2 5.086c0-3.126 2.68-2.144 4.335-.874Z" }) }));
+}
+// ─── Helpers ──────────────────────────────────────────────────────────────────
+function fmt(n) {
+    if (n == null)
+        return '0';
+    if (n >= 1_000_000)
+        return `${(n / 1_000_000).toFixed(1)}M`;
+    if (n >= 1_000)
+        return `${(n / 1_000).toFixed(1)}K`;
+    return String(n);
+}
+const profileFetcher = (url) => fetch(url).then(async (res) => {
+    if (!res.ok) {
+        const body = await res.json().catch(() => ({}));
+        throw new Error(body.message || res.statusText);
+    }
+    return res.json();
+});
+// ─── Profile card ─────────────────────────────────────────────────────────────
+function BlueskyProfileCard({ handle, engagementSurface = 'hover_card', }) {
+    const capture = useAnalytics();
+    const apiUrl = `https://api.bsky.app/xrpc/app.bsky.actor.getProfile?actor=${encodeURIComponent(handle)}`;
+    const { data, error } = useSWR(apiUrl, profileFetcher, {
+        revalidateOnFocus: false,
+        revalidateOnReconnect: false,
+        dedupingInterval: 60_000,
+        errorRetryCount: 2,
+        errorRetryInterval: 1_000,
+    });
+    const profileUrl = `https://bsky.app/profile/${handle}`;
+    const captureProfileLinkClick = useCallback(() => {
+        captureContentLinkClicked(capture, {
+            linkKind: 'bluesky_profile',
+            destinationUrl: profileUrl,
+            engagementSurface,
+            cardKind: 'bluesky_profile',
+            properties: { handle },
+        });
+    }, [capture, engagementSurface, handle, profileUrl]);
+    const enrichmentOutcome = !data && !error ? 'loading' : error || !data ? 'error' : 'success';
+    useContentEnrichmentDisplay({
+        capture,
+        enrichmentSource: 'bluesky_profile',
+        outcome: enrichmentOutcome,
+        cardKind: 'bluesky_profile',
+        engagementSurface,
+        properties: { handle },
+    });
+    // Skeleton
+    if (!data && !error) {
+        return (_jsxs("div", { className: "w-[420px] max-w-[420px] rounded-2xl overflow-hidden border border-gray-200 dark:border-gray-700 bg-white dark:bg-[#16202a] shadow-md", children: [_jsx("div", { className: "w-full h-[120px] bg-gradient-to-br from-[#0085ff] via-[#0060c4] to-[#6a00f4]" }), _jsxs("div", { className: "px-4 pb-4", children: [_jsx("div", { className: "mt-[-36px] mb-2.5 inline-block", children: _jsx("div", { className: "w-[72px] h-[72px] rounded-full border-[3px] border-white dark:border-[#16202a] bg-gray-200 dark:bg-gray-700 animate-pulse" }) }), _jsx("div", { className: "h-5 w-[55%] bg-gray-200 dark:bg-gray-700 rounded animate-pulse mb-2" }), _jsx("div", { className: "h-3.5 w-[35%] bg-gray-200 dark:bg-gray-700 rounded animate-pulse mb-3.5" }), _jsx("div", { className: "h-3 w-[90%] bg-gray-200 dark:bg-gray-700 rounded animate-pulse mb-1.5" }), _jsx("div", { className: "h-3 w-[55%] bg-gray-200 dark:bg-gray-700 rounded animate-pulse" })] })] }));
+    }
+    // Error
+    if (error || !data) {
+        return (_jsx("div", { className: "w-[420px] max-w-[420px] rounded-2xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-[#16202a] shadow-md", children: _jsxs("div", { className: "flex items-start gap-2.5 p-5 text-sm text-red-500 dark:text-red-400", children: [_jsx("span", { children: "\u26A0" }), _jsxs("span", { children: ["Failed to load @", handle, ": ", _jsx("em", { children: error?.message })] })] }) }));
+    }
+    const initials = (data.displayName || data.handle || '?')[0].toUpperCase();
+    return (_jsxs("div", { className: "w-[420px] max-w-[420px] rounded-2xl overflow-hidden border border-gray-200 dark:border-gray-700 bg-white dark:bg-[#16202a] text-[#0f1419] dark:text-[#e7e9ea] shadow-md", children: [_jsx("div", { className: "w-full h-[120px] overflow-hidden", children: data.banner ? (_jsx("img", { src: data.banner, alt: "", className: "block object-cover my-0 w-full h-full" })) : (_jsx("div", { className: "w-full h-full bg-gradient-to-br from-[#0085ff] via-[#0060c4] to-[#6a00f4]" })) }), _jsxs("div", { className: "px-4 pb-3.5", children: [_jsx("div", { className: "mt-[-36px] mb-2.5 inline-block", children: data.avatar ? (_jsx("img", { src: data.avatar, alt: data.displayName || data.handle, className: "w-[72px] h-[72px] rounded-full object-cover border-[3px] border-white dark:border-[#16202a] shadow my-0" })) : (_jsx("div", { className: "w-[72px] h-[72px] rounded-full bg-gradient-to-br from-[#0085ff] to-[#6a00f4] flex items-center justify-center text-white text-3xl font-bold border-[3px] border-white dark:border-[#16202a] shadow", children: initials })) }), _jsxs("div", { className: "mb-2", children: [_jsx("div", { className: "text-lg font-extrabold tracking-tight leading-tight", children: data.displayName || data.handle }), _jsxs("div", { className: "text-sm text-[#536471] dark:text-[#8b98a5] mt-0.5", children: ["@", data.handle] })] }), data.description && (_jsx("p", { className: "mb-3 text-sm leading-snug whitespace-pre-wrap break-words", children: data.description })), _jsx("div", { className: "flex flex-wrap gap-4 mb-3", children: [
+                            [fmt(data.followersCount), 'Followers'],
+                            [fmt(data.followsCount), 'Following'],
+                            [fmt(data.postsCount), 'Posts'],
+                        ].map(([num, label]) => (_jsxs("div", { className: "flex gap-1 items-baseline", children: [_jsx("span", { className: "text-sm font-bold", children: num }), _jsx("span", { className: "text-xs text-[#536471] dark:text-[#8b98a5]", children: label })] }, label))) }), _jsx("div", { className: "flex justify-end mt-1", children: _jsxs("a", { href: profileUrl, target: "_blank", rel: "noopener noreferrer", onClick: (e) => {
+                                e.stopPropagation();
+                                captureProfileLinkClick();
+                            }, className: "text-xs text-[#0085ff] no-underline inline-flex items-center gap-1 opacity-70 hover:opacity-100 hover:underline transition-opacity", children: [_jsx(BskyIcon, {}), "View on Bluesky"] }) })] })] }));
+}
+// ─── Renderers ────────────────────────────────────────────────────────────────
+export const BlueskyBlockRenderer = ({ node }) => {
+    const { handle } = (node.data ?? {});
+    if (!handle)
+        return null;
+    return _jsx(BlueskyProfileCard, { handle: handle, engagementSurface: "inline_block" });
+};
+export const BlueskyLinkRenderer = ({ node }) => {
+    const capture = useAnalytics();
+    const { handle, kind } = (node.data ?? {});
+    const captureTriggerClick = useCallback(() => {
+        if (!node.url)
+            return;
+        captureContentLinkClicked(capture, {
+            linkKind: kind === 'profile' ? 'bluesky_profile' : 'bluesky_post',
+            destinationUrl: node.url,
+            engagementSurface: 'trigger',
+            cardKind: kind === 'profile' ? 'bluesky_profile' : undefined,
+            properties: { handle, blueskyKind: kind },
+        });
+    }, [capture, handle, kind, node.url]);
+    // Only profile cards are implemented; fall back to a plain link for posts
+    // or any URL we couldn't fully parse.
+    if (!handle || kind !== 'profile') {
+        return (_jsx("a", { href: node.url, target: "_blank", rel: "noopener noreferrer", onClick: captureTriggerClick, children: _jsx(MyST, { ast: node.children }) }));
+    }
+    return (_jsx(HoverPopover, { card: _jsx(BlueskyProfileCard, { handle: handle, engagementSurface: "hover_card" }), analytics: { cardKind: 'bluesky_profile', properties: { handle } }, children: _jsx("a", { href: node.url, target: "_blank", rel: "noopener noreferrer", onClick: captureTriggerClick, children: _jsx(MyST, { ast: node.children }) }) }));
+};
+export const BLUESKY_LINK_RENDERERS = {
+    link: {
+        'link[protocol=bluesky]': BlueskyLinkRenderer,
+    },
+    block: {
+        'block[kind=bluesky]': BlueskyBlockRenderer,
+    },
+};

package/dist/components/cite-figurebar.d.ts

@@ -1,5 +1,6 @@
-export declare function CiteFigureBar({ doi: doiString, className }: {
+export declare function CiteFigureBar({ doi: doiString, citeLabel, className, }: {
     doi: string;
+    citeLabel: string;
     className?: string;
 }): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=cite-figurebar.d.ts.map

package/dist/components/cite-figurebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cite-figurebar.d.ts","sourceRoot":"","sources":["../../src/components/cite-figurebar.tsx"],"names":[],"mappings":"AAwFA,wBAAgB,aAAa,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,kDA2D/F"}
+{"version":3,"file":"cite-figurebar.d.ts","sourceRoot":"","sources":["../../src/components/cite-figurebar.tsx"],"names":[],"mappings":"AAkJA,wBAAgB,aAAa,CAAC,EAC5B,GAAG,EAAE,SAAS,EACd,SAAS,EACT,SAAS,GACV,EAAE;IACD,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,kDA4EA"}

package/dist/components/cite-figurebar.js

@@ -1,10 +1,32 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
 import useSWR from 'swr';
 import { selectAll } from 'unist-util-select';
 import { Image, LightboxContainer } from '@curvenote/theme-ui';
 import { cn } from '@curvenote/react-utils';
 import { MyST } from 'myst-to-react';
 import { doi } from 'doi-utils';
+import { useAnalytics } from '@curvenote/theme-ui';
+import { useContentEnrichmentDisplay } from '../utils/content-analytics';
+const OPENRXIV_READER = 'https://reader.openrxivlabs.org';
+// DOI prefixes served by the openRxiv reader: bioRxiv/medRxiv (10.1101) and openRxiv (10.64898).
+// These fetch full content from the reader; everything else falls back to the curvenote overlay.
+const OPENRXIV_PREFIXES = new Set(['10.1101', '10.64898']);
+// Picks the content endpoint for a cited DOI. Reader responses use relative `/img/...` urls, so
+// we also return the base they resolve against; overlay responses already have absolute image urls.
+function contentSource(doiString) {
+    const normalized = doi.normalize(doiString);
+    const prefix = normalized?.split('/')[0];
+    if (normalized && prefix && OPENRXIV_PREFIXES.has(prefix)) {
+        return { url: `${OPENRXIV_READER}/content/${normalized}.json`, imageBase: OPENRXIV_READER };
+    }
+    return { url: `https://overlay.curvenote.dev/doi/${normalized}.json` };
+}
+function resolveImageUrl(url, base) {
+    if (!url || !base || /^https?:\/\//i.test(url))
+        return url;
+    return `${base}${url.startsWith('/') ? '' : '/'}${url}`;
+}
 // Fetcher function for the OpenRxiv API
 async function openRxivFetcher(url) {
     const response = await fetch(url);
@@ -29,45 +51,69 @@ function useOpenRxivData(url) {
     };
 }
 // Specialized image component for figures
-function FigureImageComponent({ image, caption, }) {
-    return (_jsx("div", { className: "overflow-hidden relative bg-gray-50 rounded-lg", children: _jsx(Image, { src: image.url, srcOptimized: image.urlOptimized, urlSource: image.urlSource, alt: image.alt || 'Figure', className: "object-cover w-full h-auto", caption: caption }) }));
+function FigureImageComponent({ figure, citeLabel, citeDoi, onError, }) {
+    const capture = useAnalytics();
+    return (_jsx("div", { className: cn('overflow-hidden relative bg-gray-50 rounded-lg h-40', 
+        // Force a constant height and contain the figure regardless of whether the
+        // Image wraps the <img> in a <picture> (when an optimized source exists).
+        '[&_picture]:block [&_picture]:w-full [&_picture]:h-full', '[&_img]:w-full [&_img]:h-full [&_img]:object-contain'), children: _jsx(Image, { src: figure.src, srcOptimized: figure.srcOptimized, urlSource: figure.urlSource, alt: figure.alt || 'Figure', caption: figure.caption, onError: onError, onLightboxOpen: () => capture('content_image_lightbox_opened', {
+                surface: 'content',
+                imageSource: 'cite_figure_bar',
+                citeLabel,
+                citeDoi,
+                imageUrl: figure.src,
+                imageAlt: figure.alt,
+            }) }) }));
 }
 // Main component that renders up to 3 figures
-export function CiteFigureBar({ doi: doiString, className }) {
-    const url = `https://overlay.curvenote.dev/doi/${doi.normalize(doiString)}.json`;
+export function CiteFigureBar({ doi: doiString, citeLabel, className, }) {
+    const { url, imageBase } = contentSource(doiString);
     const { data, error, isLoading } = useOpenRxivData(url);
-    if (isLoading || error || !data?.mdast) {
-        return null;
-    }
-    // Extract figure containers from the mdast
-    const figures = selectAll('container[kind=figure]', data.mdast);
-    // Take only the first 3 figures
-    const displayFigures = figures.slice(0, 3);
-    if (displayFigures.length === 0) {
-        return null;
-    }
-    const imageList = figures
+    const capture = useAnalytics();
+    // `src` of images that failed to load — these figures are dropped from the bar.
+    const [failed, setFailed] = useState(new Set());
+    const allFigures = (data?.mdast ? selectAll('container[kind=figure]', data.mdast) : [])
         .map((figure) => {
         const image = figure.children.find((child) => child.type === 'image');
         const caption = figure.children.find((child) => child.type === 'caption');
         if (!image)
             return null;
         return {
-            src: image.url,
-            srcOptimized: image.urlOptimized,
+            key: figure.key,
+            src: resolveImageUrl(image.url, imageBase) ?? image.url,
+            srcOptimized: resolveImageUrl(image.urlOptimized, imageBase),
             urlSource: image.urlSource,
             alt: image.alt,
             caption: caption,
         };
     })
-        .filter((image) => image !== null);
-    return (_jsx(LightboxContainer, { imageList: imageList, children: _jsx("div", { className: cn('grid grid-cols-1 gap-4 md:grid-cols-3', className), children: displayFigures.map((figure, index) => {
-                // Find the image within the figure container
-                const image = figure.children.find((child) => child.type === 'image');
-                const caption = figure.children.find((child) => child.type === 'caption');
-                if (!image) {
-                    return null;
-                }
-                return (_jsxs("div", { className: "flex flex-col", children: [_jsx(FigureImageComponent, { image: image, caption: caption }), _jsx(MyST, { ast: caption, className: "text-xs line-clamp-5" })] }, figure.key || index));
-            }) }) }));
+        .filter((figure) => figure !== null);
+    // Remove figures whose image failed to load, then show up to 3.
+    const visibleFigures = allFigures.filter((figure) => !failed.has(figure.src));
+    const displayFigures = visibleFigures.slice(0, 3);
+    const enrichmentOutcome = error ? 'error' : displayFigures.length > 0 ? 'success' : 'empty';
+    useContentEnrichmentDisplay({
+        capture,
+        enrichmentSource: 'openrxiv',
+        outcome: enrichmentOutcome,
+        cardKind: 'citation',
+        engagementSurface: 'hover_card',
+        enabled: !isLoading,
+        properties: { citeLabel, citeDoi: doiString, figureCount: displayFigures.length },
+    });
+    if (isLoading || error || !data?.mdast) {
+        return null;
+    }
+    if (displayFigures.length === 0) {
+        return null;
+    }
+    const markFailed = (src) => setFailed((prev) => (prev.has(src) ? prev : new Set(prev).add(src)));
+    const imageList = visibleFigures.map((figure) => ({
+        src: figure.src,
+        srcOptimized: figure.srcOptimized,
+        urlSource: figure.urlSource,
+        alt: figure.alt,
+        caption: figure.caption,
+    }));
+    return (_jsx(LightboxContainer, { imageList: imageList, children: _jsx("div", { className: cn('grid grid-cols-1 gap-4 md:grid-cols-3', className), children: displayFigures.map((figure, index) => (_jsxs("div", { className: "flex flex-col", children: [_jsx(FigureImageComponent, { figure: figure, citeLabel: citeLabel, citeDoi: doiString, onError: () => markFailed(figure.src) }), _jsx(MyST, { ast: figure.caption, className: "text-xs line-clamp-5" })] }, figure.key || index))) }) }));
 }

package/dist/components/cite.d.ts

@@ -1,6 +1,17 @@
 import type { NodeRenderer } from '@myst-theme/providers';
 import type { GenericParent } from 'myst-common';
 export declare const CiteGroup: NodeRenderer<GenericParent>;
+/**
+ * Conservatively recover a `https://doi.org/...` URL from a known publisher URL.
+ *
+ * Only URLs that map unambiguously to a DOI are handled. Anything we are not
+ * confident about returns `undefined` rather than guessing.
+ *
+ * @example
+ * doiUrlFromPublisherUrl('https://www.nature.com/articles/s41586-024-07441-w')
+ * // => 'https://doi.org/10.1038/s41586-024-07441-w'
+ */
+export declare function doiUrlFromPublisherUrl(refUrl?: string): string | undefined;
 export declare const Cite: ({ label, error, children, className, }: {
     label?: string;
     error?: boolean;

package/dist/components/cite.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cite.d.ts","sourceRoot":"","sources":["../../src/components/cite.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAoHjD,eAAO,MAAM,SAAS,EAAE,YAAY,CAAC,aAAa,CAiBjD,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,wCAKlB;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,4CAkCA,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,YAO1B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAGvD,CAAC"}
+{"version":3,"file":"cite.d.ts","sourceRoot":"","sources":["../../src/components/cite.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAoLjD,eAAO,MAAM,SAAS,EAAE,YAAY,CAAC,aAAa,CAiBjD,CAAC;AAWF;;;;;;;;;GASG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAW1E;AAoBD,eAAO,MAAM,IAAI,GAAI,wCAKlB;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,4CAkEA,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,YAO1B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAGvD,CAAC"}

package/dist/components/cite.js

@@ -1,23 +1,27 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useReferences, useSiteManifest } from '@myst-theme/providers';
 import { doi } from 'doi-utils';
-import { HoverPopover, MyST } from 'myst-to-react';
+import { MyST } from 'myst-to-react';
+import { HoverPopover } from './hover-popover';
 import { createId } from 'myst-common';
 import { visit } from 'unist-util-visit';
 import { cn } from '@curvenote/react-utils';
 import { InlineError } from './inlineError';
 import { useOpenAlexWork } from '../hooks/useOpenAlex';
 import { reverseInvertedAbstract, formatAuthors } from '../utils/abstract';
-import { LinkCard } from '@curvenote/theme-ui';
+import { LinkCard, useAnalytics } from '@curvenote/theme-ui';
 import { CiteFigureBar } from './cite-figurebar';
 import { fromHtml } from 'hast-util-from-html';
 import { toMdast } from 'hast-util-to-mdast';
 import { CiteYouTube, isYouTubeUrl } from './cite-youtube';
+import { useCallback } from 'react';
+import { captureContentCiteClicked, captureContentLinkClicked, useContentEnrichmentDisplay, } from '../utils/content-analytics';
 // TODO:
 // this should be turned into an upgrade step when we do citations.
 // We are only expecting very basic HTML in the citations, so this should be fine.
 function convertHtmlToMdast(html) {
     const hast = fromHtml(html, { fragment: true });
+    // The types play better hast-util-to-mdast@10, but we downgraded to 8 to align with myst.
     const mdast = toMdast(hast);
     // Ensure all nodes have a keys for react rendering errors
     visit(mdast, (node) => {
@@ -30,16 +34,56 @@ function useNumberedReferences() {
     const numbered_references = !!config?.options?.numbered_references;
     return numbered_references;
 }
-function CiteChild({ html, doi: doiString, url }) {
+function CiteChild({ html, doi: doiString, url, citeLabel, }) {
+    const capture = useAnalytics();
     const { data: openAlexData, error, isLoading } = useOpenAlexWork(doiString);
-    if (doiString && !error) {
+    const citeProperties = { citeLabel, doi: doiString, url };
+    const showOpenAlexCard = Boolean(doiString && doi.validate(doiString) && !error);
+    const openAlexOutcome = isLoading
+        ? 'loading'
+        : error
+            ? 'error'
+            : openAlexData
+                ? 'success'
+                : 'empty';
+    useContentEnrichmentDisplay({
+        capture,
+        enrichmentSource: 'openalex',
+        outcome: openAlexOutcome,
+        cardKind: 'citation',
+        engagementSurface: 'hover_card',
+        enabled: Boolean(doiString),
+        properties: {
+            citeLabel,
+            doi: doiString,
+            url,
+            hasAbstract: Boolean(openAlexData?.abstract_inverted_index),
+            hasTitle: Boolean(openAlexData?.title),
+        },
+    });
+    useContentEnrichmentDisplay({
+        capture,
+        enrichmentSource: 'cite_html',
+        outcome: 'fallback',
+        cardKind: 'citation',
+        engagementSurface: 'hover_card',
+        enabled: !showOpenAlexCard,
+        properties: { citeLabel, doi: doiString, url, hasYouTube: Boolean(url && isYouTubeUrl(url)) },
+    });
+    if (showOpenAlexCard && ['success', 'loading'].includes(openAlexOutcome)) {
         const abstract = openAlexData?.abstract_inverted_index
             ? reverseInvertedAbstract(openAlexData.abstract_inverted_index)
             : '';
         const authors = formatAuthors(openAlexData?.authorships);
         const journal = openAlexData?.primary_location?.source?.display_name;
         const year = openAlexData?.publication_year;
-        return (_jsx(LinkCard, { url: doi.buildUrl(doiString), title: journal && year ? `${journal} (${year})` : journal || year, size: "lg", description: _jsxs("div", { className: "flex flex-col gap-3 max-w-none prose", children: [openAlexData?.title && (_jsx("div", { className: "flex flex-col gap-1 font-bold", children: _jsx("div", { className: "text-sm leading-relaxed", children: openAlexData.title.replace(/<[^>]+>/g, '') }) })), authors && (_jsx("div", { className: "flex flex-col gap-1", children: _jsx("div", { className: "text-sm", children: authors }) })), abstract && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-xs font-bold", children: "Abstract" }), _jsx("div", { className: "overflow-y-auto max-h-48 text-xs leading-relaxed", children: abstract })] })), _jsx(CiteFigureBar, { doi: doiString }), isLoading && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-sm font-medium text-gray-900", children: "DOI" }), _jsx("div", { className: "text-sm", children: doiString }), _jsx("div", { className: "text-xs text-gray-500", children: "Loading additional information..." })] })), error && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-sm font-medium text-gray-900", children: "DOI" }), _jsx("div", { className: "text-sm", children: doiString }), _jsx("div", { className: "text-xs text-gray-500", children: "Unable to load additional information" })] })), !isLoading && !error && !openAlexData && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-sm font-medium text-gray-900", children: "DOI" }), _jsx("div", { className: "text-sm", children: doiString })] }))] }) }));
+        return (_jsx(LinkCard, { url: doi.buildUrl(doiString), title: journal && year ? `${journal} (${year})` : journal || year, size: "lg", onLinkClick: () => captureContentLinkClicked(capture, {
+                linkKind: 'citation',
+                destinationUrl: doi.buildUrl(doiString),
+                engagementSurface: 'hover_card',
+                cardKind: 'citation',
+                properties: citeProperties,
+            }), description: _jsxs("div", { className: "flex flex-col gap-3 max-w-none prose", children: [openAlexData?.title && (_jsx("div", { className: "flex flex-col gap-1 font-bold", children: _jsx("div", { className: "text-sm leading-relaxed", children: openAlexData.title.replace(/<[^>]+>/g, '') }) })), authors && (_jsx("div", { className: "flex flex-col gap-1", children: _jsx("div", { className: "text-sm", children: authors }) })), abstract && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-xs font-bold", children: "Abstract" }), _jsx("div", { className: "overflow-y-auto max-h-48 text-xs leading-relaxed", children: abstract })] })), _jsx(CiteFigureBar, { doi: doiString, citeLabel: citeLabel }), isLoading && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-sm font-medium text-gray-900", children: "DOI" }), _jsx("div", { className: "text-sm", children: doiString }), _jsx("div", { className: "text-xs text-gray-500", children: "Loading additional information..." })] })), error && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-sm font-medium text-gray-900", children: "DOI" }), _jsx("div", { className: "text-sm", children: doiString }), _jsx("div", { className: "text-xs text-gray-500", children: "Unable to load additional information" })] })), !isLoading && !error && !openAlexData && (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "text-sm font-medium text-gray-900", children: "DOI" }), _jsx("div", { className: "text-sm", children: doiString })] }))] }) }));
     }
     const mdast = convertHtmlToMdast(html);
     return (_jsxs("div", { className: "hover-document article w-[500px] sm:max-w-[500px] p-3", children: [url && isYouTubeUrl(url) && _jsx(CiteYouTube, { url: url }), _jsx(MyST, { ast: mdast })] }));
@@ -53,18 +97,96 @@ export const CiteGroup = ({ node, className }) => {
             parenthetical: node.kind === 'parenthetical',
         }, className), children: _jsx(MyST, { ast: node.children }) }));
 };
+function isUrl(url) {
+    try {
+        new URL(url);
+        return true;
+    }
+    catch {
+        return false;
+    }
+}
+/**
+ * Conservatively recover a `https://doi.org/...` URL from a known publisher URL.
+ *
+ * Only URLs that map unambiguously to a DOI are handled. Anything we are not
+ * confident about returns `undefined` rather than guessing.
+ *
+ * @example
+ * doiUrlFromPublisherUrl('https://www.nature.com/articles/s41586-024-07441-w')
+ * // => 'https://doi.org/10.1038/s41586-024-07441-w'
+ */
+export function doiUrlFromPublisherUrl(refUrl) {
+    if (!refUrl || !isUrl(refUrl))
+        return undefined;
+    const parsed = new URL(refUrl);
+    const host = parsed.hostname.replace(/^www\./, '');
+    // Nature (Springer Nature) articles use the DOI prefix 10.1038 and embed the
+    // suffix directly in the path, e.g. /articles/s41586-024-07441-w
+    if (host === 'nature.com') {
+        const match = parsed.pathname.match(/^\/articles\/([a-z0-9.-]+)$/i);
+        if (match)
+            return `https://doi.org/10.1038/${match[1]}`;
+    }
+    return undefined;
+}
+function getDoi(doiString, refUrl) {
+    const cleanDoi = doi.validate(doiString);
+    if (cleanDoi)
+        return doi.buildUrl(doiString);
+    const url = getUrl(doiString, refUrl);
+    if (!url || !isUrl(url))
+        return undefined;
+    const publisherDoi = doiUrlFromPublisherUrl(url);
+    if (publisherDoi)
+        return publisherDoi;
+    return undefined;
+}
+function getUrl(doiString, refUrl) {
+    const cleanDoi = doi.validate(doiString);
+    if (cleanDoi)
+        return doi.buildUrl(doiString);
+    if (refUrl && isUrl(refUrl))
+        return refUrl;
+    if (doiString && isUrl(doiString))
+        return doiString;
+    return undefined;
+}
 export const Cite = ({ label, error, children, className, }) => {
     const references = useReferences();
+    const capture = useAnalytics();
     if (!label) {
         return (_jsx(InlineError, { value: "cite (no label)", message: 'Citation Has No Label', className: className }));
     }
-    const { html, doi: doiString, url: refUrl } = references?.cite?.data[label] ?? {};
+    const { html, doi: doiStringData, url: refUrlData } = references?.cite?.data[label] ?? {};
+    const doiString = getDoi(doiStringData, refUrlData);
+    const url = getUrl(doiStringData, refUrlData);
     if (error) {
         return _jsx(InlineError, { value: label, message: 'Citation Not Found', className: className });
     }
-    const url = doiString ? doi.buildUrl(doiString) : refUrl;
     const isButtonLike = (className ?? '').split(' ').includes('button');
-    return (_jsx(HoverPopover, { openDelay: 300, card: _jsx(CiteChild, { html: html, doi: doiString, url: url }), children: _jsxs("cite", { className: className, children: [url && (_jsx("a", { href: url, target: "_blank", rel: "noreferrer", className: cn({ 'hover-link': !isButtonLike }), children: children })), !url && _jsx("span", { className: "hover-link", children: children })] }) }));
+    const captureTriggerClick = useCallback(() => {
+        if (url) {
+            captureContentLinkClicked(capture, {
+                linkKind: 'citation',
+                destinationUrl: url,
+                engagementSurface: 'trigger',
+                cardKind: 'citation',
+                properties: { citeLabel: label, doi: doiString, url },
+            });
+            return;
+        }
+        captureContentCiteClicked(capture, {
+            citeLabel: label,
+            doi: doiString,
+            hasUrl: false,
+            engagementSurface: 'trigger',
+        });
+    }, [capture, url, label, doiString]);
+    return (_jsx(HoverPopover, { openDelay: 300, card: _jsx(CiteChild, { html: html, doi: doiString, url: url, citeLabel: label }), analytics: {
+            cardKind: 'citation',
+            properties: { citeLabel: label, doi: doiString, url },
+        }, children: _jsxs("cite", { className: className, children: [url && (_jsx("a", { href: url, target: "_blank", rel: "noreferrer", className: cn({ 'hover-link': !isButtonLike }), onClick: captureTriggerClick, children: children })), !url && (_jsx("span", { className: "hover-link", onClick: captureTriggerClick, children: children }))] }) }));
 };
 export const CiteRenderer = ({ node, className }) => {
     const numbered = useNumberedReferences();

package/dist/components/copy-icon.d.ts

@@ -0,0 +1,11 @@
+export type CopyIconAnalytics = {
+    contentKind?: string;
+    properties?: Record<string, unknown>;
+};
+export type CopyIconProps = {
+    text: string;
+    className?: string;
+    analytics?: CopyIconAnalytics;
+};
+export declare function CopyIcon({ text, className, analytics }: CopyIconProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=copy-icon.d.ts.map