jamdesk 1.1.126 → 1.1.128

package/vendored/components/AIActionsMenu.tsx

@@ -79,6 +79,16 @@ function FileTextIcon({ className }: { className?: string }) {
   );
 }
 
+function DownloadIcon({ className }: { className?: string }) {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}>
+      <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
+      <polyline points="7 10 12 15 17 10" />
+      <line x1="12" y1="15" x2="12" y2="3" />
+    </svg>
+  );
+}
+
 function PlugIcon({ className }: { className?: string }) {
   return (
     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}>
@@ -150,7 +160,7 @@ function VSCodeIcon({ className }: { className?: string }) {
 // BUILTIN OPTION METADATA
 // =============================================================================
 
-const BUILTIN_OPTIONS: Record<string, BuiltinOptionMeta> = {
+export const BUILTIN_OPTIONS: Record<string, BuiltinOptionMeta> = {
   copy: {
     title: 'Copy page',
     description: 'Copy page as Markdown for LLMs',
@@ -205,6 +215,12 @@ const BUILTIN_OPTIONS: Record<string, BuiltinOptionMeta> = {
     icon: <VSCodeIcon className="w-4 h-4" />,
     isExternal: true,
   },
+  'download-api-spec': {
+    title: 'Download API spec',
+    description: 'Download all OpenAPI specs as a zip',
+    icon: <DownloadIcon className="w-4 h-4" />,
+    isExternal: false,
+  },
 };
 
 // =============================================================================
@@ -244,6 +260,20 @@ function buildMcpServerName(projectName: string): string {
   return `${slug}-docs`;
 }
 
+/** Absolute URL of the site's api-specs.zip, honoring the hostAtDocs link prefix. */
+export function buildApiSpecZipUrl(origin: string, linkPrefix: string): string {
+  return `${origin}${linkPrefix}/api-specs.zip`;
+}
+
+/**
+ * True only for a real zip response. Guards the download from saving a 404 body
+ * or the password-unlock HTML page (both return 200 text/html) as "api-specs.zip".
+ */
+export function isZipContentType(contentType: string): boolean {
+  const ct = contentType.toLowerCase();
+  return ct.includes('zip') || ct.includes('octet-stream');
+}
+
 function buildMcpConfig(projectName: string, mcpUrl: string) {
   return {
     mcpServers: {
@@ -293,7 +323,9 @@ export function AIActionsMenu({ options, projectName }: AIActionsMenuProps) {
   const [isOpen, setIsOpen] = useState(false);
   const [copyFeedback, setCopyFeedback] = useState<FeedbackState>('idle');
   const [mcpFeedback, setMcpFeedback] = useState<FeedbackState>('idle');
+  const [downloadFeedback, setDownloadFeedback] = useState<FeedbackState>('idle');
   const copyLoadingRef = useRef(false);
+  const downloadLoadingRef = useRef(false);
   const closeTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const menuRef = useRef<HTMLDivElement>(null);
   const triggerRef = useRef<HTMLButtonElement>(null);
@@ -306,6 +338,7 @@ export function AIActionsMenu({ options, projectName }: AIActionsMenuProps) {
   const mdRelativePath = `${pathname}.md`;
   const mdAbsoluteUrl = `${origin}${pathname}.md`;
   const mcpUrl = `${origin}${linkPrefix}/_mcp`;
+  const apiSpecZipUrl = buildApiSpecZipUrl(origin, linkPrefix);
 
   // Close on navigation
   useEffect(() => {
@@ -336,6 +369,7 @@ export function AIActionsMenu({ options, projectName }: AIActionsMenuProps) {
   // Reset feedback states after 2s
   useFeedbackTimer(copyFeedback, setCopyFeedback);
   useFeedbackTimer(mcpFeedback, setMcpFeedback);
+  useFeedbackTimer(downloadFeedback, setDownloadFeedback);
 
   const handleCopy = useCallback(async () => {
     if (copyLoadingRef.current) return;
@@ -384,6 +418,35 @@ export function AIActionsMenu({ options, projectName }: AIActionsMenuProps) {
     }
   }, [projectName, mcpUrl]);
 
+  const handleDownloadSpec = useCallback(async () => {
+    if (downloadLoadingRef.current) return;
+    downloadLoadingRef.current = true;
+    setDownloadFeedback('loading');
+    try {
+      const res = await fetch(apiSpecZipUrl);
+      if (!res.ok) throw new Error(`Failed to fetch: ${res.status}`);
+      if (!isZipContentType(res.headers.get('content-type') || '')) {
+        throw new Error(`Unexpected content-type: ${res.headers.get('content-type')}`);
+      }
+      const blob = await res.blob();
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement('a');
+      a.href = url;
+      a.download = 'api-specs.zip';
+      document.body.appendChild(a);
+      a.click();
+      a.remove();
+      // Defer revoke: Safari fires the download asynchronously after click(),
+      // and revoking the object URL synchronously can cancel the download.
+      setTimeout(() => URL.revokeObjectURL(url), 100);
+      setDownloadFeedback('success');
+    } catch {
+      setDownloadFeedback('error');
+    } finally {
+      downloadLoadingRef.current = false;
+    }
+  }, [apiSpecZipUrl]);
+
   const handleAction = useCallback((option: ContextualOption) => {
     if (typeof option !== 'string') {
       // Custom option — open href
@@ -399,6 +462,9 @@ export function AIActionsMenu({ options, projectName }: AIActionsMenuProps) {
       case 'view':
         window.open(mdRelativePath, '_blank', 'noopener,noreferrer');
         break;
+      case 'download-api-spec':
+        handleDownloadSpec();
+        break;
       case 'chatgpt':
       case 'claude':
       case 'gemini':
@@ -434,13 +500,13 @@ export function AIActionsMenu({ options, projectName }: AIActionsMenuProps) {
     }
 
     // Close dropdown — copy actions close after brief delay so user sees feedback
-    if (option === 'copy' || option === 'mcp') {
+    if (option === 'copy' || option === 'mcp' || option === 'download-api-spec') {
       if (closeTimerRef.current) clearTimeout(closeTimerRef.current);
       closeTimerRef.current = setTimeout(() => setIsOpen(false), COPY_FEEDBACK_DELAY_MS);
     } else {
       setIsOpen(false);
     }
-  }, [handleCopy, handleMcpCopy, mdRelativePath, mdAbsoluteUrl, projectName, mcpUrl]);
+  }, [handleCopy, handleMcpCopy, handleDownloadSpec, mdRelativePath, mdAbsoluteUrl, projectName, mcpUrl]);
 
   // Keyboard navigation within dropdown
   const handleMenuKeyDown = useCallback((e: React.KeyboardEvent) => {
@@ -620,6 +686,9 @@ export function AIActionsMenu({ options, projectName }: AIActionsMenuProps) {
                 : option === 'mcp'
                 ? (mcpFeedback === 'success' ? <CheckIcon className="w-4 h-4 text-emerald-500" /> :
                    mcpFeedback === 'error' ? <XIcon className="w-4 h-4 text-red-500" /> : meta.icon)
+                : option === 'download-api-spec'
+                ? (downloadFeedback === 'success' ? <CheckIcon className="w-4 h-4 text-emerald-500" /> :
+                   downloadFeedback === 'error' ? <XIcon className="w-4 h-4 text-red-500" /> : meta.icon)
                 : meta.icon;
 
               return (

package/vendored/components/chat/ChatMessage.tsx

@@ -4,6 +4,7 @@ import { memo } from 'react';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import { ChatCodeBlock } from './ChatCodeBlock';
+import { CopyButton } from './CopyButton';
 import { useLinkPrefix } from '@/lib/link-prefix-context';
 import type { ChatMessage as ChatMessageType } from '@/hooks/useChat';
 
@@ -126,6 +127,13 @@ export const ChatMessage = memo(function ChatMessage({ message, onSelectOption }
             )}
           </div>
 
+          {/* Copy answer — only on a finalized, non-empty assistant message */}
+          {!message.isStreaming && message.content && (
+            <div className="mt-1 -ml-2">
+              <CopyButton getText={() => message.content} ariaLabel="Copy answer" />
+            </div>
+          )}
+
           {/* Clarification options — tappable buttons for disambiguation */}
           {hasClarificationOptions && (
             <div className="mt-3">

package/vendored/components/chat/ChatPanel.tsx

@@ -3,9 +3,13 @@
 import { useRef, useEffect, useLayoutEffect, useCallback, useState } from 'react';
 import { useChat } from '@/hooks/useChat';
 import { useBodyScrollLock } from '@/hooks/useBodyScrollLock';
+import { useChatPanelOptional } from '@/hooks/useChatPanel';
 import { ChatMessage } from './ChatMessage';
 import { ChatInput } from './ChatInput';
 import { ChatEmptyState } from './ChatEmptyState';
+import { CopyButton } from './CopyButton';
+import { formatTranscript } from '@/lib/chat-transcript';
+import { isNearBottom } from '@/lib/chat-scroll';
 import { crispAvailable, hideCrispLauncher, openCrispChat, showCrispLauncher } from '../../lib/crisp-bridge';
 
 const SOMETHING_ELSE_PATTERNS = ['something else', 'none of the above', 'none of these'];
@@ -43,6 +47,33 @@ interface ChatPanelProps {
 export function ChatPanel({ isOpen, onClose, starterQuestions, chatEndpoint, mode = 'overlay' }: ChatPanelProps) {
   const { messages, sendMessage, isLoading, abort, retry, clearChat, error, markClarificationSelected } = useChat(chatEndpoint);
 
+  // Search (and any external trigger) hands a question to chat via the
+  // ChatPanelContext. We append it as the next message — no clearChat — so an
+  // in-progress conversation is preserved. useChatPanelOptional (not the
+  // throwing useChatPanel) keeps ChatPanel renderable in unit tests / outside
+  // a provider.
+  const chatPanel = useChatPanelOptional();
+  const pendingQuestion = chatPanel?.pendingQuestion ?? null;
+  const consumePendingQuestion = chatPanel?.consumePendingQuestion;
+  const consumingRef = useRef(false);
+
+  useEffect(() => {
+    if (!pendingQuestion) {
+      consumingRef.current = false;
+      return;
+    }
+    // R1: sendMessage() is a no-op while a stream is in flight (useChat guards
+    // on isLoadingRef). Do NOT consume the question then — it would vanish.
+    // Hold it; isLoading is a dependency, so when the stream finishes the
+    // effect re-runs and delivers. consumingRef prevents an effect double-fire
+    // from sending twice within one delivery; it resets when pendingQuestion
+    // clears.
+    if (isLoading || consumingRef.current) return;
+    consumingRef.current = true;
+    sendMessage(pendingQuestion);
+    consumePendingQuestion?.();
+  }, [pendingQuestion, isLoading, sendMessage, consumePendingQuestion]);
+
   const [hasCrisp, setHasCrisp] = useState(false);
   useEffect(() => { setHasCrisp(crispAvailable()); }, []);
 
@@ -51,6 +82,15 @@ export function ChatPanel({ isOpen, onClose, starterQuestions, chatEndpoint, mod
     openCrispChat();
   }, [onClose]);
 
+  // "New chat" must also drop any not-yet-delivered handoff question. Otherwise
+  // a question queued mid-stream (held by the consume effect while isLoading)
+  // would fire into the freshly cleared conversation once clearChat()'s abort()
+  // flips isLoading false and the effect re-runs.
+  const handleNewChat = useCallback(() => {
+    clearChat();
+    consumePendingQuestion?.();
+  }, [clearChat, consumePendingQuestion]);
+
   const messagesContainerRef = useRef<HTMLDivElement>(null);
   const inputRef = useRef<HTMLDivElement>(null);
   const overlayPanelRef = useRef<HTMLDivElement>(null);
@@ -109,14 +149,29 @@ export function ChatPanel({ isOpen, onClose, starterQuestions, chatEndpoint, mod
     };
   }, [isOpen, isInline]);
 
-  // Auto-scroll to bottom when new messages arrive. Uses useLayoutEffect so
-  // scrollHeight is accurate (DOM is updated) and there's no visible 1-frame lag.
-  // Scrolls the container directly instead of scrollIntoView to avoid scrolling
-  // ancestor elements (which pushes the panel off-screen on mobile).
+  // Auto-scroll only when the user is already at the bottom. If they've
+  // scrolled up to re-read mid-stream, leave their position alone. We track
+  // "pinned" in a ref (not state) so updating it on every scroll event doesn't
+  // re-render. Direct container scroll (no scrollIntoView — that scrolls every
+  // ancestor; documented anti-pattern in CLAUDE.md).
+  const isPinnedToBottomRef = useRef(true);
+
+  const handleMessagesScroll = useCallback(() => {
+    const container = messagesContainerRef.current;
+    if (!container) return;
+    isPinnedToBottomRef.current = isNearBottom(
+      container.scrollTop,
+      container.scrollHeight,
+      container.clientHeight,
+    );
+  }, []);
+
   useLayoutEffect(() => {
     const container = messagesContainerRef.current;
     if (!container) return;
-    container.scrollTop = container.scrollHeight;
+    if (isPinnedToBottomRef.current) {
+      container.scrollTop = container.scrollHeight;
+    }
   }, [messages]);
 
   // Escape key handling is in useChatPanel (capture phase, with search-modal awareness)
@@ -152,9 +207,17 @@ export function ChatPanel({ isOpen, onClose, starterQuestions, chatEndpoint, mod
           </span>
         </div>
         <div className="flex items-center gap-1">
+          {/* R8: only when no message is mid-stream, so the transcript captures
+              the post-rewrite (absolute-URL) link form, not slug placeholders. */}
+          {hasMessages && !messages.some((m) => m.isStreaming) && (
+            <CopyButton
+              getText={() => formatTranscript(messages)}
+              ariaLabel="Copy transcript"
+            />
+          )}
           {hasMessages && (
             <button
-              onClick={clearChat}
+              onClick={handleNewChat}
               className="px-2 py-1 text-xs text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)] transition-colors rounded-md hover:bg-[var(--color-bg-secondary)] cursor-pointer focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-accent)]"
             >
               New chat
@@ -175,6 +238,7 @@ export function ChatPanel({ isOpen, onClose, starterQuestions, chatEndpoint, mod
         ref={messagesContainerRef}
         className="flex-1 overflow-y-auto min-h-0"
         style={{ overscrollBehavior: 'contain' }}
+        onScroll={handleMessagesScroll}
         aria-live="polite"
         aria-label="Chat messages"
       >

package/vendored/components/chat/CopyButton.tsx

@@ -0,0 +1,57 @@
+// builder/build-service/components/chat/CopyButton.tsx
+'use client';
+
+import { memo, useCallback, useEffect, useRef, useState } from 'react';
+
+interface CopyButtonProps {
+  /** Lazily produce the text to copy (so we don't recompute on every render). */
+  getText: () => string;
+  /** Accessible name + tooltip (e.g. "Copy answer", "Copy transcript"). */
+  ariaLabel: string;
+  /** Optional visible label rendered next to the icon (used by the transcript button). */
+  idleLabel?: string;
+  className?: string;
+}
+
+/**
+ * Clipboard button with a transient "copied" checkmark. Mirrors the copy
+ * pattern in ChatCodeBlock.tsx but reusable: powers both the per-answer copy
+ * and the "Copy transcript" header action. Fails silently when the Clipboard
+ * API is unavailable (non-HTTPS) or rejects (permission denied).
+ */
+export const CopyButton = memo(function CopyButton({ getText, ariaLabel, idleLabel, className }: CopyButtonProps) {
+  const [copied, setCopied] = useState(false);
+  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+
+  useEffect(() => () => {
+    if (timerRef.current) clearTimeout(timerRef.current);
+  }, []);
+
+  const handleCopy = useCallback(() => {
+    const text = getText();
+    if (!text || !navigator.clipboard?.writeText) return;
+    navigator.clipboard.writeText(text).then(() => {
+      setCopied(true);
+      if (timerRef.current) clearTimeout(timerRef.current);
+      timerRef.current = setTimeout(() => setCopied(false), 2000);
+    }).catch(() => {
+      // Clipboard write rejected (permissions) — leave UI unchanged.
+    });
+  }, [getText]);
+
+  return (
+    <button
+      type="button"
+      onClick={handleCopy}
+      aria-label={ariaLabel}
+      title={copied ? 'Copied!' : ariaLabel}
+      className={
+        className ??
+        'inline-flex items-center gap-1.5 px-2 py-1 text-xs text-[var(--color-text-muted)] hover:text-[var(--color-text-primary)] transition-colors rounded-md hover:bg-[var(--color-bg-secondary)] cursor-pointer focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--color-accent)]'
+      }
+    >
+      <i className={`fa-solid ${copied ? 'fa-check text-green-500' : 'fa-copy'}`} aria-hidden="true" />
+      {idleLabel && <span>{copied ? 'Copied' : idleLabel}</span>}
+    </button>
+  );
+});

package/vendored/components/layout/EmbedLinkInterceptor.tsx

@@ -0,0 +1,37 @@
+'use client';
+
+import type { ReactNode } from 'react';
+
+/**
+ * In embed mode the page lives inside a cross-origin iframe (the widget modal).
+ * Same-page hash anchors must scroll in-frame; any link that would navigate to
+ * a different page is broken OUT of the iframe into a new tab so users aren't
+ * trapped in the small modal. Uses event delegation so it covers MDX-rendered
+ * links without touching every anchor component. `display:contents` keeps the
+ * wrapper out of layout (prose CSS undisturbed) while clicks still bubble up.
+ */
+export function EmbedLinkInterceptor({ children }: { children: ReactNode }) {
+  const onClick = (e: React.MouseEvent<HTMLDivElement>) => {
+    // Defer entirely to the browser for modified / non-primary clicks: the user
+    // has already asked for new-tab (cmd/ctrl), new-window (shift) or background
+    // (middle) behavior — hijacking it would double-open or break their intent.
+    if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
+    const anchor = (e.target as HTMLElement).closest('a');
+    if (!anchor) return;
+    const href = anchor.getAttribute('href');
+    if (!href) return;
+    // Same-page hash anchors (and pure "#") scroll inside the frame — leave them.
+    if (href.startsWith('#')) return;
+    // Non-navigable schemes (mail/phone/js) must use their native handler,
+    // not a blank new tab.
+    if (/^(mailto:|tel:|javascript:)/i.test(href)) return;
+    e.preventDefault();
+    window.open(href, '_blank', 'noopener');
+  };
+
+  return (
+    <div onClick={onClick} style={{ display: 'contents' }}>
+      {children}
+    </div>
+  );
+}

package/vendored/components/layout/LayoutWrapper.tsx

@@ -15,6 +15,8 @@ import { getTheme, type ThemeName } from '@/themes';
 interface LayoutWrapperProps {
   config: DocsConfig;
   children: React.ReactNode;
+  /** When true, render content only — no Header, Sidebar, TabsNav, chat, or footer chrome. */
+  embed?: boolean;
 }
 
 /**
@@ -35,7 +37,7 @@ function useMediaQuery(query: string): boolean {
   return matches;
 }
 
-export function LayoutWrapper({ config, children }: LayoutWrapperProps) {
+export function LayoutWrapper({ config, children, embed }: LayoutWrapperProps) {
   const [isSidebarOpen, setIsSidebarOpen] = useState(false);
   // Chat button is shown in both dev and production so the layout matches.
   // In dev mode, clicking it shows a "production only" notice instead of opening the panel.
@@ -47,6 +49,32 @@ export function LayoutWrapper({ config, children }: LayoutWrapperProps) {
   // Handle hash navigation for three-column independent scroll layout
   useHashNavigation();
 
+  // Embed mode: render content only — no Header, Sidebar, TabsNav, chat,
+  // or footer chrome. Keeps theme + typography (provided by DocsChrome).
+  // Must appear AFTER all hook calls (Rules of Hooks).
+  if (embed) {
+    // Background sits on the full-height wrapper (not on <main> as in the
+    // chrome'd layouts) intentionally: embed has no sidebar column, so the
+    // wrapper IS the page surface.
+    return (
+      <div data-embed="true" className="min-h-screen bg-[var(--color-bg-primary)] transition-colors">
+        {/* Horizontal inset for embed content lives on the wrapper, not the
+            <article>: on mobile (<=1023px) the jam theme pins `#main-content
+            article` left/right padding to 0.5rem with !important, which an
+            article-level style can't beat — so the breathing room has to come
+            from a parent the rule doesn't target. The gradient (on <body>) and
+            the document scrollbar still reach the modal edge; only the content
+            insets. NOTE: that jam pin is mobile-only, so at >=1024px this wrapper
+            padding stacks on the article's own px-* — acceptable because the
+            default 560px modal renders at the mobile breakpoint; only unusually
+            wide modals see the extra inset. */}
+        <main id="main-content" className="flex flex-col overflow-x-hidden px-5 sm:px-6">
+          {children}
+        </main>
+      </div>
+    );
+  }
+
   // The body.scrolled toggle used to live here, but #content-scroll-container
   // is rendered by PageColumns (in page.tsx) and remounts on every navigation.
   // The listener attached once at LayoutWrapper mount referenced a detached

package/vendored/components/layout/PageColumns.tsx

@@ -1,12 +1,13 @@
 'use client';
 
 import { useEffect, useRef, type ReactNode } from 'react';
-import { useChatPanel } from '@/hooks/useChatPanel';
+import { useChatPanelOptional } from '@/hooks/useChatPanel';
 
 interface PageColumnsProps {
   children: ReactNode;
   toc: ReactNode;
   isWideMode?: boolean;
+  embed?: boolean;
 }
 
 /**
@@ -14,8 +15,12 @@ interface PageColumnsProps {
  * On xl+ screens, the TOC is hidden when chat is open (chat renders at layout level).
  * On <xl screens, only content is rendered (TOC hidden, chat is a mobile overlay).
  */
-export function PageColumns({ children, toc, isWideMode }: PageColumnsProps) {
-  const { isChatOpen } = useChatPanel();
+export function PageColumns({ children, toc, isWideMode, embed }: PageColumnsProps) {
+  // Embed mode renders this column OUTSIDE the ChatPanelProvider (the embed
+  // LayoutWrapper branch drops the provider along with the rest of the chrome),
+  // so the throwing useChatPanel() would 500 the whole embed render. Use the
+  // optional accessor: no provider → chat closed, and `!embed` hides the TOC anyway.
+  const isChatOpen = useChatPanelOptional()?.isChatOpen ?? false;
   const scrollRef = useRef<HTMLDivElement>(null);
 
   // Toggle body.scrolled when the user scrolls past 500px in the content
@@ -50,8 +55,8 @@ export function PageColumns({ children, toc, isWideMode }: PageColumnsProps) {
         {children}
       </div>
 
-      {/* TOC — shown when chat is closed and not in wide mode */}
-      {!isChatOpen && !isWideMode && (
+      {/* TOC — shown when chat is closed, not in wide mode, and not embedded */}
+      {!isChatOpen && !isWideMode && !embed && (
         <aside className="hidden xl:block w-72 flex-shrink-0 xl:h-full xl:overflow-y-auto toc-scroll xl:ml-0.5 pr-2">
           <div className="py-6 sm:py-10 pr-4">
             {toc}

package/vendored/components/navigation/Breadcrumb.tsx

@@ -8,6 +8,9 @@ import { useLinkPrefix } from '@/lib/link-prefix-context';
 interface BreadcrumbProps {
   slug: string[];
   config?: DocsConfig;
+  /** Embed render (widget modal): drop the breadcrumb — its links navigate the
+   *  full docs and read as out of place inside an embedded changelog. */
+  hidden?: boolean;
 }
 
 interface BreadcrumbItem {
@@ -245,8 +248,10 @@ function findPageNavTitle(config: DocsConfig, targetSlug: string): string | null
   return null;
 }
 
-export function Breadcrumb({ slug, config }: BreadcrumbProps) {
+export function Breadcrumb({ slug, config, hidden }: BreadcrumbProps) {
+  // Call hooks before the early return so hook order stays stable (Rules of Hooks).
   const linkPrefix = useLinkPrefix();
+  if (hidden) return null;
   const homeLink = config ? `${linkPrefix}/${getFirstPage(config)}` : `${linkPrefix}/introduction`;
   const targetSlug = slug.join('/');
 

package/vendored/components/navigation/SocialFooter.tsx

@@ -22,6 +22,9 @@ interface SocialFooterProps {
   config: DocsConfig;
   hidden?: boolean;
   projectSlug?: string;
+  /** Embed render (widget modal): keep ONLY the "Powered by Jamdesk"
+   *  attribution — drop the link columns + social icons. */
+  embed?: boolean;
 }
 
 /**
@@ -137,7 +140,42 @@ function SocialIcons({ socials }: { socials: Partial<Record<SocialPlatform, stri
   );
 }
 
-export function SocialFooter({ config, hidden, projectSlug }: SocialFooterProps) {
+/** "Powered by Jamdesk" attribution link, shared by the full footer and the
+ *  embed footer. Renders nothing when branding is disabled at build time. */
+function BrandingLink({ projectSlug }: { projectSlug?: string }) {
+  if (!showBranding) return null;
+  return (
+    <a
+      href={getBrandingUrl(projectSlug)}
+      target="_blank"
+      rel="noopener noreferrer"
+      className="group flex items-baseline gap-1 text-sm text-[var(--color-text-muted)]/60 hover:text-[var(--color-text-muted)] transition-colors whitespace-nowrap"
+    >
+      Powered by
+      <span
+        role="img"
+        aria-label="Jamdesk"
+        className="inline-block translate-y-[2px] text-[var(--color-text-muted)]/85 group-hover:text-[var(--color-text-primary)]"
+        style={WORDMARK_STYLE}
+      />
+    </a>
+  );
+}
+
+export function SocialFooter({ config, hidden, projectSlug, embed }: SocialFooterProps) {
+  // Embed render (widget modal): keep ONLY the "Powered by Jamdesk" attribution.
+  // The link columns + social icons read as out of place inside an embedded
+  // changelog; the attribution stays even when the normal footer is hidden,
+  // since it's the embed widget's branding.
+  if (embed) {
+    if (!showBranding) return null;
+    return (
+      <footer className="mt-10 pt-6 border-t border-[var(--color-border)] flex justify-center">
+        <BrandingLink projectSlug={projectSlug} />
+      </footer>
+    );
+  }
+
   if (hidden) return null;
 
   const { socials, links } = config.footer || {};
@@ -156,22 +194,7 @@ export function SocialFooter({ config, hidden, projectSlug }: SocialFooterProps)
       {hasLinks && <LinkColumns columns={links} />}
       <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
         {hasSocials && <SocialIcons socials={socials} />}
-        {showBranding && (
-          <a
-            href={getBrandingUrl(projectSlug)}
-            target="_blank"
-            rel="noopener noreferrer"
-            className="group flex items-baseline gap-1 text-sm text-[var(--color-text-muted)]/60 hover:text-[var(--color-text-muted)] transition-colors whitespace-nowrap"
-          >
-            Powered by
-            <span
-              role="img"
-              aria-label="Jamdesk"
-              className="inline-block translate-y-[2px] text-[var(--color-text-muted)]/85 group-hover:text-[var(--color-text-primary)]"
-              style={WORDMARK_STYLE}
-            />
-          </a>
-        )}
+        <BrandingLink projectSlug={projectSlug} />
       </div>
     </footer>
   );