@flamingo-stack/openframe-frontend-core 0.0.710 → 0.0.712

package/dist/chunk-B4NCVYEQ.cjs

@@ -0,0 +1,292 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
+
+
+
+
+var _chunkULWVKHSIcjs = require('./chunk-ULWVKHSI.cjs');
+
+// src/hooks/ui/use-drag-and-drop-enabled.ts
+var DRAG_AND_DROP_MEDIA_QUERY = `(pointer: fine) and (hover: hover) and ${_chunkULWVKHSIcjs.breakpoints.md}`;
+function useDragAndDropEnabled() {
+  return _nullishCoalesce(_chunkULWVKHSIcjs.useMediaQuery.call(void 0, DRAG_AND_DROP_MEDIA_QUERY), () => ( false));
+}
+
+// src/hooks/ui/use-horizontal-scrollbar.ts
+var _react = require('react');
+function useHorizontalScrollbar() {
+  const scrollElRef = _react.useRef.call(void 0, null);
+  const trackRef = _react.useRef.call(void 0, null);
+  const thumbRef = _react.useRef.call(void 0, null);
+  const roRef = _react.useRef.call(void 0, null);
+  const moRef = _react.useRef.call(void 0, null);
+  const [thumbRatio, setThumbRatio] = _react.useState.call(void 0, 0);
+  const [canScrollLeft, setCanScrollLeft] = _react.useState.call(void 0, false);
+  const [canScrollRight, setCanScrollRight] = _react.useState.call(void 0, false);
+  const prevCanScrollLeftRef = _react.useRef.call(void 0, false);
+  const prevCanScrollRightRef = _react.useRef.call(void 0, false);
+  const isDraggingRef = _react.useRef.call(void 0, false);
+  const dragStartRef = _react.useRef.call(void 0, { mouseX: 0, scrollLeft: 0 });
+  const rafIdRef = _react.useRef.call(void 0, 0);
+  const syncThumbToDOM = _react.useCallback.call(void 0, () => {
+    const el = scrollElRef.current;
+    const thumb = thumbRef.current;
+    if (!el || !thumb) return;
+    const maxScroll = el.scrollWidth - el.clientWidth;
+    if (maxScroll <= 0) {
+      thumb.style.left = "0%";
+      return;
+    }
+    const ratio = el.clientWidth / el.scrollWidth;
+    const fraction = Math.min(Math.max(el.scrollLeft, 0), maxScroll) / maxScroll;
+    thumb.style.left = `${fraction * (1 - ratio) * 100}%`;
+  }, []);
+  const syncEdgeFades = _react.useCallback.call(void 0, () => {
+    const el = scrollElRef.current;
+    if (!el) return;
+    const maxScroll = el.scrollWidth - el.clientWidth;
+    const ratio = el.clientWidth / el.scrollWidth;
+    if (ratio >= 1 || maxScroll <= 0) {
+      if (prevCanScrollLeftRef.current) {
+        prevCanScrollLeftRef.current = false;
+        setCanScrollLeft(false);
+      }
+      if (prevCanScrollRightRef.current) {
+        prevCanScrollRightRef.current = false;
+        setCanScrollRight(false);
+      }
+      return;
+    }
+    const fraction = Math.min(Math.max(el.scrollLeft, 0), maxScroll) / maxScroll;
+    const left = fraction > 1e-3;
+    const right = fraction < 0.999;
+    if (left !== prevCanScrollLeftRef.current) {
+      prevCanScrollLeftRef.current = left;
+      setCanScrollLeft(left);
+    }
+    if (right !== prevCanScrollRightRef.current) {
+      prevCanScrollRightRef.current = right;
+      setCanScrollRight(right);
+    }
+  }, []);
+  const measure = _react.useCallback.call(void 0, () => {
+    const el = scrollElRef.current;
+    if (!el) return;
+    const ratio = el.clientWidth / el.scrollWidth;
+    setThumbRatio(ratio >= 1 ? 0 : ratio);
+    syncThumbToDOM();
+    syncEdgeFades();
+  }, [syncThumbToDOM, syncEdgeFades]);
+  const scrollRef = _react.useCallback.call(void 0, 
+    (node) => {
+      if (roRef.current) {
+        roRef.current.disconnect();
+        roRef.current = null;
+      }
+      if (moRef.current) {
+        moRef.current.disconnect();
+        moRef.current = null;
+      }
+      if (rafIdRef.current) {
+        cancelAnimationFrame(rafIdRef.current);
+        rafIdRef.current = 0;
+      }
+      scrollElRef.current = node;
+      if (node) {
+        const ratio = node.clientWidth / node.scrollWidth;
+        setThumbRatio(ratio >= 1 ? 0 : ratio);
+        const ro = new ResizeObserver(measure);
+        roRef.current = ro;
+        const observeAll = () => {
+          ro.disconnect();
+          ro.observe(node);
+          for (const child of Array.from(node.children)) ro.observe(child);
+        };
+        observeAll();
+        moRef.current = new MutationObserver(() => {
+          observeAll();
+          measure();
+        });
+        moRef.current.observe(node, { childList: true });
+        requestAnimationFrame(() => {
+          syncThumbToDOM();
+          syncEdgeFades();
+        });
+      } else {
+        setThumbRatio(0);
+        prevCanScrollLeftRef.current = false;
+        prevCanScrollRightRef.current = false;
+        setCanScrollLeft(false);
+        setCanScrollRight(false);
+      }
+    },
+    [measure, syncThumbToDOM, syncEdgeFades]
+  );
+  const onScroll = _react.useCallback.call(void 0, () => {
+    if (isDraggingRef.current) return;
+    if (rafIdRef.current) cancelAnimationFrame(rafIdRef.current);
+    rafIdRef.current = requestAnimationFrame(() => {
+      syncThumbToDOM();
+      syncEdgeFades();
+    });
+  }, [syncThumbToDOM, syncEdgeFades]);
+  const onTrackClick = _react.useCallback.call(void 0, (e) => {
+    if (e.target.closest("[data-scrollbar-thumb]")) return;
+    const track = trackRef.current;
+    const el = scrollElRef.current;
+    if (!track || !el) return;
+    const ratio = el.clientWidth / el.scrollWidth;
+    if (ratio >= 1) return;
+    const rect = track.getBoundingClientRect();
+    const thumbWidth = rect.width * ratio;
+    const maxThumbOffset = rect.width - thumbWidth;
+    if (maxThumbOffset <= 0) return;
+    const targetFraction = Math.max(0, Math.min(1, (e.clientX - rect.left - thumbWidth / 2) / maxThumbOffset));
+    const targetScrollLeft = targetFraction * (el.scrollWidth - el.clientWidth);
+    el.scrollTo({ left: targetScrollLeft, behavior: "smooth" });
+  }, []);
+  const onTrackWheel = _react.useCallback.call(void 0, (e) => {
+    const el = scrollElRef.current;
+    if (!el) return;
+    e.preventDefault();
+    el.scrollLeft += e.deltaX || e.deltaY;
+  }, []);
+  const onThumbPointerDown = _react.useCallback.call(void 0, (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const el = scrollElRef.current;
+    if (!el) return;
+    isDraggingRef.current = true;
+    dragStartRef.current = { mouseX: e.clientX, scrollLeft: el.scrollLeft };
+    const target = e.currentTarget;
+    target.setPointerCapture(e.pointerId);
+    target.style.cursor = "grabbing";
+  }, []);
+  const onThumbPointerMove = _react.useCallback.call(void 0, 
+    (e) => {
+      if (!isDraggingRef.current) return;
+      const el = scrollElRef.current;
+      const track = trackRef.current;
+      if (!el || !track) return;
+      const currentThumbRatio = el.clientWidth / el.scrollWidth;
+      if (currentThumbRatio >= 1) return;
+      const trackWidth = track.clientWidth;
+      const thumbWidth = trackWidth * currentThumbRatio;
+      const maxThumbTravel = trackWidth - thumbWidth;
+      if (maxThumbTravel <= 0) return;
+      const mouseDelta = e.clientX - dragStartRef.current.mouseX;
+      const scrollRange = el.scrollWidth - el.clientWidth;
+      el.scrollLeft = Math.min(
+        Math.max(dragStartRef.current.scrollLeft + mouseDelta / maxThumbTravel * scrollRange, 0),
+        scrollRange
+      );
+      syncThumbToDOM();
+      syncEdgeFades();
+    },
+    [syncThumbToDOM, syncEdgeFades]
+  );
+  const onThumbPointerUp = _react.useCallback.call(void 0, (e) => {
+    isDraggingRef.current = false;
+    const target = e.currentTarget;
+    target.releasePointerCapture(e.pointerId);
+    target.style.cursor = "grab";
+  }, []);
+  const onThumbPointerCancel = _react.useCallback.call(void 0, (e) => {
+    isDraggingRef.current = false;
+    const target = e.currentTarget;
+    target.style.cursor = "grab";
+  }, []);
+  return {
+    scrollRef,
+    trackRef,
+    thumbRef,
+    thumbRatio,
+    canScrollLeft,
+    canScrollRight,
+    onScroll,
+    onTrackClick,
+    onTrackWheel,
+    onThumbPointerDown,
+    onThumbPointerMove,
+    onThumbPointerUp,
+    onThumbPointerCancel
+  };
+}
+
+// src/hooks/ui/use-local-storage.ts
+
+
+// src/utils/storage-event.ts
+function readLocalStorageUpdateDetail(event) {
+  if (!("detail" in event)) return null;
+  const detail = event.detail;
+  if (typeof detail !== "object" || detail === null) return null;
+  if (!("key" in detail) || typeof detail.key !== "string") return null;
+  const newValue = "newValue" in detail ? detail.newValue : null;
+  if (newValue !== null && newValue !== void 0 && typeof newValue !== "string") return null;
+  return { key: detail.key, newValue: _nullishCoalesce(newValue, () => ( null)) };
+}
+
+// src/hooks/ui/use-local-storage.ts
+function useLocalStorage(key, initialValue, options) {
+  const initialValueRef = _react.useRef.call(void 0, initialValue);
+  _react.useEffect.call(void 0, () => {
+    initialValueRef.current = initialValue;
+  });
+  const validate = _optionalChain([options, 'optionalAccess', _ => _.validate]);
+  const storage = _react.useMemo.call(void 0, 
+    () => _chunkULWVKHSIcjs.createLocalStorageAdapter.call(void 0, { key, validate, logTag: `[useLocalStorage:${key}]` }),
+    [key, validate]
+  );
+  const [storedValue, setStoredValue] = _react.useState.call(void 0, () => _nullishCoalesce(storage.load(), () => ( initialValue)));
+  const isInitialized = _react.useRef.call(void 0, true);
+  const isFromStorageEvent = _react.useRef.call(void 0, false);
+  _react.useEffect.call(void 0, () => {
+    if (!isInitialized.current) return void 0;
+    const syncFromStorage = (source) => {
+      const next = storage.load();
+      isFromStorageEvent.current = true;
+      setStoredValue(_nullishCoalesce(next, () => ( initialValueRef.current)));
+      console.log(`\u{1F504} ${next === null ? "Cleared" : "Updated"} localStorage key "${key}" from ${source}`);
+    };
+    const handleStorageChange = (e) => {
+      if (e.key !== key) return;
+      syncFromStorage("storage event");
+    };
+    const handleCustomStorageUpdate = (event) => {
+      const detail = readLocalStorageUpdateDetail(event);
+      if (_optionalChain([detail, 'optionalAccess', _2 => _2.key]) !== key) return;
+      syncFromStorage("custom storage event");
+    };
+    window.addEventListener("storage", handleStorageChange);
+    window.addEventListener("localStorageUpdate", handleCustomStorageUpdate);
+    return () => {
+      window.removeEventListener("storage", handleStorageChange);
+      window.removeEventListener("localStorageUpdate", handleCustomStorageUpdate);
+    };
+  }, [key, storage]);
+  _react.useEffect.call(void 0, () => {
+    if (!isInitialized.current) return;
+    if (isFromStorageEvent.current) {
+      isFromStorageEvent.current = false;
+      return;
+    }
+    storage.save(storedValue);
+  }, [storage, storedValue]);
+  const setValue = (value) => {
+    try {
+      const valueToStore = value instanceof Function ? value(storedValue) : value;
+      setStoredValue(valueToStore);
+    } catch (error) {
+      console.error(`Error setting value for localStorage key "${key}":`, error);
+    }
+  };
+  return [storedValue, setValue];
+}
+
+
+
+
+
+
+
+exports.DRAG_AND_DROP_MEDIA_QUERY = DRAG_AND_DROP_MEDIA_QUERY; exports.useDragAndDropEnabled = useDragAndDropEnabled; exports.useHorizontalScrollbar = useHorizontalScrollbar; exports.readLocalStorageUpdateDetail = readLocalStorageUpdateDetail; exports.useLocalStorage = useLocalStorage;

package/dist/{chunk-2RNB5DTN.cjs → chunk-BXSRTBLU.cjs}

@@ -1,38 +1,43 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
 
 
-var _chunkUDFRUKLCcjs = require('./chunk-UDFRUKLC.cjs');
+var _chunkGEDY7HQIcjs = require('./chunk-GEDY7HQI.cjs');
 
 
+var _chunkL6ZQGWCXcjs = require('./chunk-L6ZQGWCX.cjs');
 
-var _chunkP42V6N34cjs = require('./chunk-P42V6N34.cjs');
 
+var _chunkPPXR22YCcjs = require('./chunk-PPXR22YC.cjs');
 
-var _chunkWCVZCGK5cjs = require('./chunk-WCVZCGK5.cjs');
 
+var _chunkJO5TLJPMcjs = require('./chunk-JO5TLJPM.cjs');
 
-var _chunkBIZNSF3Ucjs = require('./chunk-BIZNSF3U.cjs');
 
 
 
+var _chunkHETQETPVcjs = require('./chunk-HETQETPV.cjs');
 
-var _chunkSEXWHIMScjs = require('./chunk-SEXWHIMS.cjs');
 
 
+var _chunkGQ7JJUITcjs = require('./chunk-GQ7JJUIT.cjs');
 
 
-var _chunkUVTD52MDcjs = require('./chunk-UVTD52MD.cjs');
+var _chunkWVOTC7HWcjs = require('./chunk-WVOTC7HW.cjs');
 
 
 var _chunk7DNL734Scjs = require('./chunk-7DNL734S.cjs');
 
 
-var _chunk6NTPY5QAcjs = require('./chunk-6NTPY5QA.cjs');
+
+var _chunkETYLOZOBcjs = require('./chunk-ETYLOZOB.cjs');
 
 
 var _chunkVX4E6YSBcjs = require('./chunk-VX4E6YSB.cjs');
 
 
+var _chunkLLRGR4I5cjs = require('./chunk-LLRGR4I5.cjs');
+
+
 var _chunk3ATAYP36cjs = require('./chunk-3ATAYP36.cjs');
 
 // src/components/faq/faq-section.tsx
@@ -56,7 +61,7 @@ function FaqAccordion({ items, defaultOpenIds = [] }) {
     return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
       "div",
       {
-        id: _chunkSEXWHIMScjs.faqItemAnchor.call(void 0, item.id),
+        id: _chunkHETQETPVcjs.faqItemAnchor.call(void 0, item.id),
         className: "scroll-mt-24 transition-colors hover:bg-ods-bg-hover",
         children: [
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -134,7 +139,7 @@ function buildFaqJsonLdFromFaqs(faqs, opts = {}) {
 
 var DEFAULT_HEADING_TEXT = "Frequently Asked Questions";
 function buildFaqsUrl(entityType, entityId, minResults, apiBaseUrl = "") {
-  return _chunkBIZNSF3Ucjs.buildSuggestionUrl.call(void 0, "/api/faqs", { apiBaseUrl, entityType, entityId, count: minResults });
+  return _chunkETYLOZOBcjs.buildSuggestionUrl.call(void 0, "/api/faqs", { apiBaseUrl, entityType, entityId, count: minResults });
 }
 function groupFaqsBySection(faqs) {
   const byName = /* @__PURE__ */ new Map();
@@ -149,7 +154,7 @@ function groupFaqsBySection(faqs) {
     }
     let group = byName.get(name);
     if (!group) {
-      group = { section: name, slug: _chunkSEXWHIMScjs.faqSectionSlug.call(void 0, name), items: [] };
+      group = { section: name, slug: _chunkHETQETPVcjs.faqSectionSlug.call(void 0, name), items: [] };
       byName.set(name, group);
     }
     group.items.push(item);
@@ -162,7 +167,9 @@ var UNCATEGORIZED_KEY = "__uncategorized__";
 var groupKey = (g) => _nullishCoalesce(g.slug, () => ( UNCATEGORIZED_KEY));
 function GroupedFaqList({
   groups,
-  categoryHeadingAs
+  categoryHeadingAs,
+  heading,
+  aside
 }) {
   const CategoryHeading = categoryHeadingAs;
   const navGroups = _react.useMemo.call(void 0, () => groups.filter((g) => g.slug), [groups]);
@@ -192,7 +199,7 @@ function GroupedFaqList({
         }
         if (bestId) setActiveSlug(bestId);
       },
-      { rootMargin: `-${_chunkUVTD52MDcjs.STICKY_HEADER_OFFSET_PX}px 0px -55% 0px`, threshold: 0 }
+      { rootMargin: `-${_chunkGQ7JJUITcjs.STICKY_HEADER_OFFSET_PX}px 0px -55% 0px`, threshold: 0 }
     );
     for (const group of navGroupsRef.current) {
       const el = group.slug ? document.getElementById(group.slug) : null;
@@ -202,7 +209,7 @@ function GroupedFaqList({
   }, [slugKey]);
   const [hashTarget, setHashTarget] = _react.useState.call(void 0, null);
   _react.useEffect.call(void 0, () => {
-    const refresh = () => setHashTarget(_chunkSEXWHIMScjs.parseFaqHash.call(void 0, window.location.hash));
+    const refresh = () => setHashTarget(_chunkHETQETPVcjs.parseFaqHash.call(void 0, window.location.hash));
     refresh();
     window.addEventListener("hashchange", refresh);
     return () => window.removeEventListener("hashchange", refresh);
@@ -219,7 +226,7 @@ function GroupedFaqList({
   }, [groups, hashTarget]);
   const accordionKeySuffix = _optionalChain([hashTarget, 'optionalAccess', _8 => _8.kind]) === "item" ? `item:${hashTarget.rawId}` : "default";
   const scrollDep = `${groups.length}|` + (_optionalChain([hashTarget, 'optionalAccess', _9 => _9.kind]) === "item" ? `item:${hashTarget.rawId}` : _optionalChain([hashTarget, 'optionalAccess', _10 => _10.kind]) === "section" ? `section:${hashTarget.slug}` : "none");
-  _chunkWCVZCGK5cjs.useScrollToHash.call(void 0, scrollDep, { headerOffset: _chunkUVTD52MDcjs.STICKY_HEADER_OFFSET_PX });
+  _chunkJO5TLJPMcjs.useScrollToHash.call(void 0, scrollDep, { headerOffset: _chunkGQ7JJUITcjs.STICKY_HEADER_OFFSET_PX });
   const [pillSyncedHash, setPillSyncedHash] = _react.useState.call(void 0, hashTarget);
   if (pillSyncedHash !== hashTarget) {
     setPillSyncedHash(hashTarget);
@@ -227,43 +234,55 @@ function GroupedFaqList({
   }
   const handleJump = _react.useCallback.call(void 0, (e, slug) => {
     e.preventDefault();
-    _chunkUVTD52MDcjs.navigateSamePageHash.call(void 0, "#" + slug, {
-      headerOffset: _chunkUVTD52MDcjs.STICKY_HEADER_OFFSET_PX,
+    _chunkGQ7JJUITcjs.navigateSamePageHash.call(void 0, "#" + slug, {
+      headerOffset: _chunkGQ7JJUITcjs.STICKY_HEADER_OFFSET_PX,
       history: "replace"
     });
   }, []);
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-8", children: [
-    navGroups.length > 1 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "nav", { "aria-label": "FAQ categories", className: "flex flex-wrap gap-2", children: navGroups.map((group) => {
-      const isActive = group.slug === activeSlug;
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        "a",
+  const categoryNav = navGroups.length > 1 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "nav", { "aria-label": "FAQ categories", className: "flex flex-wrap gap-2", children: navGroups.map((group) => {
+    const isActive = group.slug === activeSlug;
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkLLRGR4I5cjs.next_link_default,
+      {
+        href: `#${group.slug}`,
+        "aria-current": isActive ? "true" : void 0,
+        onClick: (e) => handleJump(e, group.slug),
+        className: _chunk3ATAYP36cjs.cn.call(void 0, 
+          "rounded-full border px-4 py-2 transition-colors text-h6",
+          isActive ? "border-ods-text-primary bg-ods-card text-ods-text-primary" : "border-ods-border bg-ods-card text-ods-text-secondary hover:border-ods-text-secondary hover:text-ods-text-primary"
+        ),
+        children: group.section
+      },
+      group.slug
+    );
+  }) });
+  const questions = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "space-y-10", children: groups.map((group) => {
+    const key = groupKey(group);
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "section", { id: _nullishCoalesce(group.slug, () => ( void 0)), className: "scroll-mt-24 space-y-4", children: [
+      group.section && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CategoryHeading, { className: _chunkETYLOZOBcjs.SECTION_HEADING_CLASS, children: group.section }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        FaqAccordion,
         {
-          href: `#${group.slug}`,
-          "aria-current": isActive ? "true" : void 0,
-          onClick: (e) => handleJump(e, group.slug),
-          className: _chunk3ATAYP36cjs.cn.call(void 0, 
-            "rounded-full border px-4 py-2 transition-colors text-h6",
-            isActive ? "border-ods-text-primary bg-ods-card text-ods-text-primary" : "border-ods-border bg-ods-card text-ods-text-secondary hover:border-ods-text-secondary hover:text-ods-text-primary"
-          ),
-          children: group.section
+          items: group.items,
+          defaultOpenIds: _optionalChain([defaultOpenByGroupKey, 'optionalAccess', _12 => _12.get, 'call', _13 => _13(key)])
         },
-        group.slug
-      );
-    }) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "space-y-10", children: groups.map((group) => {
-      const key = groupKey(group);
-      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "section", { id: _nullishCoalesce(group.slug, () => ( void 0)), className: "scroll-mt-24 space-y-4", children: [
-        group.section && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CategoryHeading, { className: _chunk6NTPY5QAcjs.SECTION_HEADING_CLASS, children: group.section }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          FaqAccordion,
-          {
-            items: group.items,
-            defaultOpenIds: _optionalChain([defaultOpenByGroupKey, 'optionalAccess', _12 => _12.get, 'call', _13 => _13(key)])
-          },
-          `${key}:${accordionKeySuffix}`
-        )
-      ] }, key);
-    }) })
+        `${key}:${accordionKeySuffix}`
+      )
+    ] }, key);
+  }) });
+  if (!aside) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-8", children: [
+      categoryNav,
+      questions
+    ] });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "grid gap-10 content-lg:grid-cols-[minmax(0,1fr)_minmax(0,2fr)] content-lg:grid-rows-[auto_1fr] content-lg:gap-x-16", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-8", children: [
+      heading,
+      categoryNav
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "content-lg:col-start-2 content-lg:row-span-2 content-lg:row-start-1", children: questions }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "content-lg:col-start-1 content-lg:row-start-2", children: aside })
   ] });
 }
 function FaqSkeleton() {
@@ -284,17 +303,18 @@ function FaqSection({
   jsonLd,
   className,
   minResults,
-  apiBaseUrl = ""
+  apiBaseUrl = "",
+  aside
 }) {
   const url = buildFaqsUrl(entityType, entityId, minResults, apiBaseUrl);
   const initialData = _react.useMemo.call(void 0, 
     () => initialFaqs ? { faqs: initialFaqs } : void 0,
     [initialFaqs]
   );
-  const { data, isLoading, error } = _chunkUDFRUKLCcjs.useSelfFetch.call(void 0, url, { initialData });
+  const { data, isLoading, error } = _chunkGEDY7HQIcjs.useSelfFetch.call(void 0, url, { initialData });
   const faqs = _react.useMemo.call(void 0, () => _nullishCoalesce(_optionalChain([data, 'optionalAccess', _14 => _14.faqs]), () => ( [])), [_optionalChain([data, 'optionalAccess', _15 => _15.faqs])]);
   const groups = _react.useMemo.call(void 0, () => faqs.length > 0 ? groupFaqsBySection(faqs) : [], [faqs]);
-  const headingNode = heading === void 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: _chunk6NTPY5QAcjs.SECTION_HEADING_CLASS, children: DEFAULT_HEADING_TEXT }) : heading;
+  const headingNode = heading === void 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: _chunkETYLOZOBcjs.SECTION_HEADING_CLASS, children: DEFAULT_HEADING_TEXT }) : heading;
   if (error) return null;
   if (!isLoading && faqs.length === 0) return null;
   if (isLoading && faqs.length === 0) {
@@ -303,14 +323,22 @@ function FaqSection({
   const schema = emitJsonLd ? buildFaqJsonLdFromFaqs(faqs, jsonLd) : null;
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "section", { className: _nullishCoalesce(className, () => ( "space-y-10")), children: [
-      headingNode,
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, GroupedFaqList, { groups, categoryHeadingAs: heading === null ? "h2" : "h3" })
+      !aside && headingNode,
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        GroupedFaqList,
+        {
+          groups,
+          categoryHeadingAs: heading === null ? "h2" : "h3",
+          heading: aside ? headingNode : void 0,
+          aside
+        }
+      )
     ] }),
     schema && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       "script",
       {
         type: "application/ld+json",
-        dangerouslySetInnerHTML: { __html: _chunkUVTD52MDcjs.serializeJsonLd.call(void 0, schema) }
+        dangerouslySetInnerHTML: { __html: _chunkWVOTC7HWcjs.serializeJsonLd.call(void 0, schema) }
       }
     )
   ] });
@@ -336,7 +364,7 @@ function FaqDocumentPage({
     label: _nullishCoalesce(_optionalChain([backButton, 'optionalAccess', _16 => _16.label]), () => ( "Back to home")),
     onClick: () => router.push(_nullishCoalesce(_optionalChain([backButton, 'optionalAccess', _17 => _17.href]), () => ( "/")))
   };
-  const inner = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP42V6N34cjs.PageLayout, { title, subtitle, backButton: backCfg, titleSize: "h1", titleWrap: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  const inner = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkPPXR22YCcjs.PageLayout, { title, subtitle, backButton: backCfg, titleSize: "h1", titleWrap: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     FaqSection,
     {
       initialFaqs,
@@ -349,7 +377,7 @@ function FaqDocumentPage({
       minResults
     }
   ) });
-  return shell ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkP42V6N34cjs.PageShell, { children: inner }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "page-shell-content", children: inner });
+  return shell ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkL6ZQGWCXcjs.PageShell, { children: inner }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "page-shell-content", children: inner });
 }