@flamingo-stack/openframe-frontend-core 0.0.295 → 0.0.296-snapshot.20260621021605

package/dist/{chunk-3ZXUQQL4.js → chunk-PI4WSYQV.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   contentFetch
-} from "./chunk-3MCHAFHB.js";
+} from "./chunk-2QG57XOJ.js";
 
 // src/hooks/use-self-fetch.ts
 import { useEffect, useRef, useState } from "react";
@@ -65,4 +65,4 @@ function useSelfFetch(url, options) {
 export {
   useSelfFetch
 };
-//# sourceMappingURL=chunk-3ZXUQQL4.js.map
+//# sourceMappingURL=chunk-PI4WSYQV.js.map

package/dist/{chunk-E4XABBSU.js → chunk-PWQUAVA3.js}

@@ -1,25 +1,38 @@
 "use client";
+import {
+  FileDownloadCard,
+  GoogleSheetsViewer,
+  PdfViewer
+} from "./chunk-SA2WPJVO.js";
 import {
   DocSearchBar,
   useDocSearch
-} from "./chunk-6GCI7JOE.js";
+} from "./chunk-AD6C23QY.js";
 import {
   DEFAULT_FOLDER_INDEX_FILE,
+  FigmaEmbed,
   MobileNavigationDropdown,
   MultiLevelNavigation,
+  PageHeader,
+  PageLayout,
+  PageShell,
   StickySectionNav,
   findDocNodeByPath,
   getDocAncestorNodeIds,
   stripFolderIndexFromPath
-} from "./chunk-26PKDALD.js";
+} from "./chunk-PC746XCO.js";
 import {
   HUB_HEADER_OFFSET_PX,
   navigateSamePageHash,
   scrollElementIntoView
-} from "./chunk-OQ6X7ZOC.js";
+} from "./chunk-2QG57XOJ.js";
+import {
+  useChatRuntime
+} from "./chunk-IZ7JSBFP.js";
 import {
-  PageHeading
-} from "./chunk-FQJK446R.js";
+  init_next_navigation,
+  useRouter
+} from "./chunk-PLJLE4A4.js";
 import {
   cn,
   init_cn
@@ -27,6 +40,7 @@ import {
 
 // src/components/docs/doc-viewer.tsx
 import { useMemo as useMemo2 } from "react";
+init_next_navigation();
 
 // src/components/persistent-filter-controls.tsx
 init_cn();
@@ -1078,6 +1092,15 @@ function useDocumentTree(config, initialPath) {
     window.addEventListener("popstate", handlePopState);
     return () => window.removeEventListener("popstate", handlePopState);
   }, [normalizedBaseRoute, folderIndexFile]);
+  useEffect(() => {
+    if (cleanInitialPath === selectedPathRef.current) return;
+    setSelectedPath(cleanInitialPath);
+    if (cleanInitialPath) {
+      const parentPath = cleanInitialPath.includes("/") ? cleanInitialPath.substring(0, cleanInitialPath.lastIndexOf("/")) : cleanInitialPath;
+      setExpandedNodes(new Set(getDocAncestorNodeIds(parentPath)));
+    }
+    setTimeout(scrollToContent, 150);
+  }, [cleanInitialPath]);
   useEffect(() => {
     if (!isInitialized) {
       const speculativeContentPath = cleanInitialPath || folderIndexFile;
@@ -1387,6 +1410,35 @@ function useScrollSpy(sections) {
   return { activeSection, handleSectionClick };
 }
 
+// src/components/docs/use-docs-resolve-link.ts
+import { useCallback as useCallback4 } from "react";
+function useDocsResolveLink(sourceId, resolveLinkEndpoint) {
+  const chatRuntime = useChatRuntime();
+  const resolvedResolveLinkEndpoint = resolveLinkEndpoint ?? chatRuntime?.endpoints.docsResolveLinkUrl ?? "/api/docs/resolve-link";
+  return useCallback4(
+    async (href, currentPath) => {
+      try {
+        const response = await fetch(resolvedResolveLinkEndpoint, {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ link: href, currentPath, source: sourceId })
+        });
+        if (!response.ok) {
+          return { success: false, error: `Resolve failed: ${response.status}` };
+        }
+        const json = await response.json();
+        return json.data ?? json;
+      } catch (error) {
+        return {
+          success: false,
+          error: error instanceof Error ? error.message : "Resolve failed"
+        };
+      }
+    },
+    [resolvedResolveLinkEndpoint, sourceId]
+  );
+}
+
 // src/components/docs/doc-viewer.tsx
 import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 var DEFAULT_DOC_VIEWER_PALETTE = {
@@ -1408,19 +1460,26 @@ function DocViewerContent({
   renderSkeleton,
   chatSource,
   title,
+  titleIcon,
+  subtitle,
+  accentDot,
   colorPalette = DEFAULT_DOC_VIEWER_PALETTE,
   className = "",
   docPath,
   sidebarLabel = "DOCUMENTATION",
   structureEndpoint,
   contentEndpoint,
+  searchEndpoint,
+  resolveLinkEndpoint,
   baseRoute,
   emptyStateText,
   showAIChat = false,
-  folderIndexFile
+  folderIndexFile,
+  backButton
 }) {
   const resolvedStructureEndpoint = structureEndpoint ?? `/api/docs/sources/${sourceId}/structure`;
   const resolvedContentEndpoint = contentEndpoint ?? `/api/docs/sources/${sourceId}/content`;
+  const resolveLink = useDocsResolveLink(sourceId, resolveLinkEndpoint);
   const {
     structure,
     selectedPath,
@@ -1443,9 +1502,15 @@ function DocViewerContent({
   );
   const { activeSection, handleSectionClick } = useScrollSpy(content?.sections);
   const docNav = useDocNavigation();
+  const router = useRouter();
+  const backCfg = backButton === false ? null : {
+    label: backButton?.label ?? "Back to home",
+    onClick: () => router.push(backButton?.href ?? "/")
+  };
   const docSearch = useDocSearch({
     source: chatSource,
     baseRoute,
+    searchEndpoint,
     onNavigate: (path) => navigateToDoc(path, { fromInternalLink: true }),
     onInPageSwap: (path) => docNav.navigate(path)
   });
@@ -1454,9 +1519,10 @@ function DocViewerContent({
     return renderContent(content, {
       onInternalLinkClick: navigateToDoc,
       currentPath: selectedPath,
-      sourceId
+      sourceId,
+      onResolveLink: resolveLink
     });
-  }, [content, selectedPath, renderContent, navigateToDoc, sourceId]);
+  }, [content, selectedPath, renderContent, navigateToDoc, sourceId, resolveLink]);
   const selectedNodeDocType = selectedPath && structure.length > 0 ? findDocNodeByPath(selectedPath, structure)?.documentType : void 0;
   const activeDocType = content?.documentType ?? selectedNodeDocType;
   const isMarkdownContent = !activeDocType || activeDocType === "markdown";
@@ -1468,36 +1534,70 @@ function DocViewerContent({
   const containerBgStyle = colorPalette.containerBackground !== "transparent" ? { backgroundColor: colorPalette.containerBackground } : {};
   const defaultEmptyText = structure.length > 0 ? "Select a document from the sidebar to view" : "No documents yet. Add content from the admin panel.";
   const resolvedEmptyText = emptyStateText || defaultEmptyText;
-  return /* @__PURE__ */ jsx6("section", { className: `${bgClass} ${className}`, style: bgStyle, children: /* @__PURE__ */ jsx6(
-    "div",
-    {
-      className: "max-w-[1920px] px-6 md:px-20 py-6 md:py-10 mx-auto",
-      style: containerBgStyle,
-      children: /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-6", children: [
-        /* @__PURE__ */ jsx6("div", { className: "flex flex-col gap-4", children: typeof title === "string" ? /* @__PURE__ */ jsx6(PageHeading, { children: title }) : title }),
-        showAIChat && /* @__PURE__ */ jsx6(
-          DocSearchBar,
-          {
-            placeholder: `Search ${sidebarLabel?.toLowerCase() || "documents"}...`,
-            query: docSearch.query,
-            onQueryChange: docSearch.setQuery,
-            results: docSearch.results,
-            isLoading: docSearch.isLoading,
-            onResultSelect: docSearch.handleResultSelect,
-            showDropdown: docSearch.keepDropdownOpen
-          }
-        ),
-        error && /* @__PURE__ */ jsx6("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs4("div", { className: "rounded-lg border bg-ods-card p-8 text-center max-w-md border-ods-border", children: [
-          /* @__PURE__ */ jsx6("h2", { className: "text-xl font-semibold text-ods-text-primary", children: "Error Loading Documents" }),
-          /* @__PURE__ */ jsxs4("p", { className: "mt-2 text-ods-text-secondary", children: [
-            error,
-            ". Please try again later."
-          ] })
-        ] }) }),
-        !error && /* @__PURE__ */ jsxs4("div", { className: "flex flex-col lg:flex-row gap-6 lg:gap-10 items-start flex-1", children: [
-          /* @__PURE__ */ jsx6("div", { className: "w-full lg:w-[320px] lg:shrink-0", children: /* @__PURE__ */ jsx6("div", { className: "lg:sticky lg:top-20", children: isLoadingStructure ? /* @__PURE__ */ jsx6(CategorySidebarSkeleton, {}) : /* @__PURE__ */ jsxs4(Fragment3, { children: [
-            /* @__PURE__ */ jsx6(PersistentMobileDropdown, { isLoading: false, children: /* @__PURE__ */ jsx6(
-              MobileNavigationDropdown,
+  return (
+    // STRUCTURAL UNIFICATION: render through the IDENTICAL wrapper chain
+    // `<DevSectionPage>` uses (PageShell → PageLayout → `gap-10 flex-col`),
+    // not a hand-rolled custom container with similar-looking spacing.
+    // PageLayout owns the back-button row; the inner `gap-10` div +
+    // `<PageHeader noTopPadding noBottomMargin>` renders the title section
+    // the same way `<DevSectionView>`'s hero does. This is the only way to
+    // guarantee /knowledge-base sits at pixel-identical vertical rhythm to
+    // /roadmap / /releases / /onboarding-guides — same components, same DOM,
+    // not "same CSS classes that look similar on paper."
+    //
+    // `colorPalette` / `className` / `bgStyle` flow through PageShell's
+    // contentClassName + an inner style-passthrough wrapper so legacy
+    // palette overrides still apply (none in the codebase today; the API
+    // surface is preserved).
+    /* @__PURE__ */ jsx6(PageShell, { contentClassName: `${bgClass} ${className}`, children: /* @__PURE__ */ jsx6("div", { style: { ...bgStyle, ...containerBgStyle }, children: /* @__PURE__ */ jsx6(PageLayout, { backButton: backCfg ?? void 0, children: /* @__PURE__ */ jsxs4("div", { className: "w-full flex flex-col gap-10", children: [
+      /* @__PURE__ */ jsx6(
+        PageHeader,
+        {
+          title,
+          titleIcon,
+          subtitle,
+          accentDot,
+          noTopPadding: true,
+          noBottomMargin: true
+        }
+      ),
+      showAIChat && /* @__PURE__ */ jsx6(
+        DocSearchBar,
+        {
+          placeholder: `Search ${sidebarLabel?.toLowerCase() || "documents"}...`,
+          query: docSearch.query,
+          onQueryChange: docSearch.setQuery,
+          results: docSearch.results,
+          isLoading: docSearch.isLoading,
+          onResultSelect: docSearch.handleResultSelect,
+          showDropdown: docSearch.keepDropdownOpen
+        }
+      ),
+      error && /* @__PURE__ */ jsx6("div", { className: "flex justify-center", children: /* @__PURE__ */ jsxs4("div", { className: "rounded-lg border bg-ods-card p-8 text-center max-w-md border-ods-border", children: [
+        /* @__PURE__ */ jsx6("h2", { className: "text-xl font-semibold text-ods-text-primary", children: "Error Loading Documents" }),
+        /* @__PURE__ */ jsxs4("p", { className: "mt-2 text-ods-text-secondary", children: [
+          error,
+          ". Please try again later."
+        ] })
+      ] }) }),
+      !error && /* @__PURE__ */ jsxs4("div", { className: "flex flex-col lg:flex-row gap-6 lg:gap-10 items-start flex-1", children: [
+        /* @__PURE__ */ jsx6("div", { className: "w-full lg:w-[320px] lg:shrink-0", children: /* @__PURE__ */ jsx6("div", { className: "lg:sticky lg:top-20", children: isLoadingStructure ? /* @__PURE__ */ jsx6(CategorySidebarSkeleton, {}) : /* @__PURE__ */ jsxs4(Fragment3, { children: [
+          /* @__PURE__ */ jsx6(PersistentMobileDropdown, { isLoading: false, children: /* @__PURE__ */ jsx6(
+            MobileNavigationDropdown,
+            {
+              nodes: structure,
+              selectedPath,
+              expandedNodes,
+              onNodeClick: selectNode,
+              onToggleExpand: toggleNode,
+              isLoading: false,
+              folderIndexFile
+            }
+          ) }),
+          /* @__PURE__ */ jsx6(PersistentSidebar, { isLoading: false, children: /* @__PURE__ */ jsx6("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsxs4("div", { className: "space-y-4", children: [
+            /* @__PURE__ */ jsx6("h3", { className: "text-[14px] font-['Azeret_Mono'] font-semibold uppercase text-ods-text-secondary tracking-[-0.02em] leading-[1.43em]", children: sidebarLabel }),
+            /* @__PURE__ */ jsx6(
+              MultiLevelNavigation,
               {
                 nodes: structure,
                 selectedPath,
@@ -1507,66 +1607,203 @@ function DocViewerContent({
                 isLoading: false,
                 folderIndexFile
               }
-            ) }),
-            /* @__PURE__ */ jsx6(PersistentSidebar, { isLoading: false, children: /* @__PURE__ */ jsx6("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsxs4("div", { className: "space-y-4", children: [
-              /* @__PURE__ */ jsx6("h3", { className: "text-[14px] font-['Azeret_Mono'] font-semibold uppercase text-ods-text-secondary tracking-[-0.02em] leading-[1.43em]", children: sidebarLabel }),
-              /* @__PURE__ */ jsx6(
-                MultiLevelNavigation,
-                {
-                  nodes: structure,
-                  selectedPath,
-                  expandedNodes,
-                  onNodeClick: selectNode,
-                  onToggleExpand: toggleNode,
-                  isLoading: false,
-                  folderIndexFile
-                }
-              )
-            ] }) }) })
-          ] }) }) }),
-          /* @__PURE__ */ jsx6("div", { className: "flex-1 min-w-0 w-full", children: /* @__PURE__ */ jsxs4(
-            "div",
-            {
-              className: `grid grid-cols-1 ${showStickyNav && stickyNavSections.length > 0 || isLoadingContent || isLoadingStructure ? "lg:grid-cols-[1fr_280px]" : ""} gap-8`,
-              children: [
-                /* @__PURE__ */ jsx6("div", { className: `w-full ${isMarkdownContent ? "max-w-4xl mx-auto" : ""}`, children: /* @__PURE__ */ jsx6("article", { className: "space-y-2", children: isLoadingContent || isLoadingStructure ? renderSkeleton(selectedNodeDocType) : !content ? /* @__PURE__ */ jsx6("div", { className: "text-center py-16", children: /* @__PURE__ */ jsx6("p", { className: "text-xl text-ods-text-secondary", children: resolvedEmptyText }) }) : renderedContent }) }),
-                (isLoadingContent || isLoadingStructure) && /* @__PURE__ */ jsx6("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsxs4("div", { className: "sticky top-24", children: [
-                  /* @__PURE__ */ jsx6("div", { className: "h-[14px] w-28 bg-ods-border rounded animate-pulse mb-5" }),
-                  /* @__PURE__ */ jsx6("div", { className: "space-y-0", children: [130, 170, 190, 220, 110, 200, 80, 100, 120, 140, 90].map((w, i) => /* @__PURE__ */ jsx6(
-                    "div",
-                    {
-                      className: `py-[13px] pl-3 border-l-2 ${i === 0 ? "border-ods-accent" : "border-transparent"}`,
-                      children: /* @__PURE__ */ jsx6(
-                        "div",
-                        {
-                          className: "h-[13px] bg-ods-border rounded animate-pulse",
-                          style: { width: w }
-                        }
-                      )
-                    },
-                    i
-                  )) })
-                ] }) }),
-                showStickyNav && content && stickyNavSections.length > 0 && !isLoadingContent && /* @__PURE__ */ jsx6("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsxs4("div", { className: "sticky top-24", children: [
-                  /* @__PURE__ */ jsx6("h3", { className: "text-[14px] font-['Azeret_Mono'] font-semibold uppercase text-ods-text-secondary tracking-[-0.02em] leading-[1.43em] mb-4", children: "ON THIS PAGE" }),
-                  /* @__PURE__ */ jsx6(
-                    StickySectionNav,
-                    {
-                      sections: stickyNavSections,
-                      activeSection,
-                      onSectionClick: handleSectionClick,
-                      ribbonPosition: "left",
-                      ribbonColor: "var(--ods-accent)"
-                    }
-                  )
-                ] }) })
-              ]
-            }
-          ) })
-        ] })
+            )
+          ] }) }) })
+        ] }) }) }),
+        /* @__PURE__ */ jsx6("div", { className: "flex-1 min-w-0 w-full", children: /* @__PURE__ */ jsxs4(
+          "div",
+          {
+            className: `grid grid-cols-1 ${// "On this page" right column only makes sense for
+            // MARKDOWN content (PDFs / Sheets / Figma / file have no
+            // sections to navigate to). Gating the grid template on
+            // `isMarkdownContent` also suppresses the section-skeleton
+            // bars during embed loads — the user-reported "skeleton
+            // shouldn't be on file pages" bug.
+            isMarkdownContent && (showStickyNav && stickyNavSections.length > 0 || isLoadingContent || isLoadingStructure) ? "lg:grid-cols-[1fr_280px]" : ""} gap-8`,
+            children: [
+              /* @__PURE__ */ jsx6("div", { className: `w-full ${isMarkdownContent ? "max-w-4xl mx-auto" : ""}`, children: /* @__PURE__ */ jsx6("article", { className: "space-y-2", children: isLoadingContent || isLoadingStructure ? renderSkeleton(selectedNodeDocType) : !content ? /* @__PURE__ */ jsx6("div", { className: "text-center py-16", children: /* @__PURE__ */ jsx6("p", { className: "text-xl text-ods-text-secondary", children: resolvedEmptyText }) }) : renderedContent }) }),
+              isMarkdownContent && (isLoadingContent || isLoadingStructure) && /* @__PURE__ */ jsx6("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsxs4("div", { className: "sticky top-24", children: [
+                /* @__PURE__ */ jsx6("div", { className: "h-[14px] w-28 bg-ods-border rounded animate-pulse mb-5" }),
+                /* @__PURE__ */ jsx6("div", { className: "space-y-0", children: [130, 170, 190, 220, 110, 200, 80, 100, 120, 140, 90].map((w, i) => /* @__PURE__ */ jsx6(
+                  "div",
+                  {
+                    className: `py-[13px] pl-3 border-l-2 ${i === 0 ? "border-ods-accent" : "border-transparent"}`,
+                    children: /* @__PURE__ */ jsx6(
+                      "div",
+                      {
+                        className: "h-[13px] bg-ods-border rounded animate-pulse",
+                        style: { width: w }
+                      }
+                    )
+                  },
+                  i
+                )) })
+              ] }) }),
+              showStickyNav && content && stickyNavSections.length > 0 && !isLoadingContent && /* @__PURE__ */ jsx6("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsxs4("div", { className: "sticky top-24", children: [
+                /* @__PURE__ */ jsx6("h3", { className: "text-[14px] font-['Azeret_Mono'] font-semibold uppercase text-ods-text-secondary tracking-[-0.02em] leading-[1.43em] mb-4", children: "ON THIS PAGE" }),
+                /* @__PURE__ */ jsx6(
+                  StickySectionNav,
+                  {
+                    sections: stickyNavSections,
+                    activeSection,
+                    onSectionClick: handleSectionClick,
+                    ribbonPosition: "left",
+                    ribbonColor: "var(--ods-accent)"
+                  }
+                )
+              ] }) })
+            ]
+          }
+        ) })
       ] })
+    ] }) }) }) })
+  );
+}
+
+// src/components/docs/skeletons.tsx
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+function MarkdownSkeleton() {
+  return /* @__PURE__ */ jsxs5("div", { className: "space-y-7 mt-6", children: [
+    /* @__PURE__ */ jsxs5("div", { className: "space-y-[14px]", children: [
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-3/4 animate-pulse" })
+    ] }),
+    /* @__PURE__ */ jsxs5("div", { className: "space-y-[14px]", children: [
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-5/6 animate-pulse" })
+    ] }),
+    /* @__PURE__ */ jsxs5("div", { className: "space-y-[14px]", children: [
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-2/3 animate-pulse" })
+    ] }),
+    /* @__PURE__ */ jsx7("div", { className: "h-[88px] bg-ods-card border border-ods-border rounded-lg animate-pulse" }),
+    /* @__PURE__ */ jsx7("div", { className: "h-7 bg-ods-border rounded w-1/3 animate-pulse" }),
+    /* @__PURE__ */ jsxs5("div", { className: "space-y-[14px]", children: [
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-[72%] animate-pulse" })
+    ] }),
+    /* @__PURE__ */ jsxs5("div", { className: "space-y-[14px]", children: [
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-[58%] animate-pulse" })
+    ] }),
+    /* @__PURE__ */ jsx7("div", { className: "h-7 bg-ods-border rounded w-2/5 animate-pulse" }),
+    /* @__PURE__ */ jsxs5("div", { className: "space-y-[14px]", children: [
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-[90%] animate-pulse" })
+    ] }),
+    /* @__PURE__ */ jsxs5("div", { className: "space-y-[14px]", children: [
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-full animate-pulse" }),
+      /* @__PURE__ */ jsx7("div", { className: "h-[16px] bg-ods-border rounded w-[70%] animate-pulse" })
+    ] }),
+    /* @__PURE__ */ jsx7("div", { className: "h-[88px] bg-ods-card border border-ods-border rounded-lg animate-pulse" })
+  ] });
+}
+function EmbedSkeleton({ documentType } = {}) {
+  if (documentType === "file") {
+    return /* @__PURE__ */ jsx7("div", { className: "flex flex-col items-center justify-center py-16", children: /* @__PURE__ */ jsxs5("div", { className: "bg-ods-card border border-ods-border rounded-xl p-8 max-w-md w-full text-center space-y-4", children: [
+      /* @__PURE__ */ jsx7("div", { className: "w-16 h-16 rounded mx-auto bg-ods-border animate-pulse" }),
+      /* @__PURE__ */ jsxs5("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx7("div", { className: "h-5 w-2/3 mx-auto rounded bg-ods-border animate-pulse" }),
+        /* @__PURE__ */ jsx7("div", { className: "h-4 w-1/2 mx-auto rounded bg-ods-border animate-pulse" })
+      ] }),
+      /* @__PURE__ */ jsx7("div", { className: "h-10 w-full rounded bg-ods-border animate-pulse" })
+    ] }) });
+  }
+  const buttonCount = documentType === "pdf" ? 2 : 1;
+  return /* @__PURE__ */ jsxs5("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [
+      /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2 min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx7("div", { className: "w-5 h-5 shrink-0 rounded bg-ods-border animate-pulse" }),
+        /* @__PURE__ */ jsx7("div", { className: "h-6 w-2/3 rounded bg-ods-border animate-pulse" })
+      ] }),
+      /* @__PURE__ */ jsx7("div", { className: "flex items-center gap-2 w-full sm:w-auto", children: Array.from({ length: buttonCount }).map((_, i) => /* @__PURE__ */ jsx7(
+        "div",
+        {
+          className: "h-10 w-full sm:w-32 rounded bg-ods-border animate-pulse flex-1 sm:flex-initial"
+        },
+        i
+      )) })
+    ] }),
+    /* @__PURE__ */ jsx7(
+      "div",
+      {
+        className: "w-full rounded-lg border border-ods-border bg-ods-card animate-pulse",
+        style: { height: "calc(100vh - 250px)" }
+      }
+    )
+  ] });
+}
+
+// src/components/docs/docs-hub-page.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+var DEFAULT_TITLE = "Documents";
+var defaultFallbackRenderer = () => /* @__PURE__ */ jsx8("div", { className: "text-center py-16", children: /* @__PURE__ */ jsx8("p", { className: "text-ods-text-secondary", children: "Unsupported document type" }) });
+var defaultPdfRenderer = (content, handlers) => content.fileUrl ? /* @__PURE__ */ jsx8(PdfViewer, { src: content.fileUrl, fileName: content.fileName }) : defaultFallbackRenderer(content, handlers);
+var defaultGoogleSheetRenderer = (content, handlers) => content.externalUrl ? /* @__PURE__ */ jsx8(GoogleSheetsViewer, { externalUrl: content.externalUrl, fileName: content.fileName }) : defaultFallbackRenderer(content, handlers);
+var defaultFigmaRenderer = (content, handlers) => content.externalUrl ? /* @__PURE__ */ jsx8(FigmaEmbed, { url: content.externalUrl, title: content.fileName, loading: "eager" }) : defaultFallbackRenderer(content, handlers);
+var defaultFileRenderer = (content) => /* @__PURE__ */ jsx8(
+  FileDownloadCard,
+  {
+    fileName: content.fileName,
+    mimeType: content.mimeType,
+    fileSize: content.fileSize,
+    fileUrl: content.fileUrl
+  }
+);
+var defaultRenderSkeleton = (documentType) => !documentType || documentType === "markdown" ? /* @__PURE__ */ jsx8(MarkdownSkeleton, {}) : (
+  // Forward the documentType so the embed skeleton renders the right
+  // shape (PDF=2 buttons, sheets/figma=1 button, file=centered card).
+  /* @__PURE__ */ jsx8(EmbedSkeleton, { documentType })
+);
+function DocsHubPage({
+  title = DEFAULT_TITLE,
+  documentTypeRenderers,
+  fallbackRenderer = defaultFallbackRenderer,
+  renderSkeleton = defaultRenderSkeleton,
+  showAIChat = true,
+  className = "min-h-screen",
+  sidebarLabel = "DOCUMENTATION",
+  ...docViewerProps
+}) {
+  const resolvedRenderers = {
+    markdown: documentTypeRenderers.markdown,
+    pdf: documentTypeRenderers.pdf ?? defaultPdfRenderer,
+    google_sheet: documentTypeRenderers.google_sheet ?? defaultGoogleSheetRenderer,
+    figma: documentTypeRenderers.figma ?? defaultFigmaRenderer,
+    file: documentTypeRenderers.file ?? defaultFileRenderer
+  };
+  const renderContent = (content, handlers) => {
+    const type = content.documentType ?? "markdown";
+    const renderer = resolvedRenderers[type] ?? fallbackRenderer;
+    return renderer(content, handlers);
+  };
+  return /* @__PURE__ */ jsx8(
+    DocViewer,
+    {
+      ...docViewerProps,
+      title,
+      showAIChat,
+      className,
+      sidebarLabel,
+      renderContent,
+      renderSkeleton
     }
-  ) });
+  );
 }
 
 export {
@@ -1597,6 +1834,9 @@ export {
   useDocNavigation,
   useDocumentTree,
   useScrollSpy,
-  DocViewer
+  DocViewer,
+  MarkdownSkeleton,
+  EmbedSkeleton,
+  DocsHubPage
 };
-//# sourceMappingURL=chunk-E4XABBSU.js.map
+//# sourceMappingURL=chunk-PWQUAVA3.js.map