@flamingo-stack/openframe-frontend-core 0.0.388 → 0.0.389

package/dist/{chunk-VCRUAKOJ.js → chunk-IDWKP5H5.js}

@@ -139,6 +139,7 @@ import {
   UserPlusIcon,
   UserSearchIcon,
   VideoRecorderIcon,
+  VolumeXmarkIcon,
   WindowsLogoGreyIcon,
   WrenchIcon,
   XmarkAltIcon,
@@ -9396,7 +9397,7 @@ var TabsContent = React28.forwardRef(({ className, ...props }, ref) => /* @__PUR
 TabsContent.displayName = TabsPrimitive.Content.displayName;
 
 // src/components/features/video.tsx
-import { useEffect as useEffect16, useMemo as useMemo12, useRef as useRef14, useState as useState21 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect16, useMemo as useMemo12, useRef as useRef14, useState as useState21 } from "react";
 import MuxPlayer from "@mux/mux-player-react";
 
 // src/utils/fetch-priority.ts
@@ -9430,6 +9431,28 @@ if (typeof window !== "undefined" && typeof console !== "undefined") {
     };
   }
 }
+var userHasInteracted = false;
+var activationWaiters = /* @__PURE__ */ new Set();
+if (typeof window !== "undefined") {
+  const w = window;
+  if (!w.__VIDEO_ACTIVATION_TRACKED__) {
+    w.__VIDEO_ACTIVATION_TRACKED__ = true;
+    const markActivated = () => {
+      userHasInteracted = true;
+      activationWaiters.forEach((fn) => {
+        try {
+          fn();
+        } catch {
+        }
+      });
+      activationWaiters.clear();
+      window.removeEventListener("pointerdown", markActivated, true);
+      window.removeEventListener("keydown", markActivated, true);
+    };
+    window.addEventListener("pointerdown", markActivated, true);
+    window.addEventListener("keydown", markActivated, true);
+  }
+}
 var YT_HOSTS = /* @__PURE__ */ new Set([
   "youtube.com",
   "www.youtube.com",
@@ -9491,6 +9514,7 @@ function Video2(props) {
       loop: "loop" in props ? props.loop : void 0,
       chromeless: "chromeless" in props ? props.chromeless : void 0,
       playOnHover: "playOnHover" in props ? props.playOnHover : void 0,
+      playWhenHovered: "playWhenHovered" in props ? props.playWhenHovered : void 0,
       centerControlsOnly: "centerControlsOnly" in props ? props.centerControlsOnly : void 0,
       className: props.className
     }
@@ -9526,45 +9550,99 @@ function FilePlayer({
   loop,
   chromeless,
   playOnHover,
+  playWhenHovered,
   centerControlsOnly,
   className
 }) {
   const [isPlaying, setIsPlaying] = useState21(false);
+  const [hoverMutedFallback, setHoverMutedFallback] = useState21(false);
   const hoverPlayerRef = useRef14(null);
   const hoverActiveRef = useRef14(false);
   const hoverGenerationRef = useRef14(0);
-  const handleHoverEnter = playOnHover ? () => {
+  const activationWaiterRef = useRef14(null);
+  const clearActivationWaiter = useCallback13(() => {
+    if (activationWaiterRef.current) {
+      activationWaiters.delete(activationWaiterRef.current);
+      activationWaiterRef.current = null;
+    }
+  }, []);
+  useEffect16(() => clearActivationWaiter, [clearActivationWaiter]);
+  const startHoverPlayback = useCallback13(() => {
     hoverActiveRef.current = true;
     const generation = ++hoverGenerationRef.current;
     const el = hoverPlayerRef.current;
     if (!el) return;
     try {
       el.volume = 0.5;
-      el.muted = false;
-      const attempt = el.play?.();
-      if (attempt && typeof attempt.catch === "function") {
-        attempt.catch((err) => {
+      if (userHasInteracted) {
+        el.muted = false;
+        el.play?.()?.catch?.((err) => {
           const name = err?.name;
           if (name === "NotAllowedError" && hoverActiveRef.current && generation === hoverGenerationRef.current) {
             try {
               el.muted = true;
               el.play?.()?.catch?.(() => {
               });
+              setHoverMutedFallback(true);
             } catch {
             }
           }
         });
+      } else {
+        el.muted = true;
+        el.play?.()?.catch?.(() => {
+        });
+        setHoverMutedFallback(true);
+        clearActivationWaiter();
+        const waiter = () => {
+          activationWaiterRef.current = null;
+          if (hoverActiveRef.current && generation === hoverGenerationRef.current) {
+            try {
+              el.muted = false;
+              el.volume = 0.5;
+            } catch {
+            }
+            setHoverMutedFallback(false);
+          }
+        };
+        activationWaiterRef.current = waiter;
+        activationWaiters.add(waiter);
       }
     } catch {
     }
-  } : void 0;
-  const handleHoverLeave = playOnHover ? () => {
+  }, []);
+  const stopHoverPlayback = useCallback13(() => {
     hoverActiveRef.current = false;
+    setHoverMutedFallback(false);
+    clearActivationWaiter();
     try {
       hoverPlayerRef.current?.pause?.();
     } catch {
     }
-  } : void 0;
+  }, [clearActivationWaiter]);
+  const unmuteNow = useCallback13((e) => {
+    e.stopPropagation();
+    e.preventDefault();
+    const el = hoverPlayerRef.current;
+    try {
+      if (el) {
+        el.muted = false;
+        el.volume = 0.5;
+        el.play?.()?.catch?.(() => {
+        });
+      }
+    } catch {
+    }
+    setHoverMutedFallback(false);
+  }, []);
+  const hoverControlled = typeof playWhenHovered === "boolean";
+  useEffect16(() => {
+    if (!hoverControlled) return;
+    if (playWhenHovered) startHoverPlayback();
+    else stopHoverPlayback();
+  }, [hoverControlled, playWhenHovered, startHoverPlayback, stopHoverPlayback]);
+  const handleHoverEnter = playOnHover && !hoverControlled ? startHoverPlayback : void 0;
+  const handleHoverLeave = playOnHover && !hoverControlled ? stopHoverPlayback : void 0;
   if (process.env.NODE_ENV !== "production" && srtContent && !captionsUrl) {
     console.warn(
       "[Video] srtContent supplied without captionsUrl \u2014 captions will not render. Pass captionsUrl (the VTT URL) instead; raw SRT text overlays are no longer supported."
@@ -9610,17 +9688,37 @@ function FilePlayer({
       ) : null
     }
   );
-  if (playOnHover) {
-    return /* @__PURE__ */ jsx67(
+  const unmuteBadge = hoverMutedFallback ? /* @__PURE__ */ jsx67(
+    "button",
+    {
+      type: "button",
+      "aria-label": "Unmute",
+      title: "Unmute",
+      onClick: unmuteNow,
+      className: "absolute inset-0 z-10 m-auto flex h-14 w-14 items-center justify-center text-ods-text-primary transition-opacity hover:opacity-75",
+      children: /* @__PURE__ */ jsx67(VolumeXmarkIcon, { size: 56 })
+    }
+  ) : null;
+  if (playOnHover && !hoverControlled) {
+    return /* @__PURE__ */ jsxs52(
       "div",
       {
-        className: "w-full h-full",
+        className: "relative w-full h-full",
         onPointerEnter: handleHoverEnter,
         onPointerLeave: handleHoverLeave,
-        children: player
+        children: [
+          player,
+          unmuteBadge
+        ]
       }
     );
   }
+  if (hoverControlled) {
+    return /* @__PURE__ */ jsxs52("div", { className: "relative w-full h-full", children: [
+      player,
+      unmuteBadge
+    ] });
+  }
   return player;
 }
 function YouTubeFacade({
@@ -9760,7 +9858,7 @@ function YouTubeFacadeInner({
 
 // src/components/features/video-bites-strip.tsx
 init_cn();
-import { useCallback as useCallback13, useEffect as useEffect18, useMemo as useMemo13, useRef as useRef15, useState as useState22 } from "react";
+import { useCallback as useCallback14, useEffect as useEffect18, useMemo as useMemo13, useRef as useRef15, useState as useState22 } from "react";
 
 // src/components/features/use-video-warmup.ts
 import { useEffect as useEffect17 } from "react";
@@ -9961,11 +10059,11 @@ function UserDisplay({ name, avatarUrl, subtitle, size: size2 = 32, shape = "squ
     /* @__PURE__ */ jsxs54("div", { className: "min-w-0 flex-1", children: [
       /* @__PURE__ */ jsx70("p", { className: cn(
         "font-['DM_Sans'] text-ods-text-primary truncate",
-        compact ? "text-sm leading-5 font-medium" : "text-lg leading-[22px]"
+        compact ? "text-xs leading-4 font-medium" : "text-lg leading-[22px]"
       ), children: name }),
       subtitle && /* @__PURE__ */ jsx70("span", { className: cn(
         "font-['DM_Sans'] text-ods-text-secondary truncate block",
-        compact ? "text-sm leading-5 font-medium" : "text-md leading-[16px]"
+        compact ? "text-xs leading-4 font-medium" : "text-md leading-[16px]"
       ), children: subtitle })
     ] })
   ] });
@@ -10006,7 +10104,7 @@ function VideoBitesStrip({
   href,
   headerSlot,
   autoScroll = true,
-  autoScrollSpeed = 28,
+  autoScrollSpeed = 60,
   pauseOnHover = true,
   cardHeightDesktop = 416,
   cardHeightMobile = 300,
@@ -10041,7 +10139,7 @@ function VideoBitesStrip({
   const [overflows, setOverflows] = useState22(false);
   const singleCopyWidthRef = useRef15(0);
   const marqueeActive = autoScroll && !reducedMotion && overflows && items.length > 0;
-  const measure = useCallback13(() => {
+  const measure = useCallback14(() => {
     const scroller = scrollerRef.current;
     const track = trackRef.current;
     if (!scroller || !track) return;
@@ -10060,7 +10158,6 @@ function VideoBitesStrip({
     ro.observe(track);
     return () => ro.disconnect();
   }, [measure, items.length, marqueeActive, isMobile]);
-  const hoveredRef = useRef15(false);
   const nearViewportRef = useRef15(true);
   const chevronSuppressUntilRef = useRef15(0);
   const userScrollSuppressUntilRef = useRef15(0);
@@ -10076,22 +10173,44 @@ function VideoBitesStrip({
     io.observe(el);
     return () => io.disconnect();
   }, []);
+  const marqueePosRef = useRef15(0);
+  const glideRemainingRef = useRef15(0);
   useEffect18(() => {
     if (!marqueeActive) return;
     const scroller = scrollerRef.current;
     if (!scroller) return;
     let raf = 0;
     let last = performance.now();
+    marqueePosRef.current = scroller.scrollLeft;
+    const wrap = (pos) => {
+      const half = singleCopyWidthRef.current;
+      if (half <= 0) return pos;
+      while (pos >= half) pos -= half;
+      while (pos < 0) pos += half;
+      return pos;
+    };
     const tick = (now) => {
       const dt = Math.min(now - last, 100) / 1e3;
       last = now;
-      const paused = pauseOnHover && hoveredRef.current || !nearViewportRef.current || document.visibilityState === "hidden" || now < Math.max(chevronSuppressUntilRef.current, userScrollSuppressUntilRef.current);
-      if (!paused) {
-        scroller.scrollLeft += autoScrollSpeed * dt;
-        const half = singleCopyWidthRef.current;
-        if (half > 0 && scroller.scrollLeft >= half) {
-          scroller.scrollLeft -= half;
-        }
+      const paused = pauseOnHover && activeKeyRef.current !== null || !nearViewportRef.current || document.visibilityState === "hidden" || now < Math.max(chevronSuppressUntilRef.current, userScrollSuppressUntilRef.current);
+      const glide = glideRemainingRef.current;
+      if (glide !== 0) {
+        if (Math.abs(scroller.scrollLeft - marqueePosRef.current) > 1.5) {
+          marqueePosRef.current = scroller.scrollLeft;
+        }
+        const speed = Math.max(Math.abs(glide) * 6, 240);
+        const step = Math.sign(glide) * Math.min(Math.abs(glide), speed * dt);
+        glideRemainingRef.current = Math.abs(glide - step) < 0.5 ? 0 : glide - step;
+        marqueePosRef.current = wrap(marqueePosRef.current + step);
+        scroller.scrollLeft = marqueePosRef.current;
+      } else if (!paused) {
+        if (Math.abs(scroller.scrollLeft - marqueePosRef.current) > 1.5) {
+          marqueePosRef.current = scroller.scrollLeft;
+        }
+        marqueePosRef.current = wrap(marqueePosRef.current + autoScrollSpeed * dt);
+        scroller.scrollLeft = marqueePosRef.current;
+      } else {
+        marqueePosRef.current = scroller.scrollLeft;
       }
       raf = requestAnimationFrame(tick);
     };
@@ -10099,23 +10218,105 @@ function VideoBitesStrip({
     return () => cancelAnimationFrame(raf);
   }, [marqueeActive, autoScrollSpeed, pauseOnHover]);
   const [activeKey, setActiveKey] = useState22(null);
-  const activate = useCallback13((key) => setActiveKey(key), []);
-  const deactivate = useCallback13((key) => {
-    setActiveKey((current) => current === key ? null : current);
+  const activeKeyRef = useRef15(null);
+  const activate = useCallback14((key) => {
+    activeKeyRef.current = key;
+    setActiveKey(key);
+  }, []);
+  const deactivate = useCallback14((key) => {
+    setActiveKey((current) => {
+      const next = current === key ? null : current;
+      activeKeyRef.current = next;
+      return next;
+    });
   }, []);
   const warmup = useVideoWarmup({ videoUrl: items[0]?.url || null });
-  const scrollByCard = useCallback13((dir) => {
+  const [mountedIdx, setMountedIdx] = useState22(() => /* @__PURE__ */ new Set());
+  const cardObserverRef = useRef15(null);
+  const cardElIdxRef = useRef15(/* @__PURE__ */ new Map());
+  const cardElNearRef = useRef15(/* @__PURE__ */ new Map());
+  useEffect18(() => {
+    if (typeof IntersectionObserver === "undefined") return;
+    const io = new IntersectionObserver((entries) => {
+      for (const e of entries) cardElNearRef.current.set(e.target, e.isIntersecting);
+      const next = /* @__PURE__ */ new Set();
+      cardElNearRef.current.forEach((near, el) => {
+        if (!near) return;
+        const idx = cardElIdxRef.current.get(el);
+        if (idx !== void 0) next.add(idx);
+      });
+      setMountedIdx((prev) => {
+        if (prev.size === next.size) {
+          let same = true;
+          next.forEach((i) => {
+            if (!prev.has(i)) same = false;
+          });
+          if (same) return prev;
+        }
+        return next;
+      });
+    }, { rootMargin: "500px" });
+    cardObserverRef.current = io;
+    cardElIdxRef.current.forEach((_idx, el) => io.observe(el));
+    return () => {
+      io.disconnect();
+      cardObserverRef.current = null;
+    };
+  }, []);
+  const cardRefFnsRef = useRef15(/* @__PURE__ */ new Map());
+  const getCardRef = useCallback14((idx) => {
+    let fn = cardRefFnsRef.current.get(idx);
+    if (!fn) {
+      fn = (el) => {
+        if (!el) return void 0;
+        cardElIdxRef.current.set(el, idx);
+        cardObserverRef.current?.observe(el);
+        return () => {
+          cardElIdxRef.current.delete(el);
+          cardElNearRef.current.delete(el);
+          cardObserverRef.current?.unobserve(el);
+        };
+      };
+      cardRefFnsRef.current.set(idx, fn);
+    }
+    return fn;
+  }, []);
+  const scrollByCard = useCallback14((dir) => {
     const scroller = scrollerRef.current;
     const track = trackRef.current;
     if (!scroller || !track) return;
     const firstCard = track.firstElementChild;
     const step = (firstCard?.offsetWidth ?? 320) + TRACK_GAP_PX;
     chevronSuppressUntilRef.current = performance.now() + CHEVRON_SUPPRESS_MS;
-    scroller.scrollBy({ left: dir * step, behavior: "smooth" });
+    if (marqueeActiveRef.current) {
+      glideRemainingRef.current += dir * step;
+    } else {
+      scroller.scrollBy({ left: dir * step, behavior: "smooth" });
+    }
   }, []);
-  const onUserScrollIntent = useCallback13(() => {
+  const onUserScrollIntent = useCallback14(() => {
     userScrollSuppressUntilRef.current = performance.now() + USER_SCROLL_SUPPRESS_MS;
   }, []);
+  const lastScrollLeftRef = useRef15(0);
+  const marqueeActiveRef = useRef15(false);
+  marqueeActiveRef.current = marqueeActive;
+  const onSeamWarp = useCallback14(() => {
+    const scroller = scrollerRef.current;
+    if (!scroller || !marqueeActiveRef.current) return;
+    const half = singleCopyWidthRef.current;
+    if (half <= 0) return;
+    let sl = scroller.scrollLeft;
+    if (sl >= half) {
+      sl -= half;
+      scroller.scrollLeft = sl;
+      marqueePosRef.current = sl;
+    } else if (sl <= 0 && lastScrollLeftRef.current > 0.5) {
+      sl += half;
+      scroller.scrollLeft = sl;
+      marqueePosRef.current = sl;
+    }
+    lastScrollLeftRef.current = sl;
+  }, []);
   if (items.length === 0) return null;
   const cardHeight = isMobile ? cardHeightMobile : cardHeightDesktop;
   const copies = marqueeActive ? 2 : 1;
@@ -10127,12 +10328,6 @@ function VideoBitesStrip({
         warmup.ref(node);
       },
       className: cn("flex flex-col gap-6 w-full min-w-0", className),
-      onPointerEnter: () => {
-        hoveredRef.current = true;
-      },
-      onPointerLeave: () => {
-        hoveredRef.current = false;
-      },
       children: [
         showTitle && /* @__PURE__ */ jsx72("h2", { className: `${SECTION_HEADING_CLASS} break-words`, children: title }),
         headerSlot,
@@ -10145,6 +10340,7 @@ function VideoBitesStrip({
               onWheel: onUserScrollIntent,
               onTouchStart: onUserScrollIntent,
               onPointerDown: onUserScrollIntent,
+              onScroll: onSeamWarp,
               children: /* @__PURE__ */ jsx72("div", { ref: trackRef, "data-copies": copies, className: "flex w-max items-stretch gap-4", children: Array.from(
                 { length: copies },
                 (_, copyIndex) => items.map((bite, i) => {
@@ -10155,7 +10351,7 @@ function VideoBitesStrip({
                     // same rule as quick-action-marquee). Clones stay pointer-
                     // interactive (briefly visible near the wrap seam).
                     /* @__PURE__ */ jsx72(
-                      BiteStripCard,
+                      VideoBiteCard,
                       {
                         bite,
                         index: i,
@@ -10166,6 +10362,8 @@ function VideoBitesStrip({
                         active: activeKey === key,
                         onActivate: activate,
                         onDeactivate: deactivate,
+                        playerMounted: mountedIdx.has(i),
+                        rootRef: getCardRef(i),
                         profile: bite.profile ?? profile ?? null,
                         sectionHref: href,
                         onBiteNavigate
@@ -10204,27 +10402,42 @@ function VideoBitesStrip({
     }
   );
 }
-function BiteStripCard({
+function VideoBiteCard({
   bite,
   index,
-  cardKey,
-  isClone,
-  isTouch,
+  profile = null,
+  sectionHref,
+  onBiteNavigate,
   height,
   active,
   onActivate,
   onDeactivate,
-  profile,
-  sectionHref,
-  onBiteNavigate
+  cardKey,
+  isClone = false,
+  isTouch = false,
+  playerMounted,
+  rootRef,
+  toolbar,
+  titleEditable = false,
+  onTitleChange,
+  onTitleCommit,
+  className
 }) {
   const cssAspect = RATIO_TO_CSS_ASPECT[ratioToCategory(detectAspectRatio(bite.aspect_ratio))];
   const targetHref = bite.href ?? sectionHref;
   const hasTarget = !!(targetHref || bite.onNavigate || onBiteNavigate);
-  const nearRef = useRef15(null);
+  const key = cardKey ?? `${bite.url}__${index}`;
+  const controlled = active !== void 0;
+  const [selfActive, setSelfActive] = useState22(false);
+  const isActive = controlled ? !!active : selfActive;
+  const activate = () => controlled ? onActivate?.(key) : setSelfActive(true);
+  const deactivate = () => controlled ? onDeactivate?.(key) : setSelfActive(false);
+  const gateControlled = playerMounted !== void 0;
+  const rootElRef = useRef15(null);
   const [isNear, setIsNear] = useState22(false);
   useEffect18(() => {
-    const el = nearRef.current;
+    if (gateControlled) return;
+    const el = rootElRef.current;
     if (!el || typeof IntersectionObserver === "undefined") return;
     const io = new IntersectionObserver(
       (entries) => setIsNear(entries[0]?.isIntersecting ?? false),
@@ -10232,22 +10445,56 @@ function BiteStripCard({
     );
     io.observe(el);
     return () => io.disconnect();
-  }, []);
+  }, [gateControlled]);
+  const showPlayer = gateControlled ? playerMounted : isNear;
   const navigate = () => {
     if (bite.onNavigate) bite.onNavigate();
     else onBiteNavigate?.(bite, index);
   };
   const handlePointerEnter = () => {
-    if (!isTouch) onActivate(cardKey);
+    if (!isTouch) activate();
   };
   const handlePointerLeave = () => {
-    if (!isTouch) onDeactivate(cardKey);
+    if (!isTouch) deactivate();
   };
   const handleClick = () => {
-    if (isTouch && !active) onActivate(cardKey);
+    if (isTouch && !isActive) activate();
   };
+  const titleClass = "font-['DM_Sans'] text-sm font-medium leading-5 text-ods-text-primary";
   const overlayContent = /* @__PURE__ */ jsxs56(Fragment18, { children: [
-    bite.title && /* @__PURE__ */ jsx72("p", { className: "font-['DM_Sans'] text-sm font-medium leading-5 text-ods-text-primary line-clamp-1", children: bite.title }),
+    titleEditable ? (
+      // Textarea, not input: the public title wraps to two lines
+      // (line-clamp-2) and the editor must render identically. rows=1 +
+      // auto-grow keeps short titles single-line; max-height caps at the
+      // same two lines the clamp allows.
+      /* @__PURE__ */ jsx72(
+        "textarea",
+        {
+          value: bite.title || "",
+          placeholder: "Title (optional)",
+          "aria-label": "Bite title",
+          rows: 1,
+          onChange: (e) => {
+            e.target.style.height = "auto";
+            e.target.style.height = `${Math.min(e.target.scrollHeight, 40)}px`;
+            onTitleChange?.(e.target.value);
+          },
+          ref: (el) => {
+            if (el) {
+              el.style.height = "auto";
+              el.style.height = `${Math.min(el.scrollHeight, 40)}px`;
+            }
+          },
+          onBlur: (e) => onTitleCommit?.(e.target.value),
+          onClick: (e) => e.stopPropagation(),
+          className: cn(
+            titleClass,
+            "w-full max-h-10 resize-none overflow-hidden bg-transparent outline-none",
+            "placeholder:text-ods-text-secondary border-b border-transparent focus:border-ods-border"
+          )
+        }
+      )
+    ) : bite.title && /* @__PURE__ */ jsx72("p", { className: cn(titleClass, "line-clamp-2"), children: bite.title }),
     (profile || hasTarget) && /* @__PURE__ */ jsxs56("div", { className: "flex items-center gap-2 min-w-0", children: [
       profile && /* @__PURE__ */ jsx72(
         UserDisplay,
@@ -10255,7 +10502,7 @@ function BiteStripCard({
           name: profile.name,
           avatarUrl: profile.avatarUrl,
           subtitle: profile.subtitle,
-          size: 28,
+          size: 22,
           shape: "round",
           compact: true,
           className: "flex-1"
@@ -10267,39 +10514,67 @@ function BiteStripCard({
   const overlayClass = cn(
     "absolute inset-x-0 bottom-0 p-3 gap-2 bg-black/75 border border-ods-border shadow-2xl",
     "flex flex-col transition-opacity duration-200",
-    active ? "opacity-100" : "opacity-0 group-hover/card:opacity-100 group-focus-within/card:opacity-100",
+    isActive ? "opacity-100" : "opacity-0 group-hover/card:opacity-100 group-focus-within/card:opacity-100",
     // Non-interactive while invisible so it never swallows clicks on the
     // resting card / player controls.
-    active ? "pointer-events-auto" : "pointer-events-none group-hover/card:pointer-events-auto"
+    isActive ? "pointer-events-auto" : "pointer-events-none group-hover/card:pointer-events-auto group-focus-within/card:pointer-events-auto"
+  );
+  const media = /* @__PURE__ */ jsxs56(
+    "div",
+    {
+      className: "relative w-full",
+      style: { aspectRatio: cssAspect, ...height !== void 0 ? { height, maxWidth: "90vw" } : {} },
+      children: [
+        showPlayer ? (
+          // Clones: `inert` (not just the wrapper's aria-hidden) — the player's
+          // shadow-DOM center control is otherwise still tab-reachable inside a
+          // hidden subtree (axe aria-hidden-focus). Hover preview on clones
+          // keeps working: playback is driven imperatively from the CARD's own
+          // pointer handlers, never from focus/clicks on the player chrome.
+          /* @__PURE__ */ jsx72("div", { className: "absolute inset-0", inert: isClone || void 0, children: /* @__PURE__ */ jsx72(
+            Video2,
+            {
+              kind: "file",
+              url: bite.url,
+              poster: bite.thumbnail_url,
+              playWhenHovered: isActive,
+              centerControlsOnly: true,
+              layout: "fill"
+            }
+          ) })
+        ) : (
+          // Aspect-matched placeholder until the card nears the viewport (CLS-free).
+          /* @__PURE__ */ jsx72("div", { className: "absolute inset-0 bg-ods-card" })
+        ),
+        hasTarget && !isClone && !titleEditable ? targetHref ? /* @__PURE__ */ jsx72("a", { href: targetHref, "aria-label": `Open ${bite.title || "source content"}`, className: overlayClass, children: overlayContent }) : /* @__PURE__ */ jsx72("button", { type: "button", onClick: navigate, "aria-label": `Open ${bite.title || "source content"}`, className: cn(overlayClass, "text-left w-full"), children: overlayContent }) : /* @__PURE__ */ jsx72("div", { className: overlayClass, children: overlayContent })
+      ]
+    }
   );
   return /* @__PURE__ */ jsxs56(
     "div",
     {
-      ref: nearRef,
+      ref: (node) => {
+        rootElRef.current = node;
+        return rootRef?.(node);
+      },
       "aria-hidden": isClone || void 0,
-      className: "relative shrink-0 rounded-md border border-ods-border bg-ods-card overflow-hidden group/card",
-      style: { height, aspectRatio: cssAspect, maxWidth: "90vw" },
+      className: cn(
+        "relative rounded-md border border-ods-border bg-ods-card overflow-hidden group/card",
+        height !== void 0 ? "shrink-0" : "w-full",
+        className
+      ),
+      style: height !== void 0 ? { maxWidth: "90vw" } : void 0,
       onPointerEnter: handlePointerEnter,
       onPointerLeave: handlePointerLeave,
       onClick: handleClick,
-      onFocus: () => onActivate(cardKey),
-      onBlur: () => onDeactivate(cardKey),
+      onFocus: activate,
+      onBlur: deactivate,
       children: [
-        isNear ? /* @__PURE__ */ jsx72("div", { className: "absolute inset-0", children: /* @__PURE__ */ jsx72(
-          Video2,
-          {
-            kind: "file",
-            url: bite.url,
-            poster: bite.thumbnail_url,
-            playOnHover: true,
-            centerControlsOnly: true,
-            layout: "fill"
-          }
-        ) }) : (
-          // Aspect-matched placeholder until the card nears the viewport (CLS-free).
-          /* @__PURE__ */ jsx72("div", { className: "absolute inset-0 bg-ods-card" })
-        ),
-        hasTarget && !isClone ? targetHref ? /* @__PURE__ */ jsx72("a", { href: targetHref, "aria-label": `Open ${bite.title || "source content"}`, className: overlayClass, children: overlayContent }) : /* @__PURE__ */ jsx72("button", { type: "button", onClick: navigate, "aria-label": `Open ${bite.title || "source content"}`, className: cn(overlayClass, "text-left w-full"), children: overlayContent }) : /* @__PURE__ */ jsx72("div", { className: overlayClass, children: overlayContent })
+        media,
+        toolbar && // Solid-surface action row UNDER the media (WCAG non-text contrast —
+        // see the `toolbar` prop doc). Part of the card, so hovering it keeps
+        // hover playback alive.
+        /* @__PURE__ */ jsx72("div", { className: "flex items-center justify-between gap-1 border-t border-ods-border bg-ods-card px-2 py-1.5", children: toolbar })
       ]
     }
   );
@@ -17010,7 +17285,7 @@ function TabContent({
 // src/components/ui/tab-navigation.tsx
 init_next_navigation();
 init_cn();
-import { useState as useState36, useEffect as useEffect28, useMemo as useMemo19, useRef as useRef22, useCallback as useCallback18 } from "react";
+import { useState as useState36, useEffect as useEffect28, useMemo as useMemo19, useRef as useRef22, useCallback as useCallback19 } from "react";
 import { Fragment as Fragment26, jsx as jsx125, jsxs as jsxs99 } from "react/jsx-runtime";
 function TabNavigation({
   activeTab: controlledActiveTab,
@@ -17067,7 +17342,7 @@ function TabNavigation({
   const isFirstActiveScrollRef = useRef22(true);
   const [canScrollLeft, setCanScrollLeft] = useState36(false);
   const [canScrollRight, setCanScrollRight] = useState36(false);
-  const updateScrollShadows = useCallback18(() => {
+  const updateScrollShadows = useCallback19(() => {
     const el = scrollRef.current;
     if (!el) return;
     setCanScrollLeft(el.scrollLeft > 0);
@@ -17319,7 +17594,7 @@ import { useState as useState47 } from "react";
 import { ChevronDown as ChevronDown5 } from "lucide-react";
 
 // src/components/ui/rich-markdown-renderer.tsx
-import { useEffect as useEffect36, useState as useState46, useRef as useRef28, useMemo as useMemo22, useCallback as useCallback21 } from "react";
+import { useEffect as useEffect36, useState as useState46, useRef as useRef28, useMemo as useMemo22, useCallback as useCallback22 } from "react";
 import ReactMarkdown2 from "react-markdown";
 import remarkGfm2 from "remark-gfm";
 import remarkBreaks2 from "remark-breaks";
@@ -17609,7 +17884,7 @@ var socialCache = SocialEmbedCache.getInstance();
 
 // src/components/media-carousel.tsx
 init_cn();
-import { useState as useState38, useRef as useRef24, useEffect as useEffect30, memo as memo4, useCallback as useCallback19 } from "react";
+import { useState as useState38, useRef as useRef24, useEffect as useEffect30, memo as memo4, useCallback as useCallback20 } from "react";
 import { Fragment as Fragment28, jsx as jsx130, jsxs as jsxs102 } from "react/jsx-runtime";
 var ChevronLeftIcon = () => /* @__PURE__ */ jsx130("svg", { width: "24", height: "24", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx130("polyline", { points: "15,18 9,12 15,6" }) });
 var ChevronRightIcon = () => /* @__PURE__ */ jsx130("svg", { width: "24", height: "24", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx130("polyline", { points: "9,18 15,12 9,6" }) });
@@ -17638,17 +17913,17 @@ var MediaCarousel = memo4(function MediaCarousel2({
   if (!currentItem) {
     return null;
   }
-  const nextSlide = useCallback19(() => {
+  const nextSlide = useCallback20(() => {
     setCurrentIndex((prev) => (prev + 1) % media.length);
   }, [media.length]);
-  const prevSlide = useCallback19(() => {
+  const prevSlide = useCallback20(() => {
     setCurrentIndex((prev) => (prev - 1 + media.length) % media.length);
   }, [media.length]);
-  const selectSlide = useCallback19((index) => {
+  const selectSlide = useCallback20((index) => {
     if (index === currentIndex) return;
     setCurrentIndex(index);
   }, [currentIndex]);
-  const handleKeyDown = useCallback19((e) => {
+  const handleKeyDown = useCallback20((e) => {
     if (media.length <= 1) return;
     if (e.key === "ArrowLeft") {
       e.preventDefault();
@@ -18900,7 +19175,7 @@ function toFigmaOriginalUrl(url) {
 }
 
 // src/components/embeds/embed-iframe.tsx
-import { useState as useState43, useCallback as useCallback20, useRef as useRef27, useEffect as useEffect34 } from "react";
+import { useState as useState43, useCallback as useCallback21, useRef as useRef27, useEffect as useEffect34 } from "react";
 import { Fragment as Fragment29, jsx as jsx137, jsxs as jsxs107 } from "react/jsx-runtime";
 function EmbedLoadingSkeleton({ height }) {
   return /* @__PURE__ */ jsx137(
@@ -18923,7 +19198,7 @@ function EmbedIframe({
 }) {
   const [isLoaded, setIsLoaded] = useState43(false);
   const iframeRef = useRef27(null);
-  const handleLoad = useCallback20(() => setIsLoaded(true), []);
+  const handleLoad = useCallback21(() => setIsLoaded(true), []);
   useEffect34(() => {
     setIsLoaded(false);
   }, [src]);
@@ -19558,7 +19833,7 @@ var RichMarkdownInner = ({
     return map;
   }, [sectionIds]);
   const isDarkMode = true;
-  const generateHeadingId = useCallback21((text, level) => {
+  const generateHeadingId = useCallback22((text, level) => {
     if (sectionIds && (level === 1 || level === 2)) {
       const variations = [
         text,
@@ -20136,7 +20411,7 @@ function StatusIndicator({ status, label, href }) {
 }
 
 // src/components/ui/hover-dropdown.tsx
-import { useState as useState48, useRef as useRef29, useCallback as useCallback22 } from "react";
+import { useState as useState48, useRef as useRef29, useCallback as useCallback23 } from "react";
 import { Fragment as Fragment31, jsx as jsx145, jsxs as jsxs114 } from "react/jsx-runtime";
 function DefaultAnchor({
   href,
@@ -20156,15 +20431,15 @@ function HoverDropdown({
   const [open, setOpen] = useState48(false);
   const timeoutRef = useRef29(void 0);
   const containerRef = useRef29(null);
-  const show = useCallback22(() => {
+  const show = useCallback23(() => {
     clearTimeout(timeoutRef.current);
     setOpen(true);
   }, []);
-  const hide = useCallback22(() => {
+  const hide = useCallback23(() => {
     timeoutRef.current = setTimeout(() => setOpen(false), hideDelay);
   }, [hideDelay]);
   if (items.length === 0) return /* @__PURE__ */ jsx145(Fragment31, { children });
-  const toggle = useCallback22((e) => {
+  const toggle = useCallback23((e) => {
     e.stopPropagation();
     clearTimeout(timeoutRef.current);
     setOpen((prev) => !prev);
@@ -26174,7 +26449,7 @@ var ErrorBoundary = class extends Component3 {
 
 // src/components/features/figma-prototype-viewer.tsx
 init_cn();
-import { useState as useState59, useRef as useRef32, useEffect as useEffect44, useCallback as useCallback24, useMemo as useMemo25 } from "react";
+import { useState as useState59, useRef as useRef32, useEffect as useEffect44, useCallback as useCallback25, useMemo as useMemo25 } from "react";
 
 // src/components/features/section-selector.tsx
 init_cn();
@@ -26682,7 +26957,7 @@ var FigmaPrototypeViewer = ({
     window.addEventListener("message", handleMessage);
     return () => window.removeEventListener("message", handleMessage);
   }, [config.sections, activeSection, isNavigating, externalActiveSection, config.onSectionChange, viewMode]);
-  const navigateToSection = useCallback24((sectionId) => {
+  const navigateToSection = useCallback25((sectionId) => {
     const section = config.sections.find((s) => s.id === sectionId);
     if (!section || !iframeRef.current?.contentWindow || !isInitialized) {
       return;
@@ -26706,7 +26981,7 @@ var FigmaPrototypeViewer = ({
     if (navTimerRef.current) clearTimeout(navTimerRef.current);
     navTimerRef.current = setTimeout(() => setIsNavigating(false), 500);
   }, [config, isInitialized, viewMode, externalActiveSection]);
-  const handleSectionClick = useCallback24((sectionId) => {
+  const handleSectionClick = useCallback25((sectionId) => {
     const sectionsDisabled = iframeState !== "READY" || isNavigating;
     if (sectionId === activeSection || sectionsDisabled) {
       return;
@@ -26717,7 +26992,7 @@ var FigmaPrototypeViewer = ({
       navigateToSection(sectionId);
     }
   }, [activeSection, iframeState, isNavigating, externalOnSectionClick, navigateToSection]);
-  const handleTouchStart = useCallback24((e) => {
+  const handleTouchStart = useCallback25((e) => {
     const overlayElement = e.currentTarget;
     console.log("[Touch] Touch detected, allowing iframe interaction");
     overlayElement.style.pointerEvents = "none";
@@ -27281,7 +27556,7 @@ function useLoading() {
 }
 
 // src/components/features/media-gallery-manager.tsx
-import { useState as useState62, useRef as useRef34, useCallback as useCallback25 } from "react";
+import { useState as useState62, useRef as useRef34, useCallback as useCallback26 } from "react";
 import {
   Upload,
   Image as ImageIcon2,
@@ -27304,7 +27579,7 @@ function MediaGalleryManager({
   const fileInputRef = useRef34(null);
   const [deletingIndex, setDeletingIndex] = useState62(null);
   const [draggedIndex, setDraggedIndex] = useState62(null);
-  const handleFileSelect = useCallback25(async (event) => {
+  const handleFileSelect = useCallback26(async (event) => {
     const file = event.target.files?.[0];
     if (!file) return;
     let mediaType;
@@ -27330,18 +27605,18 @@ function MediaGalleryManager({
       console.error("Upload failed:", error);
     }
   }, [media, onChange, onUpload]);
-  const handleDeleteMedia = useCallback25((index) => {
+  const handleDeleteMedia = useCallback26((index) => {
     setDeletingIndex(index);
     onChange(media.filter((_, i) => i !== index));
     setDeletingIndex(null);
   }, [media, onChange]);
-  const handleDragStart = useCallback25((index) => {
+  const handleDragStart = useCallback26((index) => {
     setDraggedIndex(index);
   }, []);
-  const handleDragOver = useCallback25((e) => {
+  const handleDragOver = useCallback26((e) => {
     e.preventDefault();
   }, []);
-  const handleDrop = useCallback25((e, targetIndex) => {
+  const handleDrop = useCallback26((e, targetIndex) => {
     e.preventDefault();
     if (draggedIndex === null || draggedIndex === targetIndex) {
       setDraggedIndex(null);
@@ -27353,7 +27628,7 @@ function MediaGalleryManager({
     onChange(newMedia.map((item, i) => ({ ...item, display_order: i })));
     setDraggedIndex(null);
   }, [media, draggedIndex, onChange]);
-  const renderMediaItem = useCallback25((mediaItem, index) => {
+  const renderMediaItem = useCallback26((mediaItem, index) => {
     const isDeleting = deletingIndex === index;
     return /* @__PURE__ */ jsxs164(
       Card,
@@ -29074,7 +29349,7 @@ function getCaptionsUrl(entityType, entityId, srtContent) {
 }
 
 // src/components/features/video-source-selector.tsx
-import { useState as useState67, useCallback as useCallback26, useEffect as useEffect48 } from "react";
+import { useState as useState67, useCallback as useCallback27, useEffect as useEffect48 } from "react";
 import { Upload as Upload4, X as X8, Video as Video7, Loader2 as Loader27 } from "lucide-react";
 init_button2();
 import { jsx as jsx227, jsxs as jsxs177 } from "react/jsx-runtime";
@@ -29105,7 +29380,7 @@ function VideoSourceSelector({
   const [uploadProgress, setUploadProgress] = useState67(0);
   const [uploadMessage, setUploadMessage] = useState67("");
   const [uploadError, setUploadError] = useState67(null);
-  const handleUploadClick = useCallback26(() => {
+  const handleUploadClick = useCallback27(() => {
     const input = document.createElement("input");
     input.type = "file";
     input.accept = "video/*";
@@ -29136,7 +29411,7 @@ function VideoSourceSelector({
     };
     input.click();
   }, [onUploadVideo, onMainVideoUrlChange]);
-  const handleDeleteVideo = useCallback26(() => {
+  const handleDeleteVideo = useCallback27(() => {
     onMainVideoUrlChange("");
   }, [onMainVideoUrlChange]);
   return /* @__PURE__ */ jsxs177("div", { className: `space-y-4 p-6 bg-ods-card border border-ods-border rounded-lg ${className}`, children: [
@@ -30944,7 +31219,7 @@ PolicyConfigurationPanel.displayName = "PolicyConfigurationPanel";
 init_button2();
 
 // src/components/ui/phone-input.tsx
-import { useCallback as useCallback27, useEffect as useEffect50, useMemo as useMemo26, useRef as useRef38, useState as useState70 } from "react";
+import { useCallback as useCallback28, useEffect as useEffect50, useMemo as useMemo26, useRef as useRef38, useState as useState70 } from "react";
 import { jsx as jsx247, jsxs as jsxs193 } from "react/jsx-runtime";
 function PhoneInput({
   value,
@@ -30963,8 +31238,8 @@ function PhoneInput({
   );
   const [isInvalid, setIsInvalid] = useState70(false);
   const debounceRef = useRef38(null);
-  const digitCount = useCallback27((val) => val.replace(/[^0-9]/g, "").length, []);
-  const runValidation = useCallback27((phone) => {
+  const digitCount = useCallback28((val) => val.replace(/[^0-9]/g, "").length, []);
+  const runValidation = useCallback28((phone) => {
     if (!phone || digitCount(phone) === 0) {
       setIsInvalid(false);
       onValidationChange?.(false);
@@ -30974,7 +31249,7 @@ function PhoneInput({
     setIsInvalid(invalid);
     onValidationChange?.(invalid);
   }, [countryCode, digitCount, onValidationChange]);
-  const debouncedValidation = useCallback27((phone) => {
+  const debouncedValidation = useCallback28((phone) => {
     if (debounceRef.current) clearTimeout(debounceRef.current);
     debounceRef.current = setTimeout(() => runValidation(phone), 300);
   }, [runValidation]);
@@ -33231,7 +33506,7 @@ function EmptyState2() {
 }
 
 // src/components/features/board/use-board-collapse.ts
-import { useCallback as useCallback31, useState as useState79 } from "react";
+import { useCallback as useCallback32, useState as useState79 } from "react";
 function useBoardCollapse(storageKey) {
   const [persisted, setPersisted] = useLocalStorage(
     storageKey ?? "__board_collapse_unused__",
@@ -33240,13 +33515,13 @@ function useBoardCollapse(storageKey) {
   const [memory, setMemory] = useState79({});
   const collapsed = storageKey ? persisted : memory;
   const setMap = storageKey ? setPersisted : setMemory;
-  const toggle = useCallback31(
+  const toggle = useCallback32(
     (columnId) => {
       setMap((prev) => ({ ...prev, [columnId]: !prev[columnId] }));
     },
     [setMap]
   );
-  const setCollapsed = useCallback31(
+  const setCollapsed = useCallback32(
     (columnId, value) => {
       setMap((prev) => ({ ...prev, [columnId]: value }));
     },
@@ -34250,7 +34525,7 @@ function SlidingSidebar({ config }) {
 }
 
 // src/components/navigation/sticky-section-nav.tsx
-import { useEffect as useEffect63, useState as useState84, useCallback as useCallback33, useRef as useRef45 } from "react";
+import { useEffect as useEffect63, useState as useState84, useCallback as useCallback34, useRef as useRef45 } from "react";
 import { jsx as jsx270, jsxs as jsxs210 } from "react/jsx-runtime";
 function StickySectionNav({
   sections,
@@ -34314,7 +34589,7 @@ function useSectionNavigation(sections, options) {
   const [activeSection, setActiveSection] = useState84(sections[0]?.id || "");
   const isScrollingFromClick = useRef45(false);
   const { offset: offset2 = 100 } = options || {};
-  const handleSectionClick = useCallback33((sectionId) => {
+  const handleSectionClick = useCallback34((sectionId) => {
     const targetElement = document.getElementById(sectionId);
     if (!targetElement) return;
     isScrollingFromClick.current = true;
@@ -34364,7 +34639,7 @@ function useSectionNavigation(sections, options) {
 }
 
 // src/components/navigation/navigation-sidebar.tsx
-import { useCallback as useCallback34, useEffect as useEffect64, useLayoutEffect as useLayoutEffect6, useMemo as useMemo33, useState as useState85 } from "react";
+import { useCallback as useCallback35, useEffect as useEffect64, useLayoutEffect as useLayoutEffect6, useMemo as useMemo33, useState as useState85 } from "react";
 
 // src/components/navigation/navigation-sidebar-header.tsx
 import { jsx as jsx271, jsxs as jsxs211 } from "react/jsx-runtime";
@@ -34520,7 +34795,7 @@ function NavigationSidebar({ config, disabled = false }) {
   const [transitionsEnabled, setTransitionsEnabled] = useState85(false);
   const isOverlayOpen = isTablet && !minimized;
   const showLabel = !minimized;
-  const handleToggle = useCallback34(() => {
+  const handleToggle = useCallback35(() => {
     if (isTablet) {
       setTabletMinimized((prev) => !prev);
     } else {
@@ -34528,7 +34803,7 @@ function NavigationSidebar({ config, disabled = false }) {
     }
     config.onToggleMinimized?.();
   }, [isTablet, setDesktopMinimized, config]);
-  const closeOverlay = useCallback34(() => {
+  const closeOverlay = useCallback35(() => {
     setTabletMinimized(true);
   }, []);
   useEffect64(() => {
@@ -34539,7 +34814,7 @@ function NavigationSidebar({ config, disabled = false }) {
     document.addEventListener("keydown", handleKeyDown);
     return () => document.removeEventListener("keydown", handleKeyDown);
   }, [isOverlayOpen, closeOverlay]);
-  const handleItemClick = useCallback34((item, event) => {
+  const handleItemClick = useCallback35((item, event) => {
     event?.stopPropagation();
     if (item.onClick) {
       item.onClick();
@@ -35012,10 +35287,10 @@ function NotificationsHeaderButton({
 }
 
 // src/components/navigation/app-layout.tsx
-import { createContext as createContext9, Suspense as Suspense2, useCallback as useCallback36, useContext as useContext9, useMemo as useMemo34, useRef as useRef46, useState as useState86 } from "react";
+import { createContext as createContext9, Suspense as Suspense2, useCallback as useCallback37, useContext as useContext9, useMemo as useMemo34, useRef as useRef46, useState as useState86 } from "react";
 
 // src/components/navigation/mobile-burger-menu.tsx
-import React111, { useCallback as useCallback35, useEffect as useEffect65 } from "react";
+import React111, { useCallback as useCallback36, useEffect as useEffect65 } from "react";
 import { Fragment as Fragment51, jsx as jsx279, jsxs as jsxs219 } from "react/jsx-runtime";
 var HEADER_HEIGHT = 48;
 var MobileBurgerMenu = React111.memo(function MobileBurgerMenu2({
@@ -35049,7 +35324,7 @@ var MobileBurgerMenu = React111.memo(function MobileBurgerMenu2({
       return () => document.removeEventListener("keydown", handleKeyDown);
     }
   }, [isOpen, onClose]);
-  const handleItemClick = useCallback35((item) => {
+  const handleItemClick = useCallback36((item) => {
     if (item.onClick) {
       item.onClick();
     } else if (item.path) {
@@ -35239,14 +35514,14 @@ function AppLayout({
   const mobileMenuOpenRef = useRef46(mobileMenuOpen);
   mobileMenuOpenRef.current = mobileMenuOpen;
   const drawerHandlesRef = useRef46(/* @__PURE__ */ new Set());
-  const handleToggleMobileMenu = useCallback36(() => {
+  const handleToggleMobileMenu = useCallback37(() => {
     const opening = !mobileMenuOpenRef.current;
     if (opening) {
       for (const handle of drawerHandlesRef.current) handle.close();
     }
     setMobileMenuOpen(opening);
   }, []);
-  const handleCloseMobileMenu = useCallback36(() => {
+  const handleCloseMobileMenu = useCallback37(() => {
     setMobileMenuOpen(false);
   }, []);
   const drawerCoordination = useMemo34(() => ({
@@ -36332,7 +36607,7 @@ ScriptArguments.displayName = "ScriptArguments";
 
 // src/components/shared/onboarding/onboarding-walkthrough.tsx
 init_button2();
-import React114, { useRef as useRef48, useCallback as useCallback38 } from "react";
+import React114, { useRef as useRef48, useCallback as useCallback39 } from "react";
 
 // src/components/shared/onboarding/onboarding-step-card.tsx
 import React113 from "react";
@@ -36485,7 +36760,7 @@ function OnboardingWalkthrough({
       lastCompletionStatusRef.current = statusKey;
     }
   }, [completionStatus, isLoadingCompletion, state.completedSteps, markMultipleComplete]);
-  const handleStepAction = useCallback38(async (step) => {
+  const handleStepAction = useCallback39(async (step) => {
     if (actionInProgressRef.current.has(step.id)) {
       console.log(`\u23F3 Action already in progress for "${step.id}", skipping`);
       return;
@@ -38128,7 +38403,7 @@ import { useMemo as useMemo36 } from "react";
 
 // src/components/ui/query-report-table/query-report-table-header.tsx
 init_cn();
-import { useRef as useRef51, useState as useState90, useCallback as useCallback39 } from "react";
+import { useRef as useRef51, useState as useState90, useCallback as useCallback40 } from "react";
 import { jsx as jsx311, jsxs as jsxs246 } from "react/jsx-runtime";
 function QueryReportTableHeader({
   columns,
@@ -38159,7 +38434,7 @@ function QueryReportTableHeader({
 function TruncatedHeaderCell({ value, width }) {
   const textRef = useRef51(null);
   const [isTruncated, setIsTruncated] = useState90(false);
-  const checkTruncation = useCallback39(() => {
+  const checkTruncation = useCallback40(() => {
     const el = textRef.current;
     if (el) {
       setIsTruncated(el.scrollWidth > el.clientWidth);
@@ -38187,7 +38462,7 @@ function TruncatedHeaderCell({ value, width }) {
 
 // src/components/ui/query-report-table/query-report-table-row.tsx
 init_cn();
-import { useRef as useRef52, useState as useState91, useCallback as useCallback40 } from "react";
+import { useRef as useRef52, useState as useState91, useCallback as useCallback41 } from "react";
 import { jsx as jsx312, jsxs as jsxs247 } from "react/jsx-runtime";
 function QueryReportTableRow({
   row,
@@ -38235,7 +38510,7 @@ function QueryReportTableRow({
 function TruncatedCell({ value, className }) {
   const textRef = useRef52(null);
   const [isTruncated, setIsTruncated] = useState91(false);
-  const checkTruncation = useCallback40(() => {
+  const checkTruncation = useCallback41(() => {
     const el = textRef.current;
     if (el) {
       setIsTruncated(el.scrollWidth > el.clientWidth);
@@ -38498,7 +38773,7 @@ init_cn();
 
 // src/components/ui/data-table/data-table-column-filter.tsx
 init_cn();
-import { useCallback as useCallback41, useMemo as useMemo37 } from "react";
+import { useCallback as useCallback42, useMemo as useMemo37 } from "react";
 
 // src/components/ui/data-table/utils.ts
 function getHideClasses2(hideAt) {
@@ -38558,14 +38833,14 @@ function DataTableColumnFilter({
     () => ({ [column.id]: currentValue ?? EMPTY_ARRAY }),
     [column.id, currentValue]
   );
-  const handleApply = useCallback41(
+  const handleApply = useCallback42(
     (applied) => {
       const next = applied[column.id] ?? [];
       column.setFilterValue(next.length > 0 ? next : void 0);
     },
     [column]
   );
-  const handleReset = useCallback41(() => {
+  const handleReset = useCallback42(() => {
     column.setFilterValue(void 0);
   }, [column]);
   return /* @__PURE__ */ jsx316(
@@ -38733,7 +39008,7 @@ function DataTableEmpty({ className, ...props }) {
 // src/components/ui/data-table/data-table-row.tsx
 init_next_link();
 init_cn();
-import { memo as memo5, useCallback as useCallback42, useRef as useRef53 } from "react";
+import { memo as memo5, useCallback as useCallback43, useRef as useRef53 } from "react";
 import { flexRender as flexRender2 } from "@tanstack/react-table";
 
 // src/components/ui/data-table/data-table-skeleton.tsx
@@ -38819,7 +39094,7 @@ function DataTableRowImpl({
   const isLinkMode = Boolean(href) && !onClick;
   const isWholeCardLink = isLinkMode && !hasSubRow;
   const containerRef = useRef53(null);
-  const handleClick = useCallback42(
+  const handleClick = useCallback43(
     (e) => {
       const target = e.target;
       if (!containerRef.current?.contains(target)) {
@@ -39827,7 +40102,7 @@ function TagSearchInput({
 }
 
 // src/components/ui/markdown-editor.tsx
-import { useRef as useRef57, useCallback as useCallback43, useState as useState94, useEffect as useEffect72 } from "react";
+import { useRef as useRef57, useCallback as useCallback44, useState as useState94, useEffect as useEffect72 } from "react";
 init_cn();
 import { Loader2 as Loader29, Upload as Upload8 } from "lucide-react";
 import { jsx as jsx327, jsxs as jsxs260 } from "react/jsx-runtime";
@@ -39896,7 +40171,7 @@ function MarkdownEditor({
   const handleChange = (val) => {
     onChange(val || "");
   };
-  const insertTextAtCursor = useCallback43(
+  const insertTextAtCursor = useCallback44(
     (text) => {
       const textarea = document.querySelector(
         ".w-md-editor-text-textarea"
@@ -39912,7 +40187,7 @@ function MarkdownEditor({
     },
     [value, onChange]
   );
-  const handleFileUpload = useCallback43(
+  const handleFileUpload = useCallback44(
     async (file) => {
       if (!onUploadFile) return;
       setIsUploading(true);
@@ -39933,7 +40208,7 @@ function MarkdownEditor({
     },
     [onUploadFile, insertTextAtCursor, onFileUploaded]
   );
-  const handleFileInputChange = useCallback43(
+  const handleFileInputChange = useCallback44(
     (e) => {
       const file = e.target.files?.[0];
       if (file) {
@@ -39943,7 +40218,7 @@ function MarkdownEditor({
     },
     [handleFileUpload]
   );
-  const handlePaste = useCallback43(
+  const handlePaste = useCallback44(
     (e) => {
       if (!onUploadFile) return;
       const items = e.clipboardData?.items;
@@ -39982,7 +40257,7 @@ function MarkdownEditor({
   const scrollParentRef = useRef57(window);
   const EDGE_ZONE = 60;
   const MAX_SCROLL_SPEED = 15;
-  const findScrollParent = useCallback43((el) => {
+  const findScrollParent = useCallback44((el) => {
     let node = el?.parentElement;
     while (node && node !== document.documentElement) {
       const { overflowY } = window.getComputedStyle(node);
@@ -39993,7 +40268,7 @@ function MarkdownEditor({
     }
     return window;
   }, []);
-  const scrollLoop = useCallback43(() => {
+  const scrollLoop = useCallback44(() => {
     if (!isDraggingRef.current) return;
     const parent = scrollParentRef.current;
     const isWindow = parent === window;
@@ -45557,7 +45832,7 @@ function renderChatInlineEntityCard(chatRef, options = {}) {
 }
 
 // src/components/chat/hooks/use-chunk-catchup.ts
-import { useCallback as useCallback45, useRef as useRef61 } from "react";
+import { useCallback as useCallback46, useRef as useRef61 } from "react";
 function makeSeqKey(messageType, chunkType, sequenceId) {
   return `${messageType}:${chunkType}:${sequenceId}`;
 }
@@ -45594,7 +45869,7 @@ function useChunkCatchup({
   fetchChunksRef.current = fetchChunks;
   const onChunkReceivedRef = useRef61(onChunkReceived);
   onChunkReceivedRef.current = onChunkReceived;
-  const processChunk = useCallback45((chunk, messageType, forceProcess = false) => {
+  const processChunk = useCallback46((chunk, messageType, forceProcess = false) => {
     if (bufferUntilInitialCatchupComplete.current && !forceProcess) {
       chunkBuffer.current.push({ chunk, messageType });
       return true;
@@ -45607,7 +45882,7 @@ function useChunkCatchup({
     onChunkReceivedRef.current(chunk, messageType);
     return true;
   }, []);
-  const flushBufferedRealtimeChunks = useCallback45(() => {
+  const flushBufferedRealtimeChunks = useCallback46(() => {
     if (chunkBuffer.current.length === 0) return;
     const buffered = [...chunkBuffer.current];
     chunkBuffer.current = [];
@@ -45620,7 +45895,7 @@ function useChunkCatchup({
       processChunk(chunk, messageType, true);
     });
   }, [processChunk]);
-  const catchUpChunks = useCallback45(async (fromSequenceId) => {
+  const catchUpChunks = useCallback46(async (fromSequenceId) => {
     const dialogId2 = dialogIdRef.current;
     const chatTypes2 = chatTypesRef.current;
     const fetchChunks2 = fetchChunksRef.current;
@@ -45733,7 +46008,7 @@ function useChunkCatchup({
       }
     }
   }, [flushBufferedRealtimeChunks]);
-  const resetChunkTracking = useCallback45(() => {
+  const resetChunkTracking = useCallback46(() => {
     processedSequenceKeys.current.clear();
     lastSequenceId.current = null;
     fetchingInProgress.current = false;
@@ -45742,13 +46017,13 @@ function useChunkCatchup({
     bufferUntilInitialCatchupComplete.current = false;
     hasCompletedInitialCatchup.current = false;
   }, []);
-  const startInitialBuffering = useCallback45(() => {
+  const startInitialBuffering = useCallback46(() => {
     chunkBuffer.current = [];
     bufferUntilInitialCatchupComplete.current = true;
     hasCompletedInitialCatchup.current = false;
   }, []);
-  const isBufferingActive = useCallback45(() => bufferUntilInitialCatchupComplete.current, []);
-  const resetAndCatchUp = useCallback45(async () => {
+  const isBufferingActive = useCallback46(() => bufferUntilInitialCatchupComplete.current, []);
+  const resetAndCatchUp = useCallback46(async () => {
     if (!dialogIdRef.current) return;
     const fromSeq = lastSequenceId.current;
     hasCompletedInitialCatchup.current = false;
@@ -46284,7 +46559,7 @@ function buildNatsWsUrl(apiBaseUrl, options) {
 }
 
 // src/components/chat/hooks/use-realtime-chunk-processor.ts
-import { useCallback as useCallback46, useRef as useRef64, useEffect as useEffect78 } from "react";
+import { useCallback as useCallback47, useRef as useRef64, useEffect as useEffect78 } from "react";
 
 // src/components/chat/utils/chunk-parser.ts
 function normalizeToolCalls(raw) {
@@ -46963,7 +47238,7 @@ function useRealtimeChunkProcessor(options) {
     directModeFlagRef.current = isDirectMode;
   }, [isDirectMode]);
   const pendingEscalatedRef = useRef64(/* @__PURE__ */ new Map());
-  const processChunk = useCallback46(
+  const processChunk = useCallback47(
     (chunk) => {
       const action = parseChunkToAction(chunk);
       if (!action) return;
@@ -47192,22 +47467,22 @@ function useRealtimeChunkProcessor(options) {
     },
     [callbacks, displayApprovalTypes, approvalStatuses, initialState]
   );
-  const getSegments = useCallback46(() => {
+  const getSegments = useCallback47(() => {
     return accumulatorRef.current.getSegments();
   }, []);
-  const reset = useCallback46(() => {
+  const reset = useCallback47(() => {
     accumulatorRef.current.reset();
     pendingEscalatedRef.current.clear();
     hasInitializedWithData.current = false;
     sawDirectMessageRef.current = false;
   }, []);
-  const updateApprovalStatus = useCallback46(
+  const updateApprovalStatus = useCallback47(
     (requestId, status, resolvedByName) => {
       return accumulatorRef.current.updateApprovalStatus(requestId, status, resolvedByName);
     },
     []
   );
-  const getPendingApprovals = useCallback46(() => {
+  const getPendingApprovals = useCallback47(() => {
     return new Map(pendingEscalatedRef.current);
   }, []);
   return {
@@ -47345,7 +47620,7 @@ function useEmptyStateConfig(emptyStateUrl, options) {
 }
 
 // src/components/chat/hooks/use-chat-attachments.ts
-import { useCallback as useCallback47, useMemo as useMemo40, useRef as useRef65, useState as useState107 } from "react";
+import { useCallback as useCallback48, useMemo as useMemo40, useRef as useRef65, useState as useState107 } from "react";
 import { fileTypeFromBlob } from "file-type";
 var CHAT_ATTACHMENTS_BUCKET = "chat-attachments";
 var CHAT_ATTACHMENTS_FOLDER = "chat";
@@ -47423,10 +47698,10 @@ function useChatAttachments() {
   const uploadUrlEndpoint = runtime.endpoints.attachmentUploadUrl;
   const [attachments, setAttachments] = useState107([]);
   const controllersRef = useRef65(/* @__PURE__ */ new Map());
-  const updateOne = useCallback47((id, patch) => {
+  const updateOne = useCallback48((id, patch) => {
     setAttachments((prev) => prev.map((a) => a.id === id ? { ...a, ...patch } : a));
   }, []);
-  const removeAttachment = useCallback47((id) => {
+  const removeAttachment = useCallback48((id) => {
     const ctrl = controllersRef.current.get(id);
     if (ctrl) {
       ctrl.abort();
@@ -47434,12 +47709,12 @@ function useChatAttachments() {
     }
     setAttachments((prev) => prev.filter((a) => a.id !== id));
   }, []);
-  const clear = useCallback47(() => {
+  const clear = useCallback48(() => {
     for (const ctrl of controllersRef.current.values()) ctrl.abort();
     controllersRef.current.clear();
     setAttachments([]);
   }, []);
-  const uploadOne = useCallback47(
+  const uploadOne = useCallback48(
     async (att) => {
       const ctrl = controllersRef.current.get(att.id);
       try {
@@ -47513,7 +47788,7 @@ function useChatAttachments() {
   );
   const attachmentsRef = useRef65([]);
   attachmentsRef.current = attachments;
-  const addFiles = useCallback47(
+  const addFiles = useCallback48(
     (files) => {
       const arr = Array.from(files);
       if (arr.length === 0) return;
@@ -47588,7 +47863,7 @@ function useChatAttachments() {
 }
 
 // src/components/chat/hooks/use-chat-attachment-image-gallery.tsx
-import { useCallback as useCallback48, useEffect as useEffect80, useRef as useRef66, useState as useState108 } from "react";
+import { useCallback as useCallback49, useEffect as useEffect80, useRef as useRef66, useState as useState108 } from "react";
 import { jsx as jsx351 } from "react/jsx-runtime";
 var CLOSED = { isOpen: false, images: [], initialIndex: 0 };
 function useChatAttachmentImageGallery() {
@@ -47596,7 +47871,7 @@ function useChatAttachmentImageGallery() {
   const viewUrlPrefix = runtime.endpoints.attachmentViewUrlPrefix;
   const panelRef = useRef66(null);
   const [state, setState] = useState108(CLOSED);
-  const handleClose = useCallback48(() => setState(CLOSED), []);
+  const handleClose = useCallback49(() => setState(CLOSED), []);
   useEffect80(() => {
     const root = panelRef.current;
     if (!root) return;
@@ -47716,20 +47991,20 @@ function useCloseOnNavigation(close, pathname) {
 }
 
 // src/components/chat/hooks/use-chat.ts
-import { useState as useState111, useCallback as useCallback50, useEffect as useEffect83, useRef as useRef69 } from "react";
+import { useState as useState111, useCallback as useCallback51, useEffect as useEffect83, useRef as useRef69 } from "react";
 
 // src/components/chat/hooks/use-sse.ts
-import { useState as useState110, useCallback as useCallback49, useRef as useRef68 } from "react";
+import { useState as useState110, useCallback as useCallback50, useRef as useRef68 } from "react";
 function useSSE({ useMock = true, debugMode = false, streamFn } = {}) {
   const [isStreaming, setIsStreaming] = useState110(false);
   const [error, setError] = useState110(null);
   const abortControllerRef = useRef68(null);
-  const fallbackStream = useCallback49(async function* () {
+  const fallbackStream = useCallback50(async function* () {
     throw new Error(
       "[useSSE] No streamFn provided and `useMock: true` is no longer wired into the lib. Supply a `streamFn` (see `createDocStreamFn` in use-embedded-chat) or migrate the mock to your host code."
     );
   }, []);
-  const streamMessage = useCallback49(
+  const streamMessage = useCallback50(
     async function* (message2, extra) {
       setIsStreaming(true);
       setError(null);
@@ -47759,13 +48034,13 @@ function useSSE({ useMock = true, debugMode = false, streamFn } = {}) {
     },
     [streamFn, fallbackStream]
   );
-  const abort = useCallback49(() => {
+  const abort = useCallback50(() => {
     if (abortControllerRef.current) {
       abortControllerRef.current.abort();
     }
     setIsStreaming(false);
   }, []);
-  const reset = useCallback49(() => {
+  const reset = useCallback50(() => {
   }, []);
   return {
     streamMessage,
@@ -47808,10 +48083,10 @@ function useChat({
     debugMode,
     streamFn
   });
-  const addMessage = useCallback50((message2) => {
+  const addMessage = useCallback51((message2) => {
     setMessages((prev) => [...prev, message2]);
   }, []);
-  const updateLastAssistantMessage = useCallback50((segments) => {
+  const updateLastAssistantMessage = useCallback51((segments) => {
     setMessages((prev) => {
       const newMessages = [...prev];
       const lastMessage = newMessages[newMessages.length - 1];
@@ -47824,7 +48099,7 @@ function useChat({
       return newMessages;
     });
   }, []);
-  const sendMessage = useCallback50(
+  const sendMessage = useCallback51(
     async (text, extra, options) => {
       const userMessage = {
         id: `user-${Date.now()}`,
@@ -48054,18 +48329,18 @@ function useChat({
     },
     [streamMessage, addMessage, updateLastAssistantMessage, assistantName, assistantAvatar]
   );
-  const handleQuickAction = useCallback50(
+  const handleQuickAction = useCallback51(
     (actionText) => {
       sendMessage(actionText);
     },
     [sendMessage]
   );
-  const clearMessages = useCallback50(() => {
+  const clearMessages = useCallback51(() => {
     setMessages([]);
     setIsTyping(false);
     reset();
   }, [reset]);
-  const stopMessage = useCallback50(() => {
+  const stopMessage = useCallback51(() => {
     abort();
     setIsTyping(false);
   }, [abort]);
@@ -48083,7 +48358,7 @@ function useChat({
 }
 
 // src/components/chat/hooks/use-sse-chat-adapter.ts
-import { useState as useState112, useEffect as useEffect84, useCallback as useCallback51, useMemo as useMemo41, useRef as useRef70 } from "react";
+import { useState as useState112, useEffect as useEffect84, useCallback as useCallback52, useMemo as useMemo41, useRef as useRef70 } from "react";
 function createEmptyTurnMeta() {
   return {
     provider: null,
@@ -48420,7 +48695,7 @@ function useSseChatAdapter(options, runtimeOptions = {}) {
   const sendCountRef = useRef70(persistedRef.current.sendCount);
   const [streamingPhase, setStreamingPhase] = useState112("idle");
   const [metaTick, setMetaTick] = useState112(0);
-  const bumpMetaTick = useCallback51(() => setMetaTick((t) => t + 1), []);
+  const bumpMetaTick = useCallback52(() => setMetaTick((t) => t + 1), []);
   const streamFn = useMemo41(
     () => createDocStreamFn(
       source,
@@ -48467,7 +48742,7 @@ function useSseChatAdapter(options, runtimeOptions = {}) {
     }
     return map;
   }, [slashCommands]);
-  const persist = useCallback51(
+  const persist = useCallback52(
     (nextMessages) => {
       savePersistedChat(source, {
         messages: nextMessages,
@@ -48521,7 +48796,7 @@ function useSseChatAdapter(options, runtimeOptions = {}) {
       ...m.hidden ? { hidden: true } : {}
     };
   });
-  const sendMessage = useCallback51(
+  const sendMessage = useCallback52(
     async (text, options2) => {
       const {
         hidden,
@@ -48540,7 +48815,7 @@ function useSseChatAdapter(options, runtimeOptions = {}) {
     },
     [chatSendMessage]
   );
-  const displayRef = useCallback51(
+  const displayRef = useCallback52(
     (reference) => {
       const tableId = tableIdForDocumentType(reference.type);
       if (!tableId) {
@@ -48564,7 +48839,7 @@ function useSseChatAdapter(options, runtimeOptions = {}) {
     },
     [sendMessage, source, cmdIdByTableId, tableIdForDocumentType]
   );
-  const discussRef = useCallback51(
+  const discussRef = useCallback52(
     (reference) => {
       const tableId = tableIdForDocumentType(reference.type);
       if (!tableId) {
@@ -48588,11 +48863,11 @@ function useSseChatAdapter(options, runtimeOptions = {}) {
     },
     [sendMessage, tableIdForDocumentType]
   );
-  const stopMessage = useCallback51(() => {
+  const stopMessage = useCallback52(() => {
     chatStopMessage();
     setStreamingPhase("idle");
   }, [chatStopMessage]);
-  const clearMessages = useCallback51(() => {
+  const clearMessages = useCallback52(() => {
     sourcesMapRef.current.clear();
     refsMapRef.current.clear();
     metaMapRef.current.clear();
@@ -48688,7 +48963,7 @@ var noopRejectRequest = async (_id, _reason) => {
 
 // src/components/chat/hooks/use-nats-chat-adapter.ts
 import {
-  useCallback as useCallback52,
+  useCallback as useCallback53,
   useEffect as useEffect85,
   useMemo as useMemo42,
   useRef as useRef71,
@@ -49199,7 +49474,7 @@ function useNatsChatAdapter(config, options = {}) {
   );
   const [liveModel, setLiveModel] = useState113(null);
   const [connectionState, setConnectionState] = useState113("connecting");
-  const handleApprove = useCallback52(
+  const handleApprove = useCallback53(
     async (requestId) => {
       if (!approveRequestCallback) return;
       setApprovalStatuses((prev) => ({ ...prev, [requestId]: "approved" }));
@@ -49216,7 +49491,7 @@ function useNatsChatAdapter(config, options = {}) {
     },
     [approveRequestCallback]
   );
-  const handleReject = useCallback52(
+  const handleReject = useCallback53(
     async (requestId, reason) => {
       if (!rejectRequestCallback) return;
       setApprovalStatuses((prev) => ({ ...prev, [requestId]: "rejected" }));
@@ -49237,11 +49512,11 @@ function useNatsChatAdapter(config, options = {}) {
   handleApproveRef.current = handleApprove;
   const handleRejectRef = useRef71(handleReject);
   handleRejectRef.current = handleReject;
-  const accumApprove = useCallback52((requestId) => {
+  const accumApprove = useCallback53((requestId) => {
     if (!requestId) return;
     return handleApproveRef.current(requestId);
   }, []);
-  const accumReject = useCallback52((requestId) => {
+  const accumReject = useCallback53((requestId) => {
     if (!requestId) return;
     return handleRejectRef.current(requestId);
   }, []);
@@ -49284,7 +49559,7 @@ function useNatsChatAdapter(config, options = {}) {
     fetchChunks
   });
   const historyLoadSeqRef = useRef71(0);
-  const loadDialogHistory = useCallback52(
+  const loadDialogHistory = useCallback53(
     async (id, cursor) => {
       if (!fetchDialogMessages) return;
       historyLoadSeqRef.current += 1;
@@ -49383,7 +49658,7 @@ function useNatsChatAdapter(config, options = {}) {
     setConnectionState("connecting");
   }, [active, dialogId]);
   const initialDialogsLoadedRef = useRef71(false);
-  const loadDialogsPage = useCallback52(
+  const loadDialogsPage = useCallback53(
     async (cursor) => {
       if (!fetchDialogs) return;
       setIsDialogsLoading(true);
@@ -49411,7 +49686,7 @@ function useNatsChatAdapter(config, options = {}) {
     },
     [fetchDialogs, dialogsPageSize]
   );
-  const reloadDialogs = useCallback52(() => {
+  const reloadDialogs = useCallback53(() => {
     void loadDialogsPage();
   }, [loadDialogsPage]);
   useEffect85(() => {
@@ -49421,7 +49696,7 @@ function useNatsChatAdapter(config, options = {}) {
     initialDialogsLoadedRef.current = true;
     void loadDialogsPage();
   }, [active, fetchDialogs, loadDialogsPage]);
-  const sendMessage = useCallback52(
+  const sendMessage = useCallback53(
     async (text, sendOptions) => {
       const hidden = sendOptions?.hidden ?? false;
       setMessages((prev) => [
@@ -49444,7 +49719,7 @@ function useNatsChatAdapter(config, options = {}) {
     },
     [publishUserMessage, dialogId]
   );
-  const stopMessage = useCallback52(() => {
+  const stopMessage = useCallback53(() => {
     setStreamingPhase("idle");
     if (stopGenerationCallback && dialogId) {
       void stopGenerationCallback(dialogId).catch((err) => {
@@ -49452,12 +49727,12 @@ function useNatsChatAdapter(config, options = {}) {
       });
     }
   }, [stopGenerationCallback, dialogId]);
-  const clearMessages = useCallback52(() => {
+  const clearMessages = useCallback53(() => {
     setMessages([]);
     resetAccumulator();
     setStreamingPhase("idle");
   }, [resetAccumulator]);
-  const selectDialog = useCallback52(
+  const selectDialog = useCallback53(
     (id) => {
       if (!isManagedMode) {
         return;
@@ -49466,7 +49741,7 @@ function useNatsChatAdapter(config, options = {}) {
     },
     [isManagedMode]
   );
-  const startNewDialog = useCallback52(async () => {
+  const startNewDialog = useCallback53(async () => {
     if (!createDialogCallback) return null;
     if (isCreatingDialog) return null;
     try {
@@ -49491,7 +49766,7 @@ function useNatsChatAdapter(config, options = {}) {
       setIsCreatingDialog(false);
     }
   }, [createDialogCallback, isCreatingDialog, isManagedMode]);
-  const deleteDialog = useCallback52(
+  const deleteDialog = useCallback53(
     async (id) => {
       if (!deleteDialogCallback) return;
       try {
@@ -49506,7 +49781,7 @@ function useNatsChatAdapter(config, options = {}) {
     },
     [deleteDialogCallback, internalDialogId, isManagedMode]
   );
-  const renameDialog = useCallback52(
+  const renameDialog = useCallback53(
     async (id, title) => {
       if (!renameDialogCallback) return;
       let previous;
@@ -49530,7 +49805,7 @@ function useNatsChatAdapter(config, options = {}) {
     },
     [renameDialogCallback]
   );
-  const archiveDialog = useCallback52(
+  const archiveDialog = useCallback53(
     async (id) => {
       if (!archiveDialogCallback) return;
       try {
@@ -49545,29 +49820,29 @@ function useNatsChatAdapter(config, options = {}) {
     },
     [archiveDialogCallback, internalDialogId, isManagedMode]
   );
-  const loadMoreDialogs = useCallback52(async () => {
+  const loadMoreDialogs = useCallback53(async () => {
     if (!dialogsNextCursor) return;
     await loadDialogsPage(dialogsNextCursor);
   }, [dialogsNextCursor, loadDialogsPage]);
-  const loadMoreMessages = useCallback52(async () => {
+  const loadMoreMessages = useCallback53(async () => {
     if (!dialogId || !messagesNextCursor) return;
     await loadDialogHistory(dialogId, messagesNextCursor);
   }, [dialogId, messagesNextCursor, loadDialogHistory]);
-  const approveRequest = useCallback52(
+  const approveRequest = useCallback53(
     async (requestId) => {
       await handleApproveRef.current(requestId);
     },
     []
   );
-  const rejectRequest = useCallback52(
+  const rejectRequest = useCallback53(
     async (requestId, reason) => {
       await handleRejectRef.current(requestId, reason);
     },
     []
   );
-  const discussRef = useCallback52((_ref) => {
+  const discussRef = useCallback53((_ref) => {
   }, []);
-  const displayRef = useCallback52((_ref) => {
+  const displayRef = useCallback53((_ref) => {
   }, []);
   const isLoading = streamingPhase !== "idle";
   const hasMoreDialogs = dialogsNextCursor != null;
@@ -49655,7 +49930,7 @@ function useNatsChatAdapter(config, options = {}) {
 }
 
 // src/components/chat/hooks/use-unified-chat.ts
-import { useCallback as useCallback53, useMemo as useMemo43, useRef as useRef72 } from "react";
+import { useCallback as useCallback54, useMemo as useMemo43, useRef as useRef72 } from "react";
 var EMPTY_SSE_OPTIONS = {};
 function createDisabledNatsConfig() {
   return {
@@ -49686,60 +49961,60 @@ function useUnifiedChat(options) {
   const activeState = activeMode === "guide" ? sseState : mingoStateOverride ?? natsState;
   const activeStateRef = useRef72(activeState);
   activeStateRef.current = activeState;
-  const stopMessage = useCallback53(() => activeStateRef.current.stopMessage(), []);
-  const clearMessages = useCallback53(
+  const stopMessage = useCallback54(() => activeStateRef.current.stopMessage(), []);
+  const clearMessages = useCallback54(
     () => activeStateRef.current.clearMessages(),
     []
   );
-  const sendMessage = useCallback53(
+  const sendMessage = useCallback54(
     (text, opts) => activeStateRef.current.sendMessage(text, opts),
     []
   );
-  const discussRef = useCallback53(
+  const discussRef = useCallback54(
     (ref) => activeStateRef.current.discussRef(ref),
     []
   );
-  const displayRef = useCallback53(
+  const displayRef = useCallback54(
     (ref) => activeStateRef.current.displayRef(ref),
     []
   );
-  const selectDialog = useCallback53(
+  const selectDialog = useCallback54(
     (id) => activeStateRef.current.selectDialog(id),
     []
   );
-  const startNewDialog = useCallback53(
+  const startNewDialog = useCallback54(
     () => activeStateRef.current.startNewDialog(),
     []
   );
-  const deleteDialog = useCallback53(
+  const deleteDialog = useCallback54(
     (id) => activeStateRef.current.deleteDialog(id),
     []
   );
-  const renameDialog = useCallback53(
+  const renameDialog = useCallback54(
     (id, title) => activeStateRef.current.renameDialog(id, title),
     []
   );
-  const archiveDialog = useCallback53(
+  const archiveDialog = useCallback54(
     (id) => activeStateRef.current.archiveDialog(id),
     []
   );
-  const loadMoreDialogs = useCallback53(
+  const loadMoreDialogs = useCallback54(
     () => activeStateRef.current.loadMoreDialogs(),
     []
   );
-  const reloadDialogs = useCallback53(
+  const reloadDialogs = useCallback54(
     () => activeStateRef.current.reloadDialogs(),
     []
   );
-  const loadMoreMessages = useCallback53(
+  const loadMoreMessages = useCallback54(
     () => activeStateRef.current.loadMoreMessages(),
     []
   );
-  const approveRequest = useCallback53(
+  const approveRequest = useCallback54(
     (requestId) => activeStateRef.current.approveRequest(requestId),
     []
   );
-  const rejectRequest = useCallback53(
+  const rejectRequest = useCallback54(
     (requestId, reason) => activeStateRef.current.rejectRequest(requestId, reason),
     []
   );
@@ -49994,7 +50269,7 @@ function chatChipClass({ tone, density = "chip", extra }) {
 }
 
 // src/components/chat/embeddable-chat.tsx
-import { useCallback as useCallback55, useEffect as useEffect86, useMemo as useMemo45, useRef as useRef73, useState as useState115 } from "react";
+import { useCallback as useCallback56, useEffect as useEffect86, useMemo as useMemo45, useRef as useRef73, useState as useState115 } from "react";
 import * as DialogPrimitive4 from "@radix-ui/react-dialog";
 import { usePreventScroll } from "@react-aria/overlays";
 import { isIOS } from "@react-aria/utils";
@@ -50075,7 +50350,7 @@ init_button2();
 import { FileText as FileText8, MessageSquare as MessageSquare3 } from "lucide-react";
 
 // src/components/chat/hooks/use-chat-dialog-manager.ts
-import { useCallback as useCallback54, useMemo as useMemo44, useState as useState114 } from "react";
+import { useCallback as useCallback55, useMemo as useMemo44, useState as useState114 } from "react";
 function useChatDialogManager({
   dialogs,
   activeDialogId,
@@ -50088,14 +50363,14 @@ function useChatDialogManager({
 }) {
   const [renameTarget, setRenameTarget] = useState114(null);
   const [archiveTarget, setArchiveTarget] = useState114(null);
-  const handleConfirmRename = useCallback54(
+  const handleConfirmRename = useCallback55(
     (name) => {
       if (renameTarget) void renameDialog(renameTarget.id, name);
       setRenameTarget(null);
     },
     [renameTarget, renameDialog]
   );
-  const handleConfirmArchive = useCallback54(async () => {
+  const handleConfirmArchive = useCallback55(async () => {
     if (archiveTarget) {
       try {
         await archiveDialog(archiveTarget.id);
@@ -50114,7 +50389,7 @@ function useChatDialogManager({
   const [archivedDialogs, setArchivedDialogs] = useState114([]);
   const [archivedCursor, setArchivedCursor] = useState114(null);
   const [archivedLoading, setArchivedLoading] = useState114(false);
-  const loadArchivedPage = useCallback54(
+  const loadArchivedPage = useCallback55(
     async (cursor) => {
       if (!fetchArchivedDialogs) return;
       setArchivedLoading(true);
@@ -50132,18 +50407,18 @@ function useChatDialogManager({
     },
     [fetchArchivedDialogs]
   );
-  const openArchive = useCallback54(() => {
+  const openArchive = useCallback55(() => {
     setArchiveOpen(true);
     setArchivedDialogs([]);
     setArchivedCursor(null);
     void loadArchivedPage();
   }, [loadArchivedPage]);
-  const closeArchive = useCallback54(() => setArchiveOpen(false), []);
+  const closeArchive = useCallback55(() => setArchiveOpen(false), []);
   const [viewingArchivedId, setViewingArchivedId] = useState114(
     null
   );
   const [openingDialogId, setOpeningDialogId] = useState114(null);
-  const handleSelectDialog = useCallback54(
+  const handleSelectDialog = useCallback55(
     (id) => {
       setViewingArchivedId(null);
       setOpeningDialogId(id);
@@ -50152,7 +50427,7 @@ function useChatDialogManager({
     [selectDialog]
   );
   const isOpeningDialog = openingDialogId != null && openingDialogId === activeDialogId;
-  const handleArchivedSelect = useCallback54(
+  const handleArchivedSelect = useCallback55(
     (id) => {
       setArchiveOpen(false);
       setOpeningDialogId(null);
@@ -50162,7 +50437,7 @@ function useChatDialogManager({
     [selectDialog]
   );
   const [restoreTarget, setRestoreTarget] = useState114(null);
-  const handleConfirmRestore = useCallback54(async () => {
+  const handleConfirmRestore = useCallback55(async () => {
     if (restoreTarget) {
       try {
         await unarchiveDialog?.(restoreTarget.id);
@@ -50176,7 +50451,7 @@ function useChatDialogManager({
     setRestoreTarget(null);
   }, [restoreTarget, unarchiveDialog]);
   const isViewingArchived = viewingArchivedId != null && viewingArchivedId === activeDialogId;
-  const handleBack = useCallback54(() => {
+  const handleBack = useCallback55(() => {
     const wasArchived = isViewingArchived;
     setViewingArchivedId(null);
     setOpeningDialogId(null);
@@ -50612,7 +50887,7 @@ function EmbeddableChatInner({
   const initialActiveMode = controlledActiveMode ?? defaultActiveMode ?? (effectiveModes.guide ? "guide" : "mingo");
   const [uncontrolledActiveMode, setUncontrolledActiveMode] = useState115(initialActiveMode);
   const activeMode = controlledActiveMode ?? uncontrolledActiveMode;
-  const handleActiveModeChange = useCallback55(
+  const handleActiveModeChange = useCallback56(
     (next) => {
       if (controlledActiveMode === void 0) {
         setUncontrolledActiveMode(next);
@@ -50716,7 +50991,7 @@ function EmbeddableChatInner({
     for (const t of contextEntityTypes ?? []) byType.set(t.type, t.icon);
     return (item) => byType.get(item.type);
   }, [contextEntityTypes]);
-  const toggleContextItem = useCallback55(
+  const toggleContextItem = useCallback56(
     (item) => {
       const key = `${item.type}:${item.id}`;
       if (mentionActiveRef.current) {
@@ -50739,7 +51014,7 @@ function EmbeddableChatInner({
     },
     [contextMaxItems, contextItems, mentionMarkerByType, resolveContextIcon]
   );
-  const removeContextItem = useCallback55((item) => {
+  const removeContextItem = useCallback56((item) => {
     const key = `${item.type}:${item.id}`;
     setContextItems((prev) => prev.filter((p) => `${p.type}:${p.id}` !== key));
     if (mentionKeysRef.current.has(key)) {
@@ -50749,7 +51024,7 @@ function EmbeddableChatInner({
       chatInputRef.current?.setValue(next);
     }
   }, [mentionMarkerByType]);
-  const handleContextValueChange = useCallback55((value) => {
+  const handleContextValueChange = useCallback56((value) => {
     for (const key of Array.from(mentionKeysRef.current)) {
       if (!value.includes(`@${mentionTokenOf(key, mentionMarkerByType)}`)) {
         mentionKeysRef.current.delete(key);
@@ -50757,24 +51032,24 @@ function EmbeddableChatInner({
       }
     }
   }, [mentionMarkerByType]);
-  const openContextPicker = useCallback55(() => {
+  const openContextPicker = useCallback56(() => {
     setMentionQuery(null);
     setContextPickerOpen(true);
   }, []);
-  const closeContextPicker = useCallback55(() => {
+  const closeContextPicker = useCallback56(() => {
     if (mentionActiveRef.current) {
       chatInputRef.current?.removeMentionTrigger();
     }
     setContextPickerOpen(false);
     setMentionQuery(null);
   }, []);
-  const handleMentionQueryChange = useCallback55((query) => {
+  const handleMentionQueryChange = useCallback56((query) => {
     setMentionQuery(query);
     setContextPickerOpen(query !== null);
   }, []);
   const resolvedBaseRoute = baseRoute || (source === "flamingo" ? "/knowledge-base" : "/data-room");
-  const handleClose = useCallback55(() => setIsOpen(false), [setIsOpen]);
-  const handleNavigationClose = useCallback55(() => {
+  const handleClose = useCallback56(() => setIsOpen(false), [setIsOpen]);
+  const handleNavigationClose = useCallback56(() => {
     navigatingAwayRef.current = true;
     setIsOpen(false);
   }, [setIsOpen]);
@@ -50782,7 +51057,7 @@ function EmbeddableChatInner({
     () => ({ closeChat: handleNavigationClose }),
     [handleNavigationClose]
   );
-  const renderEntityCard = useCallback55(
+  const renderEntityCard = useCallback56(
     (reference) => renderChatInlineEntityCard(reference, {
       onDiscuss: discussRef,
       onDisplay: displayRef,
@@ -50839,7 +51114,7 @@ function EmbeddableChatInner({
     }
     return mapped;
   }, [rawMessages, guideUserName, guideUserAvatar]);
-  const handleSend = useCallback55(
+  const handleSend = useCallback56(
     (text) => {
       let augmentedText = text;
       if (readyAttachments.length > 0) {
@@ -50919,7 +51194,7 @@ function EmbeddableChatInner({
     fetchArchivedDialogs: mingoCaps.fetchArchivedDialogs,
     unarchiveDialog: mingoCaps.unarchiveDialog
   });
-  const handleOpen = useCallback55(() => setIsOpen(true), [setIsOpen]);
+  const handleOpen = useCallback56(() => setIsOpen(true), [setIsOpen]);
   useCloseOnNavigation(handleNavigationClose, null);
   useEffect86(() => {
     const handler = (e) => {
@@ -51717,6 +51992,7 @@ export {
   SECTION_HEADING_CLASS,
   PageHeading,
   VideoBitesStrip,
+  VideoBiteCard,
   EntityVideoSection,
   ChatVideoEntityCard,
   ProductReleaseCard,
@@ -52255,4 +52531,4 @@ export {
   LogsList,
   assets
 };
-//# sourceMappingURL=chunk-VCRUAKOJ.js.map
+//# sourceMappingURL=chunk-IDWKP5H5.js.map