@flamingo-stack/openframe-frontend-core 0.0.747 → 0.0.749

package/dist/{chunk-YIRX6C7V.cjs → chunk-XJ3J4UIS.cjs}

@@ -3,7 +3,7 @@
 
 
 
-var _chunkP7KTAXXEcjs = require('./chunk-P7KTAXXE.cjs');
+var _chunkOFO75R2Ocjs = require('./chunk-OFO75R2O.cjs');
 
 
 
@@ -16,9 +16,15 @@ var _chunkASMNNSUQcjs = require('./chunk-ASMNNSUQ.cjs');
 var _chunkHOTM4UM6cjs = require('./chunk-HOTM4UM6.cjs');
 
 
+var _chunkUGCRLRCTcjs = require('./chunk-UGCRLRCT.cjs');
+
+
 var _chunkV45KLJQPcjs = require('./chunk-V45KLJQP.cjs');
 
 
+var _chunk2YXOD2KLcjs = require('./chunk-2YXOD2KL.cjs');
+
+
 var _chunk3ATAYP36cjs = require('./chunk-3ATAYP36.cjs');
 
 // src/utils/badge-palette.ts
@@ -51,7 +57,7 @@ function pickBadgePaletteColor({
 var _jsxruntime = require('react/jsx-runtime');
 function PaletteBadge({ text, color, className, variant = "button" }) {
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkP7KTAXXEcjs.StatusBadge,
+    _chunkOFO75R2Ocjs.StatusBadge,
     {
       text,
       colorScheme: isBadgePaletteKey(color) ? color : "default",
@@ -137,25 +143,25 @@ function AdminContentCardSkeleton({
     "div",
     {
       className: _chunk3ATAYP36cjs.cn.call(void 0, 
-        "flex h-full animate-pulse flex-col overflow-hidden rounded-2xl border border-ods-border bg-transparent",
+        "flex h-full flex-col overflow-hidden rounded-2xl border border-ods-border bg-transparent",
         className
       ),
       children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aspect-[3/2] w-full shrink-0 bg-ods-border/20" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "aspect-[3/2] w-full shrink-0" }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-1 flex-col gap-[var(--spacing-system-sf)] p-5", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[2lh] w-full rounded bg-ods-border text-h3" }),
-          subtitleRow && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[1lh] w-1/2 rounded bg-ods-border text-h6" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[2lh] w-full rounded bg-ods-border text-h6" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[2lh] w-full rounded text-h3" }),
+          subtitleRow && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[1lh] w-1/2 rounded text-h6" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[2lh] w-full rounded text-h6" }),
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-7 items-center gap-[var(--spacing-system-xsf)]", children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-5 w-20 rounded-full bg-ods-border" }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-5 w-24 rounded-full bg-ods-border" })
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-5 w-20 rounded-full" }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-5 w-24 rounded-full" })
           ] }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[1lh] w-32 rounded bg-ods-border text-h6" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[1lh] w-32 rounded text-h6" }),
           actions && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mt-auto flex items-center justify-between border-t border-ods-border pt-[var(--spacing-system-sf)]", children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-10 w-24 rounded bg-ods-border" }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-10 w-24 rounded" }),
             /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex gap-[var(--spacing-system-xsf)]", children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-10 w-20 rounded bg-ods-border" }),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-10 w-20 rounded bg-ods-border" })
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-10 w-20 rounded" }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-10 w-20 rounded" })
             ] })
           ] })
         ] })
@@ -163,6 +169,24 @@ function AdminContentCardSkeleton({
     }
   );
 }
+function AdminContentCardGridSkeleton({
+  count = 12,
+  Skeleton = AdminContentCardSkeleton,
+  className,
+  label = "Loading",
+  region = true
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkUGCRLRCTcjs.LoadingRegion,
+    {
+      label,
+      announce: region,
+      className: _chunk3ATAYP36cjs.cn.call(void 0, ADMIN_CONTENT_CARD_GRID_CLASS, className),
+      "data-state": "loading",
+      children: Array.from({ length: count }, (_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, {}, i))
+    }
+  );
+}
 function AdminContentCardGrid({
   items,
   pageSize,
@@ -171,12 +195,22 @@ function AdminContentCardGrid({
   renderCard,
   empty,
   Skeleton = AdminContentCardSkeleton,
-  className
+  className,
+  loadingLabel,
+  loadingRegion
 }) {
   const gridClass = _chunk3ATAYP36cjs.cn.call(void 0, ADMIN_CONTENT_CARD_GRID_CLASS, className);
-  if (loading) {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: gridClass, "data-state": "loading", children: Array.from({ length: pageSize }, (_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, {}, i)) });
-  }
+  if (loading)
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      AdminContentCardGridSkeleton,
+      {
+        count: pageSize,
+        Skeleton,
+        className,
+        label: loadingLabel,
+        region: loadingRegion
+      }
+    );
   const slots = Array.from({ length: Math.max(0, pageSize - items.length) }, (_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, { className: "invisible" }, `slot-${i}`));
   if (items.length === 0) {
     return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative", "data-state": "empty", children: [
@@ -204,7 +238,7 @@ var STATUS_BADGE_SCHEME = {
   abandoned: "default"
 };
 function EmployeeEntryBadge({ children }) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP7KTAXXEcjs.StatusBadge, { text: children, colorScheme: "default", variant: "button", singleLine: true });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkOFO75R2Ocjs.StatusBadge, { text: children, colorScheme: "default", variant: "button", singleLine: true });
 }
 function EmployeeEntryCard({
   entry,
@@ -217,7 +251,7 @@ function EmployeeEntryCard({
   className
 }) {
   const card = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkP7KTAXXEcjs.AdminContentCard,
+    _chunkOFO75R2Ocjs.AdminContentCard,
     {
       imageUrl: entry.featured_image || entry.main_video_thumbnail,
       placeholderUrl,
@@ -225,7 +259,7 @@ function EmployeeEntryCard({
       summary: (_nullishCoalesce(entry.summary, () => ( ""))).slice(0, 140) || "No description",
       badges: entry.status || extraBadges ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
         entry.status ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunkP7KTAXXEcjs.StatusBadge,
+          _chunkOFO75R2Ocjs.StatusBadge,
           {
             text: entry.status,
             colorScheme: _nullishCoalesce(STATUS_BADGE_SCHEME[entry.status], () => ( "default")),
@@ -240,7 +274,7 @@ function EmployeeEntryCard({
           _optionalChain([entry, 'access', _8 => _8.author, 'optionalAccess', _9 => _9.avatar_url]) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             _chunkHOTM4UM6cjs.next_image_default,
             {
-              src: _nullishCoalesce(_chunkP7KTAXXEcjs.getProxiedImageUrl2.call(void 0, entry.author.avatar_url), () => ( entry.author.avatar_url)),
+              src: _nullishCoalesce(_chunkOFO75R2Ocjs.getProxiedImageUrl2.call(void 0, entry.author.avatar_url), () => ( entry.author.avatar_url)),
               alt: "",
               className: "h-[1lh] w-[1lh] shrink-0 rounded-full object-cover",
               width: 20,
@@ -432,4 +466,5 @@ function useSelfFetch(url, options) {
 
 
 
-exports.BADGE_PALETTE = BADGE_PALETTE; exports.isBadgePaletteKey = isBadgePaletteKey; exports.pickBadgePaletteColor = pickBadgePaletteColor; exports.PaletteBadge = PaletteBadge; exports.DepartmentBadge = DepartmentBadge; exports.CONTENT_REF_GROUPS = CONTENT_REF_GROUPS; exports.getContentRefLabel = getContentRefLabel; exports.getContentRefLabelOrTitleCase = getContentRefLabelOrTitleCase; exports.orderContentRefTypes = orderContentRefTypes; exports.buildSuggestionUrl = buildSuggestionUrl; exports.useSelfFetch = useSelfFetch; exports.ADMIN_CONTENT_CARD_GRID_CLASS = ADMIN_CONTENT_CARD_GRID_CLASS; exports.AdminContentCardSkeleton = AdminContentCardSkeleton; exports.AdminContentCardGrid = AdminContentCardGrid; exports.EmployeeEntryBadge = EmployeeEntryBadge; exports.EmployeeEntryCard = EmployeeEntryCard; exports.EmployeeEntryCardSkeleton = EmployeeEntryCardSkeleton; exports.WhatIShippedCard = WhatIShippedCard; exports.WhatIShippedCardSkeleton = WhatIShippedCardSkeleton; exports.HowIWorkCard = HowIWorkCard; exports.HowIWorkCardSkeleton = HowIWorkCardSkeleton; exports.AiPromptCard = AiPromptCard; exports.AiPromptCardSkeleton = AiPromptCardSkeleton;
+
+exports.BADGE_PALETTE = BADGE_PALETTE; exports.isBadgePaletteKey = isBadgePaletteKey; exports.pickBadgePaletteColor = pickBadgePaletteColor; exports.PaletteBadge = PaletteBadge; exports.DepartmentBadge = DepartmentBadge; exports.CONTENT_REF_GROUPS = CONTENT_REF_GROUPS; exports.getContentRefLabel = getContentRefLabel; exports.getContentRefLabelOrTitleCase = getContentRefLabelOrTitleCase; exports.orderContentRefTypes = orderContentRefTypes; exports.buildSuggestionUrl = buildSuggestionUrl; exports.useSelfFetch = useSelfFetch; exports.ADMIN_CONTENT_CARD_GRID_CLASS = ADMIN_CONTENT_CARD_GRID_CLASS; exports.AdminContentCardSkeleton = AdminContentCardSkeleton; exports.AdminContentCardGridSkeleton = AdminContentCardGridSkeleton; exports.AdminContentCardGrid = AdminContentCardGrid; exports.EmployeeEntryBadge = EmployeeEntryBadge; exports.EmployeeEntryCard = EmployeeEntryCard; exports.EmployeeEntryCardSkeleton = EmployeeEntryCardSkeleton; exports.WhatIShippedCard = WhatIShippedCard; exports.WhatIShippedCardSkeleton = WhatIShippedCardSkeleton; exports.HowIWorkCard = HowIWorkCard; exports.HowIWorkCardSkeleton = HowIWorkCardSkeleton; exports.AiPromptCard = AiPromptCard; exports.AiPromptCardSkeleton = AiPromptCardSkeleton;

package/dist/{chunk-MA7T36JY.cjs → chunk-ZLF55RDR.cjs}

@@ -3,31 +3,32 @@
 
 
 
-var _chunkPIQRV4EQcjs = require('./chunk-PIQRV4EQ.cjs');
+var _chunkSOPVUD2Ycjs = require('./chunk-SOPVUD2Y.cjs');
 
 
 
 
 
-var _chunk6RTHHU3Scjs = require('./chunk-6RTHHU3S.cjs');
+var _chunkE3KFEOFAcjs = require('./chunk-E3KFEOFA.cjs');
 
 
 
-var _chunkLLAKQT3Bcjs = require('./chunk-LLAKQT3B.cjs');
+var _chunkSGL47BS2cjs = require('./chunk-SGL47BS2.cjs');
 
 
 
 
-var _chunkR3FXJXSQcjs = require('./chunk-R3FXJXSQ.cjs');
 
+var _chunkSECT4H34cjs = require('./chunk-SECT4H34.cjs');
 
-var _chunkU6XWGK53cjs = require('./chunk-U6XWGK53.cjs');
 
+var _chunkALPRQ3ZXcjs = require('./chunk-ALPRQ3ZX.cjs');
 
 
 
 
-var _chunkC7NTL2GVcjs = require('./chunk-C7NTL2GV.cjs');
+
+var _chunkWZX26ODJcjs = require('./chunk-WZX26ODJ.cjs');
 
 
 
@@ -45,6 +46,12 @@ var _chunkASMNNSUQcjs = require('./chunk-ASMNNSUQ.cjs');
 var _chunkUJ7AXHRZcjs = require('./chunk-UJ7AXHRZ.cjs');
 
 
+var _chunkUGCRLRCTcjs = require('./chunk-UGCRLRCT.cjs');
+
+
+var _chunk2YXOD2KLcjs = require('./chunk-2YXOD2KL.cjs');
+
+
 var _chunk3ATAYP36cjs = require('./chunk-3ATAYP36.cjs');
 
 // src/components/docs/doc-viewer.tsx
@@ -337,8 +344,8 @@ function toDocContent(value, requestedPath) {
 }
 function useDocumentTree(config, initialPath) {
   const { structureEndpoint, contentEndpoint, baseRoute } = config;
-  const folderIndexFile = _nullishCoalesce(config.folderIndexFile, () => ( _chunkC7NTL2GVcjs.DEFAULT_FOLDER_INDEX_FILE));
-  const cleanInitialPath = _chunkC7NTL2GVcjs.stripFolderIndexFromPath.call(void 0, _optionalChain([initialPath, 'optionalAccess', _4 => _4.replace, 'call', _5 => _5(/\/$/, "")]) || "", folderIndexFile);
+  const folderIndexFile = _nullishCoalesce(config.folderIndexFile, () => ( _chunkWZX26ODJcjs.DEFAULT_FOLDER_INDEX_FILE));
+  const cleanInitialPath = _chunkWZX26ODJcjs.stripFolderIndexFromPath.call(void 0, _optionalChain([initialPath, 'optionalAccess', _4 => _4.replace, 'call', _5 => _5(/\/$/, "")]) || "", folderIndexFile);
   const [structure, setStructure] = _react.useState.call(void 0, []);
   const [selectedPath, setSelectedPath] = _react.useState.call(void 0, cleanInitialPath);
   const [content, setContent] = _react.useState.call(void 0, null);
@@ -362,12 +369,12 @@ function useDocumentTree(config, initialPath) {
       } else if (pathname.startsWith(`${normalizedBaseRoute}/`)) {
         pathFromUrl = pathname.substring(`${normalizedBaseRoute}/`.length);
       }
-      pathFromUrl = _chunkC7NTL2GVcjs.stripFolderIndexFromPath.call(void 0, pathFromUrl, folderIndexFile);
+      pathFromUrl = _chunkWZX26ODJcjs.stripFolderIndexFromPath.call(void 0, pathFromUrl, folderIndexFile);
       if (pathFromUrl !== selectedPathRef.current) {
         setSelectedPath(pathFromUrl);
         if (pathFromUrl) {
           const parentPath = pathFromUrl.includes("/") ? pathFromUrl.substring(0, pathFromUrl.lastIndexOf("/")) : pathFromUrl;
-          setExpandedNodes(new Set(_chunkC7NTL2GVcjs.getDocAncestorNodeIds.call(void 0, parentPath)));
+          setExpandedNodes(new Set(_chunkWZX26ODJcjs.getDocAncestorNodeIds.call(void 0, parentPath)));
         }
         setTimeout(() => {
           scrollToContent();
@@ -385,7 +392,7 @@ function useDocumentTree(config, initialPath) {
       setSelectedPath(cleanInitialPath);
       if (cleanInitialPath) {
         const parentPath = cleanInitialPath.includes("/") ? cleanInitialPath.substring(0, cleanInitialPath.lastIndexOf("/")) : cleanInitialPath;
-        setExpandedNodes(new Set(_chunkC7NTL2GVcjs.getDocAncestorNodeIds.call(void 0, parentPath)));
+        setExpandedNodes(new Set(_chunkWZX26ODJcjs.getDocAncestorNodeIds.call(void 0, parentPath)));
       }
       setExternalNavCount((n) => n + 1);
     }
@@ -410,7 +417,7 @@ function useDocumentTree(config, initialPath) {
         if (cleanInitialPath) {
           const pathForExpansion = cleanInitialPath.includes(".") ? cleanInitialPath.substring(0, cleanInitialPath.lastIndexOf("/")) : cleanInitialPath;
           if (pathForExpansion) {
-            setExpandedNodes(new Set(_chunkC7NTL2GVcjs.getDocAncestorNodeIds.call(void 0, pathForExpansion)));
+            setExpandedNodes(new Set(_chunkWZX26ODJcjs.getDocAncestorNodeIds.call(void 0, pathForExpansion)));
           }
         } else if (nodes.length > 0) {
           const hasRootReadme = nodes.some((node) => node.type === "file" && node.path === folderIndexFile);
@@ -450,7 +457,7 @@ function useDocumentTree(config, initialPath) {
             setContent(null);
             return;
           }
-          const probe = _chunkC7NTL2GVcjs.findDocNodeByPath.call(void 0, _chunkC7NTL2GVcjs.stripFolderIndexFromPath.call(void 0, path, folderIndexFile), structure);
+          const probe = _chunkWZX26ODJcjs.findDocNodeByPath.call(void 0, _chunkWZX26ODJcjs.stripFolderIndexFromPath.call(void 0, path, folderIndexFile), structure);
           const probeIsNoReadmeFolder = !!probe && probe.type === "folder" && !probe.hasReadme;
           const preStructureFolderLike = structure.length === 0 && !path.endsWith(".md");
           if (probeIsNoReadmeFolder || preStructureFolderLike) {
@@ -507,7 +514,7 @@ function useDocumentTree(config, initialPath) {
     if (selectedPath === "") {
       pathToFetch = folderIndexFile;
     } else {
-      const node = _chunkC7NTL2GVcjs.findDocNodeByPath.call(void 0, selectedPath, structure);
+      const node = _chunkWZX26ODJcjs.findDocNodeByPath.call(void 0, selectedPath, structure);
       if (node && node.type === "folder" && !node.hasReadme) {
         const firstDocPath = findFirstDocPath(node);
         if (!firstDocPath) {
@@ -548,16 +555,16 @@ function useDocumentTree(config, initialPath) {
       if (node.type === "folder") {
         setExpandedNodes((prev) => {
           if (prev.has(node.id)) {
-            const ancestorIds = _chunkC7NTL2GVcjs.getDocAncestorNodeIds.call(void 0, node.path);
+            const ancestorIds = _chunkWZX26ODJcjs.getDocAncestorNodeIds.call(void 0, node.path);
             ancestorIds.pop();
             return new Set(ancestorIds);
           }
-          return new Set(_chunkC7NTL2GVcjs.getDocAncestorNodeIds.call(void 0, node.path));
+          return new Set(_chunkWZX26ODJcjs.getDocAncestorNodeIds.call(void 0, node.path));
         });
       } else {
         const lastSlash = node.path.lastIndexOf("/");
         if (lastSlash > 0) {
-          setExpandedNodes(new Set(_chunkC7NTL2GVcjs.getDocAncestorNodeIds.call(void 0, node.path.substring(0, lastSlash))));
+          setExpandedNodes(new Set(_chunkWZX26ODJcjs.getDocAncestorNodeIds.call(void 0, node.path.substring(0, lastSlash))));
         }
       }
       lastFetchedPath.current = null;
@@ -572,7 +579,7 @@ function useDocumentTree(config, initialPath) {
       const hashIndex = path.indexOf("#");
       const anchor = hashIndex !== -1 ? path.substring(hashIndex) : "";
       const cleanPath = path.replace(/\/$/, "").split("#")[0];
-      const pathForSelection = anchor && _optionalChain([options, 'optionalAccess', _6 => _6.fromInternalLink]) && cleanPath === "" ? selectedPathRef.current : _chunkC7NTL2GVcjs.stripFolderIndexFromPath.call(void 0, cleanPath, folderIndexFile);
+      const pathForSelection = anchor && _optionalChain([options, 'optionalAccess', _6 => _6.fromInternalLink]) && cleanPath === "" ? selectedPathRef.current : _chunkWZX26ODJcjs.stripFolderIndexFromPath.call(void 0, cleanPath, folderIndexFile);
       if (anchor && _optionalChain([options, 'optionalAccess', _7 => _7.fromInternalLink]) && pathForSelection === selectedPathRef.current) {
         _chunkCSJO7ZGNcjs.navigateSamePageHash.call(void 0, anchor, { headerOffset: _chunkCSJO7ZGNcjs.HUB_HEADER_OFFSET_PX });
         return;
@@ -636,15 +643,15 @@ function useDocumentTree(config, initialPath) {
     return docNavigation.register({
       baseRoute: normalizedBaseRoute,
       findNodeByPath: (path) => {
-        const clean = _chunkC7NTL2GVcjs.stripFolderIndexFromPath.call(void 0, path.replace(/\/$/, "").split("#")[0], folderIndexFile);
-        return _nullishCoalesce(_chunkC7NTL2GVcjs.findDocNodeByPath.call(void 0, clean, structure), () => ( null));
+        const clean = _chunkWZX26ODJcjs.stripFolderIndexFromPath.call(void 0, path.replace(/\/$/, "").split("#")[0], folderIndexFile);
+        return _nullishCoalesce(_chunkWZX26ODJcjs.findDocNodeByPath.call(void 0, clean, structure), () => ( null));
       },
       selectNode
     });
   }, [docNavigation, normalizedBaseRoute, structure, selectNode, folderIndexFile]);
   const isEmptyFolder = _react.useMemo.call(void 0, () => {
     if (!selectedPath || structure.length === 0) return false;
-    const node = _chunkC7NTL2GVcjs.findDocNodeByPath.call(void 0, selectedPath, structure);
+    const node = _chunkWZX26ODJcjs.findDocNodeByPath.call(void 0, selectedPath, structure);
     return !!node && node.type === "folder" && !node.hasReadme && !findFirstDocPath(node);
   }, [selectedPath, structure]);
   return {
@@ -724,14 +731,14 @@ function DocViewerContent({
     },
     docPath
   );
-  const { activeSection, handleSectionClick } = _chunk6RTHHU3Scjs.useScrollSpy.call(void 0, _optionalChain([content, 'optionalAccess', _11 => _11.sections]));
+  const { activeSection, handleSectionClick } = _chunkE3KFEOFAcjs.useScrollSpy.call(void 0, _optionalChain([content, 'optionalAccess', _11 => _11.sections]));
   const docNav = useDocNavigation();
   const router = _chunk7DNL734Scjs.useRouter.call(void 0, );
   const backCfg = backButton === false ? null : {
     label: _nullishCoalesce(_optionalChain([backButton, 'optionalAccess', _12 => _12.label]), () => ( "Back to home")),
     onClick: () => router.push(_nullishCoalesce(_optionalChain([backButton, 'optionalAccess', _13 => _13.href]), () => ( "/")))
   };
-  const docSearch = _chunkLLAKQT3Bcjs.useDocSearch.call(void 0, {
+  const docSearch = _chunkSGL47BS2cjs.useDocSearch.call(void 0, {
     source: chatSource,
     baseRoute,
     searchEndpoint,
@@ -755,7 +762,7 @@ function DocViewerContent({
       onResolveLink: resolveLink
     });
   }, [content, renderContent, navigateToDoc, sourceId, resolveLink]);
-  const selectedNodeDocType = selectedPath && structure.length > 0 ? _optionalChain([_chunkC7NTL2GVcjs.findDocNodeByPath.call(void 0, selectedPath, structure), 'optionalAccess', _14 => _14.documentType]) : void 0;
+  const selectedNodeDocType = selectedPath && structure.length > 0 ? _optionalChain([_chunkWZX26ODJcjs.findDocNodeByPath.call(void 0, selectedPath, structure), 'optionalAccess', _14 => _14.documentType]) : void 0;
   const activeDocType = _nullishCoalesce(_optionalChain([content, 'optionalAccess', _15 => _15.documentType]), () => ( selectedNodeDocType));
   const isMarkdownContent = !activeDocType || activeDocType === "markdown";
   const showStickyNav = isMarkdownContent;
@@ -766,9 +773,9 @@ 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;
-  const inner = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { ...bgStyle, ...containerBgStyle }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkU6XWGK53cjs.PageLayout, { title, subtitle, titleSize: "h1", titleWrap: true, backButton: _nullishCoalesce(backCfg, () => ( void 0)), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-col gap-10", children: [
+  const inner = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { ...bgStyle, ...containerBgStyle }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkALPRQ3ZXcjs.PageLayout, { title, subtitle, titleSize: "h1", titleWrap: true, backButton: _nullishCoalesce(backCfg, () => ( void 0)), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-col gap-10", children: [
     showAIChat && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkLLAKQT3Bcjs.DocSearchBar,
+      _chunkSGL47BS2cjs.DocSearchBar,
       {
         placeholder: `Search ${_optionalChain([sidebarLabel, 'optionalAccess', _19 => _19.toLowerCase, 'call', _20 => _20()]) || "documents"}...`,
         query: docSearch.query,
@@ -787,9 +794,9 @@ function DocViewerContent({
       ] })
     ] }) }),
     !error && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-1 flex-col items-start gap-6 content-lg:flex-row content-lg:gap-10", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-full content-lg:w-[320px] content-lg:shrink-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "content-lg:sticky content-lg:top-20", children: isLoadingStructure ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkR3FXJXSQcjs.CategorySidebarSkeleton, {}) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-full content-lg:w-[320px] content-lg:shrink-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "content-lg:sticky content-lg:top-20", children: isLoadingStructure ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSECT4H34cjs.CategorySidebarSkeleton, {}) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PersistentMobileDropdown, { isLoading: false, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunk6RTHHU3Scjs.MobileNavigationDropdown,
+          _chunkE3KFEOFAcjs.MobileNavigationDropdown,
           {
             nodes: structure,
             selectedPath,
@@ -803,7 +810,7 @@ function DocViewerContent({
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PersistentSidebar, { isLoading: false, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "hidden content-lg:block", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-4", children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "font-semibold text-ods-text-secondary text-h5", children: sidebarLabel }),
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _chunk6RTHHU3Scjs.MultiLevelNavigation,
+            _chunkE3KFEOFAcjs.MultiLevelNavigation,
             {
               nodes: structure,
               selectedPath,
@@ -829,12 +836,12 @@ function DocViewerContent({
           children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: `w-full min-w-0 ${isMarkdownContent ? "mx-auto max-w-4xl" : ""}`, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "article", { className: "space-y-2", children: isLoadingContent || isLoadingStructure ? renderSkeleton(selectedNodeDocType) : !content ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "py-16 text-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-ods-text-secondary text-h4", children: resolvedEmptyText }) }) : renderedContent }) }),
             isMarkdownContent && (isLoadingContent || isLoadingStructure) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "hidden content-lg:block", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "sticky top-24", children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mb-5 h-[14px] w-28 animate-pulse rounded bg-ods-border" }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "mb-5 h-[14px] w-28 rounded" }),
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "space-y-0", children: [130, 170, 190, 220, 110, 200, 80, 100, 120, 140, 90].map((w, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                 "div",
                 {
                   className: `border-l-2 py-[13px] pl-3 ${i === 0 ? "border-ods-accent" : "border-transparent"}`,
-                  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[13px] animate-pulse rounded bg-ods-border", style: { width: w } })
+                  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[13px] rounded", width: w })
                 },
                 i
               )) })
@@ -842,7 +849,7 @@ function DocViewerContent({
             showStickyNav && content && stickyNavSections.length > 0 && !isLoadingContent && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "hidden content-lg:block", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "sticky top-24", children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "mb-4 font-semibold text-ods-text-secondary text-h5", children: "ON THIS PAGE" }),
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                _chunk6RTHHU3Scjs.StickySectionNav,
+                _chunkE3KFEOFAcjs.StickySectionNav,
                 {
                   sections: stickyNavSections,
                   activeSection,
@@ -857,95 +864,93 @@ function DocViewerContent({
       ) })
     ] })
   ] }) }) });
-  return shell ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkR3FXJXSQcjs.PageShell, { contentClassName: `${bgClass} ${className}`, children: inner }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: `page-shell-content ${bgClass} ${className}`.trim(), children: inner });
+  return shell ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSECT4H34cjs.PageShell, { contentClassName: `${bgClass} ${className}`, children: inner }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: `page-shell-content ${bgClass} ${className}`.trim(), children: inner });
 }
 
 // src/components/docs/skeletons.tsx
 
-function MarkdownSkeleton() {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mt-6 space-y-7", children: [
+function MarkdownSkeleton({
+  region = true
+} = {}) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkUGCRLRCTcjs.LoadingRegion, { label: "Loading the document", announce: region, className: "mt-6 space-y-7", children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-[14px]", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-3/4 animate-pulse rounded bg-ods-border" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-3/4 rounded" })
     ] }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-[14px]", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-5/6 animate-pulse rounded bg-ods-border" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-5/6 rounded" })
     ] }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-[14px]", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-2/3 animate-pulse rounded bg-ods-border" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-2/3 rounded" })
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[88px] animate-pulse rounded-lg border border-ods-border bg-ods-card" }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-7 w-1/3 animate-pulse rounded bg-ods-border" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[88px] rounded-lg border border-ods-border" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-7 w-1/3 rounded" }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-[14px]", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-[72%] animate-pulse rounded bg-ods-border" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-[72%] rounded" })
     ] }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-[14px]", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-[58%] animate-pulse rounded bg-ods-border" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-[58%] rounded" })
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-7 w-2/5 animate-pulse rounded bg-ods-border" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-7 w-2/5 rounded" }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-[14px]", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-[90%] animate-pulse rounded bg-ods-border" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-[90%] rounded" })
     ] }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-[14px]", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-full animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[16px] w-[70%] animate-pulse rounded bg-ods-border" })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-full rounded" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[16px] w-[70%] rounded" })
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[88px] animate-pulse rounded-lg border border-ods-border bg-ods-card" })
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-[88px] rounded-lg border border-ods-border" })
   ] });
 }
-function EmbedSkeleton({ documentType } = {}) {
+function EmbedSkeleton({ documentType, region = true } = {}) {
   if (documentType === "file") {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex flex-col items-center justify-center py-16", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "w-full max-w-md space-y-4 rounded-xl border border-ods-border bg-ods-card p-8 text-center", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mx-auto h-16 w-16 animate-pulse rounded bg-ods-border" }),
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-2", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mx-auto h-5 w-2/3 animate-pulse rounded bg-ods-border" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mx-auto h-4 w-1/2 animate-pulse rounded bg-ods-border" })
-      ] }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-10 w-full animate-pulse rounded bg-ods-border" })
-    ] }) });
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkUGCRLRCTcjs.LoadingRegion,
+      {
+        label: "Loading the document",
+        announce: region,
+        className: "flex flex-col items-center justify-center py-16",
+        children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "w-full max-w-md space-y-4 rounded-xl border border-ods-border bg-ods-card p-8 text-center", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "mx-auto h-16 w-16 rounded" }),
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-2", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "mx-auto h-5 w-2/3 rounded" }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "mx-auto h-4 w-1/2 rounded" })
+          ] }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-10 w-full rounded" })
+        ] })
+      }
+    );
   }
   const buttonCount = documentType === "pdf" ? 2 : 1;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-4", children: [
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkUGCRLRCTcjs.LoadingRegion, { label: "Loading the document", announce: region, className: "space-y-4", children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-3 content-sm:flex-row content-sm:items-center content-sm:justify-between", children: [
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-5 w-5 shrink-0 animate-pulse rounded bg-ods-border" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-6 w-2/3 animate-pulse rounded bg-ods-border" })
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-5 w-5 shrink-0 rounded" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-6 w-2/3 rounded" })
       ] }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex w-full items-center gap-2 content-sm:w-auto", children: Array.from({ length: buttonCount }).map((_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        "div",
-        {
-          className: "h-10 w-full flex-1 animate-pulse rounded bg-ods-border content-sm:w-32 content-sm:flex-initial"
-        },
-        i
-      )) })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex w-full items-center gap-2 content-sm:w-auto", children: Array.from({ length: buttonCount }).map((_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2YXOD2KLcjs.UnifiedSkeleton, { className: "h-10 w-full flex-1 rounded content-sm:w-32 content-sm:flex-initial" }, i)) })
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      "div",
-      {
-        className: "w-full animate-pulse rounded-lg border border-ods-border bg-ods-card",
-        style: { height: "calc(100vh - 250px)" }
-      }
-    )
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSECT4H34cjs.EmbedLoadingSkeleton, { region: false })
   ] });
 }
 
@@ -953,11 +958,11 @@ function EmbedSkeleton({ documentType } = {}) {
 
 var DEFAULT_TITLE = "Documents";
 var defaultFallbackRenderer = () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "py-16 text-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-ods-text-secondary", children: "Unsupported document type" }) });
-var defaultPdfRenderer = (content, handlers) => content.fileUrl ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkPIQRV4EQcjs.PdfViewer, { src: content.fileUrl, fileName: content.fileName }) : defaultFallbackRenderer(content, handlers);
-var defaultGoogleSheetRenderer = (content, handlers) => content.externalUrl ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkPIQRV4EQcjs.GoogleSheetsViewer, { externalUrl: content.externalUrl, fileName: content.fileName }) : defaultFallbackRenderer(content, handlers);
-var defaultFigmaRenderer = (content, handlers) => content.externalUrl ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkR3FXJXSQcjs.FigmaEmbed, { url: content.externalUrl, title: content.fileName, loading: "eager" }) : defaultFallbackRenderer(content, handlers);
+var defaultPdfRenderer = (content, handlers) => content.fileUrl ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSOPVUD2Ycjs.PdfViewer, { src: content.fileUrl, fileName: content.fileName }) : defaultFallbackRenderer(content, handlers);
+var defaultGoogleSheetRenderer = (content, handlers) => content.externalUrl ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSOPVUD2Ycjs.GoogleSheetsViewer, { externalUrl: content.externalUrl, fileName: content.fileName }) : defaultFallbackRenderer(content, handlers);
+var defaultFigmaRenderer = (content, handlers) => content.externalUrl ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSECT4H34cjs.FigmaEmbed, { url: content.externalUrl, title: content.fileName, loading: "eager" }) : defaultFallbackRenderer(content, handlers);
 var defaultFileRenderer = (content) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  _chunkPIQRV4EQcjs.FileDownloadCard,
+  _chunkSOPVUD2Ycjs.FileDownloadCard,
   {
     fileName: content.fileName,
     mimeType: content.mimeType,