@openhands/agent-canvas 1.12.0 → 1.13.0

package/dist/hooks/use-drag-resize.d.ts

@@ -1,4 +1,12 @@
 import type { RefObject, MouseEvent as ReactMouseEvent, TouchEvent as ReactTouchEvent } from "react";
+/**
+ * Determine whether the chat input is anchored to the bottom of the viewport
+ * by its parent layout (e.g. the conversation page uses a flex column with a
+ * growing scroll area above the input). When true, dragging the top grip
+ * makes the box grow upward, which is the expected behaviour. When false,
+ * the drag would grow the box downward, so we disable it.
+ */
+export declare const isBottomAnchored: () => boolean;
 interface UseDragResizeOptions {
     elementRef: RefObject<HTMLElement | null>;
     minHeight: number;

package/dist/hooks/use-drag-resize.js

@@ -1,46 +1,49 @@
 import "../utils/constants.js";
 import { isMobileDevice as e } from "../utils/utils.js";
 //#region src/hooks/use-drag-resize.ts
-var t = 2, n = ({ elementRef: n, minHeight: r, maxHeight: i, onGripDragStart: a, onGripDragEnd: o, onHeightChange: s, onReachedMinHeight: c }) => {
-	let l = (e) => "touches" in e && e.touches.length > 0 ? e.touches[0].clientY : e.clientY, u = (e, t) => {
+var t = 2, n = 120, r = () => {
+	let e = document.getElementById("resize-grip")?.parentElement ?? null;
+	return e ? e.getBoundingClientRect().bottom >= window.innerHeight - n : !0;
+}, i = ({ elementRef: n, minHeight: i, maxHeight: a, onGripDragStart: o, onGripDragEnd: s, onHeightChange: c, onReachedMinHeight: l }) => {
+	let u = (e) => "touches" in e && e.touches.length > 0 ? e.touches[0].clientY : e.clientY, d = (e, t) => {
 		let n = document.getElementById("resize-grip");
 		n && (n.addEventListener("touchmove", e, {
 			passive: !1,
 			capture: !0
 		}), n.addEventListener("touchend", t, { capture: !0 }));
-	}, d = (e, t) => {
+	}, f = (e, t) => {
 		document.addEventListener("mousemove", e), document.addEventListener("mouseup", t);
-	}, f = (f) => {
-		let p = e(), m = n.current?.offsetHeight || r, h = !1, g = (e) => {
+	}, p = (r) => {
+		let p = e(), m = n.current?.offsetHeight || i, h = !1, g = (e) => {
 			if (e.preventDefault(), !h) {
-				let n = l(e);
-				if (Math.abs(n - f) < t) return;
-				h = !0, a?.();
+				let n = u(e);
+				if (Math.abs(n - r) < t) return;
+				h = !0, o?.();
 			}
-			let o = l(e) - f, u = Math.max(r, Math.min(i, m - o)), d = n.current;
-			if (!d) return;
-			d.style.height = `${u}px`;
-			let p = d.scrollHeight > u || u >= i;
-			d.style.overflowY = p ? "auto" : "hidden", s && s(u), c && Math.abs(u - r) <= 1.5 && c();
+			let s = u(e) - r, d = Math.max(i, Math.min(a, m - s)), f = n.current;
+			if (!f) return;
+			f.style.height = `${d}px`;
+			let p = f.scrollHeight > d || d >= a;
+			f.style.overflowY = p ? "auto" : "hidden", c && c(d), l && Math.abs(d - i) <= 1.5 && l();
 		}, _ = () => {
-			if (h && o?.(), p) {
+			if (h && s?.(), p) {
 				let e = document.getElementById("resize-grip");
 				if (!e) return;
 				e.removeEventListener("mousemove", g), e.removeEventListener("mouseup", _), e.removeEventListener("touchmove", g), e.removeEventListener("touchend", _);
 			} else document.removeEventListener("mousemove", g), document.removeEventListener("mouseup", _), document.removeEventListener("touchmove", g), document.removeEventListener("touchend", _);
 		};
-		p ? u(g, _) : d(g, _);
+		p ? d(g, _) : f(g, _);
 	};
 	return {
 		handleGripMouseDown: (e) => {
-			e.preventDefault(), f(e.clientY);
+			e.preventDefault(), r() && p(e.clientY);
 		},
 		handleGripTouchStart: (e) => {
-			e.preventDefault(), f(e.touches[0].clientY);
+			e.preventDefault(), r() && p(e.touches[0].clientY);
 		}
 	};
 };
 //#endregion
-export { n as useDragResize };
+export { r as isBottomAnchored, i as useDragResize };
 
 //# sourceMappingURL=use-drag-resize.js.map

package/dist/hooks/use-drag-resize.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-drag-resize.js","names":[],"sources":["../../src/hooks/use-drag-resize.ts"],"sourcesContent":["import type {\n  RefObject,\n  MouseEvent as ReactMouseEvent,\n  TouchEvent as ReactTouchEvent,\n} from \"react\";\nimport { EPS } from \"#/utils/constants\";\nimport { isMobileDevice } from \"#/utils/utils\";\n\n/** Movement required before a pointer gesture is treated as a resize drag. */\nconst DRAG_COMMIT_PX = 2;\n\n// Drag handling hook\ninterface UseDragResizeOptions {\n  elementRef: RefObject<HTMLElement | null>;\n  minHeight: number;\n  maxHeight: number;\n  onGripDragStart?: () => void;\n  onGripDragEnd?: () => void;\n  onHeightChange?: (height: number) => void;\n  onReachedMinHeight?: () => void; // Notify when user drags to minimum height\n}\n\nexport const useDragResize = ({\n  elementRef,\n  minHeight,\n  maxHeight,\n  onGripDragStart,\n  onGripDragEnd,\n  onHeightChange,\n  onReachedMinHeight,\n}: UseDragResizeOptions) => {\n  const getClientY = (event: MouseEvent | TouchEvent): number => {\n    if (\"touches\" in event && event.touches.length > 0) {\n      return event.touches[0].clientY;\n    }\n    return (event as MouseEvent).clientY;\n  };\n\n  // Setup event listeners for mobile devices\n  const setupMobileEventListeners = (\n    handleDragMove: (event: MouseEvent | TouchEvent) => void,\n    handleDragEnd: () => void,\n  ) => {\n    const resizeGrip = document.getElementById(\"resize-grip\");\n\n    if (!resizeGrip) {\n      return;\n    }\n\n    resizeGrip.addEventListener(\"touchmove\", handleDragMove, {\n      passive: false,\n      capture: true,\n    });\n    resizeGrip.addEventListener(\"touchend\", handleDragEnd, {\n      capture: true,\n    });\n  };\n\n  // Setup event listeners for desktop devices\n  const setupDesktopEventListeners = (\n    handleDragMove: (event: MouseEvent | TouchEvent) => void,\n    handleDragEnd: () => void,\n  ) => {\n    document.addEventListener(\"mousemove\", handleDragMove);\n    document.addEventListener(\"mouseup\", handleDragEnd);\n  };\n\n  // Start drag operation\n  const startDrag = (startY: number) => {\n    const isMobile = isMobileDevice();\n    const startHeight = elementRef.current?.offsetHeight || minHeight;\n    let dragCommitted = false;\n\n    const handleDragMove = (moveEvent: MouseEvent | TouchEvent) => {\n      moveEvent.preventDefault();\n\n      if (!dragCommitted) {\n        const y = getClientY(moveEvent);\n        if (Math.abs(y - startY) < DRAG_COMMIT_PX) {\n          return;\n        }\n        dragCommitted = true;\n        onGripDragStart?.();\n      }\n\n      const deltaY = getClientY(moveEvent) - startY;\n      // Invert deltaY so moving up increases height and moving down decreases height\n      const newHeight = Math.max(\n        minHeight,\n        Math.min(maxHeight, startHeight - deltaY),\n      );\n\n      const element = elementRef.current;\n\n      if (!element) {\n        return;\n      }\n\n      element.style.height = `${newHeight}px`;\n\n      // Check if content exceeds the new height to determine scrollbar visibility\n      const contentHeight = element.scrollHeight;\n      const shouldShowScrollbar =\n        contentHeight > newHeight || newHeight >= maxHeight;\n      element.style.overflowY = shouldShowScrollbar ? \"auto\" : \"hidden\";\n\n      // Call the height change callback if provided\n      if (onHeightChange) {\n        onHeightChange(newHeight);\n      }\n\n      // Notify when dragged to minimum height to clear manual mode\n      if (onReachedMinHeight && Math.abs(newHeight - minHeight) <= EPS) {\n        onReachedMinHeight();\n      }\n    };\n\n    const handleDragEnd = () => {\n      if (dragCommitted) {\n        onGripDragEnd?.();\n      }\n\n      if (isMobile) {\n        const resizeGrip = document.getElementById(\"resize-grip\");\n        if (!resizeGrip) {\n          return;\n        }\n\n        // Remove both mouse and touch event listeners\n        resizeGrip.removeEventListener(\"mousemove\", handleDragMove);\n        resizeGrip.removeEventListener(\"mouseup\", handleDragEnd);\n        resizeGrip.removeEventListener(\"touchmove\", handleDragMove);\n        resizeGrip.removeEventListener(\"touchend\", handleDragEnd);\n      } else {\n        document.removeEventListener(\"mousemove\", handleDragMove);\n        document.removeEventListener(\"mouseup\", handleDragEnd);\n        document.removeEventListener(\"touchmove\", handleDragMove);\n        document.removeEventListener(\"touchend\", handleDragEnd);\n      }\n    };\n\n    // Setup event listeners based on device type\n    if (isMobile) {\n      setupMobileEventListeners(handleDragMove, handleDragEnd);\n    } else {\n      setupDesktopEventListeners(handleDragMove, handleDragEnd);\n    }\n  };\n\n  // Handle mouse down on grip for manual resizing\n  const handleGripMouseDown = (e: ReactMouseEvent) => {\n    e.preventDefault();\n    startDrag(e.clientY);\n  };\n\n  // Handle touch start on grip for manual resizing\n  const handleGripTouchStart = (e: ReactTouchEvent) => {\n    e.preventDefault();\n    startDrag(e.touches[0].clientY);\n  };\n\n  return {\n    handleGripMouseDown,\n    handleGripTouchStart,\n  };\n};\n"],"mappings":";;;AASA,IAAM,IAAiB,GAaV,KAAiB,EAC5B,eACA,cACA,cACA,oBACA,kBACA,mBACA,4BAC0B;CAC1B,IAAM,KAAc,MACd,aAAa,KAAS,EAAM,QAAQ,SAAS,IACxC,EAAM,QAAQ,GAAG,UAElB,EAAqB,SAIzB,KACJ,GACA,MACG;EACH,IAAM,IAAa,SAAS,eAAe,aAAa;EAEnD,MAIL,EAAW,iBAAiB,aAAa,GAAgB;GACvD,SAAS;GACT,SAAS;EACX,CAAC,GACD,EAAW,iBAAiB,YAAY,GAAe,EACrD,SAAS,GACX,CAAC;CACH,GAGM,KACJ,GACA,MACG;EAEH,AADA,SAAS,iBAAiB,aAAa,CAAc,GACrD,SAAS,iBAAiB,WAAW,CAAa;CACpD,GAGM,KAAa,MAAmB;EACpC,IAAM,IAAW,EAAe,GAC1B,IAAc,EAAW,SAAS,gBAAgB,GACpD,IAAgB,IAEd,KAAkB,MAAuC;GAG7D,IAFA,EAAU,eAAe,GAErB,CAAC,GAAe;IAClB,IAAM,IAAI,EAAW,CAAS;IAC9B,IAAI,KAAK,IAAI,IAAI,CAAM,IAAI,GACzB;IAGF,AADA,IAAgB,IAChB,IAAkB;GACpB;GAEA,IAAM,IAAS,EAAW,CAAS,IAAI,GAEjC,IAAY,KAAK,IACrB,GACA,KAAK,IAAI,GAAW,IAAc,CAAM,CAC1C,GAEM,IAAU,EAAW;GAE3B,IAAI,CAAC,GACH;GAGF,EAAQ,MAAM,SAAS,GAAG,EAAU;GAIpC,IAAM,IADgB,EAAQ,eAEZ,KAAa,KAAa;GAS5C,AARA,EAAQ,MAAM,YAAY,IAAsB,SAAS,UAGrD,KACF,EAAe,CAAS,GAItB,KAAsB,KAAK,IAAI,IAAY,CAAS,KAAA,OACtD,EAAmB;EAEvB,GAEM,UAAsB;GAK1B,IAJI,KACF,IAAgB,GAGd,GAAU;IACZ,IAAM,IAAa,SAAS,eAAe,aAAa;IACxD,IAAI,CAAC,GACH;IAOF,AAHA,EAAW,oBAAoB,aAAa,CAAc,GAC1D,EAAW,oBAAoB,WAAW,CAAa,GACvD,EAAW,oBAAoB,aAAa,CAAc,GAC1D,EAAW,oBAAoB,YAAY,CAAa;GAC1D,OAIE,AAHA,SAAS,oBAAoB,aAAa,CAAc,GACxD,SAAS,oBAAoB,WAAW,CAAa,GACrD,SAAS,oBAAoB,aAAa,CAAc,GACxD,SAAS,oBAAoB,YAAY,CAAa;EAE1D;EAGA,AAAI,IACF,EAA0B,GAAgB,CAAa,IAEvD,EAA2B,GAAgB,CAAa;CAE5D;CAcA,OAAO;EACL,sBAZ2B,MAAuB;GAElD,AADA,EAAE,eAAe,GACjB,EAAU,EAAE,OAAO;EACrB;EAUE,uBAP4B,MAAuB;GAEnD,AADA,EAAE,eAAe,GACjB,EAAU,EAAE,QAAQ,GAAG,OAAO;EAChC;CAKA;AACF"}
+{"version":3,"file":"use-drag-resize.js","names":[],"sources":["../../src/hooks/use-drag-resize.ts"],"sourcesContent":["import type {\n  RefObject,\n  MouseEvent as ReactMouseEvent,\n  TouchEvent as ReactTouchEvent,\n} from \"react\";\nimport { EPS } from \"#/utils/constants\";\nimport { isMobileDevice } from \"#/utils/utils\";\n\n/** Movement required before a pointer gesture is treated as a resize drag. */\nconst DRAG_COMMIT_PX = 2;\n\n/**\n * Distance (px) from the viewport bottom within which we consider the chat\n * input to be \"bottom-anchored\" by its parent's flexbox. When the input is\n * bottom-anchored (e.g. the conversation page), dragging the top grip makes\n * the box grow upward — the expected behaviour. When it is NOT\n * bottom-anchored (e.g. the home page where the input sits in the centre of\n * the screen), the same drag would make the box grow downward, which is\n * confusing, so we disable manual resizing entirely in that case.\n */\nconst BOTTOM_ANCHORED_THRESHOLD = 120;\n\n/**\n * Determine whether the chat input is anchored to the bottom of the viewport\n * by its parent layout (e.g. the conversation page uses a flex column with a\n * growing scroll area above the input). When true, dragging the top grip\n * makes the box grow upward, which is the expected behaviour. When false,\n * the drag would grow the box downward, so we disable it.\n */\nexport const isBottomAnchored = (): boolean => {\n  const grip = document.getElementById(\"resize-grip\");\n  const wrapper = grip?.parentElement ?? null;\n  if (!wrapper) return true; // fall back to allowing the drag\n  const rect = wrapper.getBoundingClientRect();\n  return rect.bottom >= window.innerHeight - BOTTOM_ANCHORED_THRESHOLD;\n};\n\n// Drag handling hook\ninterface UseDragResizeOptions {\n  elementRef: RefObject<HTMLElement | null>;\n  minHeight: number;\n  maxHeight: number;\n  onGripDragStart?: () => void;\n  onGripDragEnd?: () => void;\n  onHeightChange?: (height: number) => void;\n  onReachedMinHeight?: () => void; // Notify when user drags to minimum height\n}\n\nexport const useDragResize = ({\n  elementRef,\n  minHeight,\n  maxHeight,\n  onGripDragStart,\n  onGripDragEnd,\n  onHeightChange,\n  onReachedMinHeight,\n}: UseDragResizeOptions) => {\n  const getClientY = (event: MouseEvent | TouchEvent): number => {\n    if (\"touches\" in event && event.touches.length > 0) {\n      return event.touches[0].clientY;\n    }\n    return (event as MouseEvent).clientY;\n  };\n\n  // Setup event listeners for mobile devices\n  const setupMobileEventListeners = (\n    handleDragMove: (event: MouseEvent | TouchEvent) => void,\n    handleDragEnd: () => void,\n  ) => {\n    const resizeGrip = document.getElementById(\"resize-grip\");\n\n    if (!resizeGrip) {\n      return;\n    }\n\n    resizeGrip.addEventListener(\"touchmove\", handleDragMove, {\n      passive: false,\n      capture: true,\n    });\n    resizeGrip.addEventListener(\"touchend\", handleDragEnd, {\n      capture: true,\n    });\n  };\n\n  // Setup event listeners for desktop devices\n  const setupDesktopEventListeners = (\n    handleDragMove: (event: MouseEvent | TouchEvent) => void,\n    handleDragEnd: () => void,\n  ) => {\n    document.addEventListener(\"mousemove\", handleDragMove);\n    document.addEventListener(\"mouseup\", handleDragEnd);\n  };\n\n  // Start drag operation\n  const startDrag = (startY: number) => {\n    const isMobile = isMobileDevice();\n    const startHeight = elementRef.current?.offsetHeight || minHeight;\n    let dragCommitted = false;\n\n    const handleDragMove = (moveEvent: MouseEvent | TouchEvent) => {\n      moveEvent.preventDefault();\n\n      if (!dragCommitted) {\n        const y = getClientY(moveEvent);\n        if (Math.abs(y - startY) < DRAG_COMMIT_PX) {\n          return;\n        }\n        dragCommitted = true;\n        onGripDragStart?.();\n      }\n\n      const deltaY = getClientY(moveEvent) - startY;\n      // Invert deltaY so moving up increases height and moving down decreases height\n      const newHeight = Math.max(\n        minHeight,\n        Math.min(maxHeight, startHeight - deltaY),\n      );\n\n      const element = elementRef.current;\n\n      if (!element) {\n        return;\n      }\n\n      element.style.height = `${newHeight}px`;\n\n      // Check if content exceeds the new height to determine scrollbar visibility\n      const contentHeight = element.scrollHeight;\n      const shouldShowScrollbar =\n        contentHeight > newHeight || newHeight >= maxHeight;\n      element.style.overflowY = shouldShowScrollbar ? \"auto\" : \"hidden\";\n\n      // Call the height change callback if provided\n      if (onHeightChange) {\n        onHeightChange(newHeight);\n      }\n\n      // Notify when dragged to minimum height to clear manual mode\n      if (onReachedMinHeight && Math.abs(newHeight - minHeight) <= EPS) {\n        onReachedMinHeight();\n      }\n    };\n\n    const handleDragEnd = () => {\n      if (dragCommitted) {\n        onGripDragEnd?.();\n      }\n\n      if (isMobile) {\n        const resizeGrip = document.getElementById(\"resize-grip\");\n        if (!resizeGrip) {\n          return;\n        }\n\n        // Remove both mouse and touch event listeners\n        resizeGrip.removeEventListener(\"mousemove\", handleDragMove);\n        resizeGrip.removeEventListener(\"mouseup\", handleDragEnd);\n        resizeGrip.removeEventListener(\"touchmove\", handleDragMove);\n        resizeGrip.removeEventListener(\"touchend\", handleDragEnd);\n      } else {\n        document.removeEventListener(\"mousemove\", handleDragMove);\n        document.removeEventListener(\"mouseup\", handleDragEnd);\n        document.removeEventListener(\"touchmove\", handleDragMove);\n        document.removeEventListener(\"touchend\", handleDragEnd);\n      }\n    };\n\n    // Setup event listeners based on device type\n    if (isMobile) {\n      setupMobileEventListeners(handleDragMove, handleDragEnd);\n    } else {\n      setupDesktopEventListeners(handleDragMove, handleDragEnd);\n    }\n  };\n\n  // Handle mouse down on grip for manual resizing\n  const handleGripMouseDown = (e: ReactMouseEvent) => {\n    e.preventDefault();\n    // Only allow manual resizing when the input is bottom-anchored (e.g. the\n    // conversation page). On the home page the input is centred and dragging\n    // the top grip would grow the box downward, which is confusing.\n    if (!isBottomAnchored()) return;\n    startDrag(e.clientY);\n  };\n\n  // Handle touch start on grip for manual resizing\n  const handleGripTouchStart = (e: ReactTouchEvent) => {\n    e.preventDefault();\n    if (!isBottomAnchored()) return;\n    startDrag(e.touches[0].clientY);\n  };\n\n  return {\n    handleGripMouseDown,\n    handleGripTouchStart,\n  };\n};\n"],"mappings":";;;AASA,IAAM,IAAiB,GAWjB,IAA4B,KASrB,UAAkC;CAE7C,IAAM,IADO,SAAS,eAAe,aACrB,GAAM,iBAAiB;CAGvC,OAFK,IACQ,EAAQ,sBACd,EAAK,UAAU,OAAO,cAAc,IAFtB;AAGvB,GAaa,KAAiB,EAC5B,eACA,cACA,cACA,oBACA,kBACA,mBACA,4BAC0B;CAC1B,IAAM,KAAc,MACd,aAAa,KAAS,EAAM,QAAQ,SAAS,IACxC,EAAM,QAAQ,GAAG,UAElB,EAAqB,SAIzB,KACJ,GACA,MACG;EACH,IAAM,IAAa,SAAS,eAAe,aAAa;EAEnD,MAIL,EAAW,iBAAiB,aAAa,GAAgB;GACvD,SAAS;GACT,SAAS;EACX,CAAC,GACD,EAAW,iBAAiB,YAAY,GAAe,EACrD,SAAS,GACX,CAAC;CACH,GAGM,KACJ,GACA,MACG;EAEH,AADA,SAAS,iBAAiB,aAAa,CAAc,GACrD,SAAS,iBAAiB,WAAW,CAAa;CACpD,GAGM,KAAa,MAAmB;EACpC,IAAM,IAAW,EAAe,GAC1B,IAAc,EAAW,SAAS,gBAAgB,GACpD,IAAgB,IAEd,KAAkB,MAAuC;GAG7D,IAFA,EAAU,eAAe,GAErB,CAAC,GAAe;IAClB,IAAM,IAAI,EAAW,CAAS;IAC9B,IAAI,KAAK,IAAI,IAAI,CAAM,IAAI,GACzB;IAGF,AADA,IAAgB,IAChB,IAAkB;GACpB;GAEA,IAAM,IAAS,EAAW,CAAS,IAAI,GAEjC,IAAY,KAAK,IACrB,GACA,KAAK,IAAI,GAAW,IAAc,CAAM,CAC1C,GAEM,IAAU,EAAW;GAE3B,IAAI,CAAC,GACH;GAGF,EAAQ,MAAM,SAAS,GAAG,EAAU;GAIpC,IAAM,IADgB,EAAQ,eAEZ,KAAa,KAAa;GAS5C,AARA,EAAQ,MAAM,YAAY,IAAsB,SAAS,UAGrD,KACF,EAAe,CAAS,GAItB,KAAsB,KAAK,IAAI,IAAY,CAAS,KAAA,OACtD,EAAmB;EAEvB,GAEM,UAAsB;GAK1B,IAJI,KACF,IAAgB,GAGd,GAAU;IACZ,IAAM,IAAa,SAAS,eAAe,aAAa;IACxD,IAAI,CAAC,GACH;IAOF,AAHA,EAAW,oBAAoB,aAAa,CAAc,GAC1D,EAAW,oBAAoB,WAAW,CAAa,GACvD,EAAW,oBAAoB,aAAa,CAAc,GAC1D,EAAW,oBAAoB,YAAY,CAAa;GAC1D,OAIE,AAHA,SAAS,oBAAoB,aAAa,CAAc,GACxD,SAAS,oBAAoB,WAAW,CAAa,GACrD,SAAS,oBAAoB,aAAa,CAAc,GACxD,SAAS,oBAAoB,YAAY,CAAa;EAE1D;EAGA,AAAI,IACF,EAA0B,GAAgB,CAAa,IAEvD,EAA2B,GAAgB,CAAa;CAE5D;CAmBA,OAAO;EACL,sBAjB2B,MAAuB;GAClD,EAAE,eAAe,GAIZ,EAAiB,KACtB,EAAU,EAAE,OAAO;EACrB;EAWE,uBAR4B,MAAuB;GACnD,EAAE,eAAe,GACZ,EAAiB,KACtB,EAAU,EAAE,QAAQ,GAAG,OAAO;EAChC;CAKA;AACF"}

package/dist/hooks/use-live-conversation-metrics.cjs

@@ -0,0 +1,2 @@
+require("../_virtual/_rolldown/runtime.cjs");const e=require("../stores/metrics-store.cjs"),t=require("./query/use-active-conversation.cjs"),n=require("./query/use-conversation-metrics.cjs");let r=require("react");function i(i=!0){let a=e.default(e=>e.cost),o=e.default(e=>e.max_budget_per_task),s=e.default(e=>e.usage),{data:c}=t.useActiveConversation(),{data:l}=n.useConversationMetrics(c?.id,c?.conversation_url,c?.session_api_key,i);return(0,r.useMemo)(()=>a!==null||s!==null?{cost:a,max_budget_per_task:o,usage:s}:l?{cost:l.accumulated_cost,max_budget_per_task:l.max_budget_per_task,usage:l.accumulated_token_usage?{prompt_tokens:l.accumulated_token_usage.prompt_tokens??0,completion_tokens:l.accumulated_token_usage.completion_tokens??0,cache_read_tokens:l.accumulated_token_usage.cache_read_tokens??0,cache_write_tokens:l.accumulated_token_usage.cache_write_tokens??0,context_window:l.accumulated_token_usage.context_window??0,per_turn_token:l.accumulated_token_usage.per_turn_token??0}:null}:{cost:null,max_budget_per_task:null,usage:null},[l,a,o,s])}exports.useLiveConversationMetrics=i;
+//# sourceMappingURL=use-live-conversation-metrics.cjs.map

package/dist/hooks/use-live-conversation-metrics.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-live-conversation-metrics.cjs","names":[],"sources":["../../src/hooks/use-live-conversation-metrics.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport useMetricsStore, { type MetricsState } from \"#/stores/metrics-store\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useConversationMetrics } from \"#/hooks/query/use-conversation-metrics\";\n\n/**\n * Combined cost/token metrics for the active conversation.\n *\n * Prefers the live WebSocket metrics store, which updates in real time as\n * agent events stream in, and falls back to the REST snapshot\n * (`GET /api/conversations/{id}` stats, combined across all usage ids and\n * refreshed on a 30s interval by {@link useConversationMetrics}) before the\n * first stats arrive. The store is reset on conversation switch (see\n * `ConversationWebSocketProvider`), so its contents always belong to the\n * active conversation — preferring it cannot leak a previous\n * conversation's figures, and preferring REST would lag the display up to\n * a poll interval behind what the user just watched happen.\n *\n * Pass `enabled: false` to pause the REST polling while the consumer is\n * hidden (e.g. a closed modal).\n */\nexport function useLiveConversationMetrics(\n  enabled: boolean = true,\n): MetricsState {\n  // Per-field selectors rather than a bare `useMetricsStore()`: subscribing to\n  // the whole store re-runs this hook on any store write, including the action\n  // identity, and matches how `useContextWindowUsage` reads the same store.\n  const storeCost = useMetricsStore((state) => state.cost);\n  const storeMaxBudgetPerTask = useMetricsStore(\n    (state) => state.max_budget_per_task,\n  );\n  const storeUsage = useMetricsStore((state) => state.usage);\n  const { data: conversation } = useActiveConversation();\n\n  const { data: conversationMetrics } = useConversationMetrics(\n    conversation?.id,\n    conversation?.conversation_url,\n    conversation?.session_api_key,\n    enabled,\n  );\n\n  return useMemo(() => {\n    // Live store first: real-time and (post-reset) always the active\n    // conversation's data. Any non-null field counts as data.\n    if (storeCost !== null || storeUsage !== null) {\n      return {\n        cost: storeCost,\n        max_budget_per_task: storeMaxBudgetPerTask,\n        usage: storeUsage,\n      };\n    }\n\n    if (conversationMetrics) {\n      return {\n        cost: conversationMetrics.accumulated_cost,\n        max_budget_per_task: conversationMetrics.max_budget_per_task,\n        usage: conversationMetrics.accumulated_token_usage\n          ? {\n              prompt_tokens:\n                conversationMetrics.accumulated_token_usage.prompt_tokens ?? 0,\n              completion_tokens:\n                conversationMetrics.accumulated_token_usage.completion_tokens ??\n                0,\n              cache_read_tokens:\n                conversationMetrics.accumulated_token_usage.cache_read_tokens ??\n                0,\n              cache_write_tokens:\n                conversationMetrics.accumulated_token_usage\n                  .cache_write_tokens ?? 0,\n              context_window:\n                conversationMetrics.accumulated_token_usage.context_window ?? 0,\n              per_turn_token:\n                conversationMetrics.accumulated_token_usage.per_turn_token ?? 0,\n            }\n          : null,\n      };\n    }\n\n    return {\n      cost: null,\n      max_budget_per_task: null,\n      usage: null,\n    };\n  }, [conversationMetrics, storeCost, storeMaxBudgetPerTask, storeUsage]);\n}\n"],"mappings":"sNAqBA,SAAgB,EACd,EAAmB,GACL,CAId,IAAM,EAAY,EAAA,QAAiB,GAAU,EAAM,IAAI,EACjD,EAAwB,EAAA,QAC3B,GAAU,EAAM,mBACnB,EACM,EAAa,EAAA,QAAiB,GAAU,EAAM,KAAK,EACnD,CAAE,KAAM,GAAiB,EAAA,sBAAsB,EAE/C,CAAE,KAAM,GAAwB,EAAA,uBACpC,GAAc,GACd,GAAc,iBACd,GAAc,gBACd,CACF,EAEA,OAAA,EAAA,EAAA,aAGM,IAAc,MAAQ,IAAe,KAChC,CACL,KAAM,EACN,oBAAqB,EACrB,MAAO,CACT,EAGE,EACK,CACL,KAAM,EAAoB,iBAC1B,oBAAqB,EAAoB,oBACzC,MAAO,EAAoB,wBACvB,CACE,cACE,EAAoB,wBAAwB,eAAiB,EAC/D,kBACE,EAAoB,wBAAwB,mBAC5C,EACF,kBACE,EAAoB,wBAAwB,mBAC5C,EACF,mBACE,EAAoB,wBACjB,oBAAsB,EAC3B,eACE,EAAoB,wBAAwB,gBAAkB,EAChE,eACE,EAAoB,wBAAwB,gBAAkB,CAClE,EACA,IACN,EAGK,CACL,KAAM,KACN,oBAAqB,KACrB,MAAO,IACT,EACC,CAAC,EAAqB,EAAW,EAAuB,CAAU,CAAC,CACxE"}

package/dist/hooks/use-live-conversation-metrics.d.ts

@@ -0,0 +1,18 @@
+import { type MetricsState } from "#/stores/metrics-store";
+/**
+ * Combined cost/token metrics for the active conversation.
+ *
+ * Prefers the live WebSocket metrics store, which updates in real time as
+ * agent events stream in, and falls back to the REST snapshot
+ * (`GET /api/conversations/{id}` stats, combined across all usage ids and
+ * refreshed on a 30s interval by {@link useConversationMetrics}) before the
+ * first stats arrive. The store is reset on conversation switch (see
+ * `ConversationWebSocketProvider`), so its contents always belong to the
+ * active conversation — preferring it cannot leak a previous
+ * conversation's figures, and preferring REST would lag the display up to
+ * a poll interval behind what the user just watched happen.
+ *
+ * Pass `enabled: false` to pause the REST polling while the consumer is
+ * hidden (e.g. a closed modal).
+ */
+export declare function useLiveConversationMetrics(enabled?: boolean): MetricsState;

package/dist/hooks/use-live-conversation-metrics.js

@@ -0,0 +1,37 @@
+import e from "../stores/metrics-store.js";
+import { useActiveConversation as t } from "./query/use-active-conversation.js";
+import { useConversationMetrics as n } from "./query/use-conversation-metrics.js";
+import { useMemo as r } from "react";
+//#region src/hooks/use-live-conversation-metrics.ts
+function i(i = !0) {
+	let a = e((e) => e.cost), o = e((e) => e.max_budget_per_task), s = e((e) => e.usage), { data: c } = t(), { data: l } = n(c?.id, c?.conversation_url, c?.session_api_key, i);
+	return r(() => a !== null || s !== null ? {
+		cost: a,
+		max_budget_per_task: o,
+		usage: s
+	} : l ? {
+		cost: l.accumulated_cost,
+		max_budget_per_task: l.max_budget_per_task,
+		usage: l.accumulated_token_usage ? {
+			prompt_tokens: l.accumulated_token_usage.prompt_tokens ?? 0,
+			completion_tokens: l.accumulated_token_usage.completion_tokens ?? 0,
+			cache_read_tokens: l.accumulated_token_usage.cache_read_tokens ?? 0,
+			cache_write_tokens: l.accumulated_token_usage.cache_write_tokens ?? 0,
+			context_window: l.accumulated_token_usage.context_window ?? 0,
+			per_turn_token: l.accumulated_token_usage.per_turn_token ?? 0
+		} : null
+	} : {
+		cost: null,
+		max_budget_per_task: null,
+		usage: null
+	}, [
+		l,
+		a,
+		o,
+		s
+	]);
+}
+//#endregion
+export { i as useLiveConversationMetrics };
+
+//# sourceMappingURL=use-live-conversation-metrics.js.map

package/dist/hooks/use-live-conversation-metrics.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-live-conversation-metrics.js","names":[],"sources":["../../src/hooks/use-live-conversation-metrics.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport useMetricsStore, { type MetricsState } from \"#/stores/metrics-store\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useConversationMetrics } from \"#/hooks/query/use-conversation-metrics\";\n\n/**\n * Combined cost/token metrics for the active conversation.\n *\n * Prefers the live WebSocket metrics store, which updates in real time as\n * agent events stream in, and falls back to the REST snapshot\n * (`GET /api/conversations/{id}` stats, combined across all usage ids and\n * refreshed on a 30s interval by {@link useConversationMetrics}) before the\n * first stats arrive. The store is reset on conversation switch (see\n * `ConversationWebSocketProvider`), so its contents always belong to the\n * active conversation — preferring it cannot leak a previous\n * conversation's figures, and preferring REST would lag the display up to\n * a poll interval behind what the user just watched happen.\n *\n * Pass `enabled: false` to pause the REST polling while the consumer is\n * hidden (e.g. a closed modal).\n */\nexport function useLiveConversationMetrics(\n  enabled: boolean = true,\n): MetricsState {\n  // Per-field selectors rather than a bare `useMetricsStore()`: subscribing to\n  // the whole store re-runs this hook on any store write, including the action\n  // identity, and matches how `useContextWindowUsage` reads the same store.\n  const storeCost = useMetricsStore((state) => state.cost);\n  const storeMaxBudgetPerTask = useMetricsStore(\n    (state) => state.max_budget_per_task,\n  );\n  const storeUsage = useMetricsStore((state) => state.usage);\n  const { data: conversation } = useActiveConversation();\n\n  const { data: conversationMetrics } = useConversationMetrics(\n    conversation?.id,\n    conversation?.conversation_url,\n    conversation?.session_api_key,\n    enabled,\n  );\n\n  return useMemo(() => {\n    // Live store first: real-time and (post-reset) always the active\n    // conversation's data. Any non-null field counts as data.\n    if (storeCost !== null || storeUsage !== null) {\n      return {\n        cost: storeCost,\n        max_budget_per_task: storeMaxBudgetPerTask,\n        usage: storeUsage,\n      };\n    }\n\n    if (conversationMetrics) {\n      return {\n        cost: conversationMetrics.accumulated_cost,\n        max_budget_per_task: conversationMetrics.max_budget_per_task,\n        usage: conversationMetrics.accumulated_token_usage\n          ? {\n              prompt_tokens:\n                conversationMetrics.accumulated_token_usage.prompt_tokens ?? 0,\n              completion_tokens:\n                conversationMetrics.accumulated_token_usage.completion_tokens ??\n                0,\n              cache_read_tokens:\n                conversationMetrics.accumulated_token_usage.cache_read_tokens ??\n                0,\n              cache_write_tokens:\n                conversationMetrics.accumulated_token_usage\n                  .cache_write_tokens ?? 0,\n              context_window:\n                conversationMetrics.accumulated_token_usage.context_window ?? 0,\n              per_turn_token:\n                conversationMetrics.accumulated_token_usage.per_turn_token ?? 0,\n            }\n          : null,\n      };\n    }\n\n    return {\n      cost: null,\n      max_budget_per_task: null,\n      usage: null,\n    };\n  }, [conversationMetrics, storeCost, storeMaxBudgetPerTask, storeUsage]);\n}\n"],"mappings":";;;;;AAqBA,SAAgB,EACd,IAAmB,IACL;CAId,IAAM,IAAY,GAAiB,MAAU,EAAM,IAAI,GACjD,IAAwB,GAC3B,MAAU,EAAM,mBACnB,GACM,IAAa,GAAiB,MAAU,EAAM,KAAK,GACnD,EAAE,MAAM,MAAiB,EAAsB,GAE/C,EAAE,MAAM,MAAwB,EACpC,GAAc,IACd,GAAc,kBACd,GAAc,iBACd,CACF;CAEA,OAAO,QAGD,MAAc,QAAQ,MAAe,OAChC;EACL,MAAM;EACN,qBAAqB;EACrB,OAAO;CACT,IAGE,IACK;EACL,MAAM,EAAoB;EAC1B,qBAAqB,EAAoB;EACzC,OAAO,EAAoB,0BACvB;GACE,eACE,EAAoB,wBAAwB,iBAAiB;GAC/D,mBACE,EAAoB,wBAAwB,qBAC5C;GACF,mBACE,EAAoB,wBAAwB,qBAC5C;GACF,oBACE,EAAoB,wBACjB,sBAAsB;GAC3B,gBACE,EAAoB,wBAAwB,kBAAkB;GAChE,gBACE,EAAoB,wBAAwB,kBAAkB;EAClE,IACA;CACN,IAGK;EACL,MAAM;EACN,qBAAqB;EACrB,OAAO;CACT,GACC;EAAC;EAAqB;EAAW;EAAuB;CAAU,CAAC;AACxE"}

package/dist/hooks/use-select-conversation-tab.cjs

@@ -1,2 +1,2 @@
-require("../_virtual/_rolldown/runtime.cjs");const e=require("./use-conversation-id.cjs"),t=require("../utils/conversation-local-storage.cjs"),n=require("../stores/conversation-store.cjs");function r(){let{conversationId:r}=e.useConversationId(),{selectedTab:i,isRightPanelShown:a,setHasRightPanelToggled:o,setSelectedTab:s}=n.useConversationStore(),{setSelectedTab:c}=t.useConversationLocalStorageState(r),l=e=>{s(e),c(e)};return{selectTab:e=>{i===e&&a?o(!1):(l(e),a||o(!0))},navigateToTab:e=>{l(e),a||o(!0)},isTabActive:e=>a&&i===e,onTabChange:l,selectedTab:i,isRightPanelShown:a}}exports.useSelectConversationTab=r;
+require("../_virtual/_rolldown/runtime.cjs");const e=require("./use-conversation-id.cjs"),t=require("../utils/conversation-local-storage.cjs"),n=require("../stores/conversation-store.cjs");function r(){let{conversationId:r}=e.useOptionalConversationId(),{selectedTab:i,isRightPanelShown:a,setHasRightPanelToggled:o,setSelectedTab:s}=n.useConversationStore(),{setSelectedTab:c}=t.useConversationLocalStorageState(r??``),l=e=>{s(e),c(e)};return{selectTab:e=>{i===e&&a?o(!1):(l(e),a||o(!0))},navigateToTab:e=>{l(e),a||o(!0)},isTabActive:e=>a&&i===e,onTabChange:l,selectedTab:i,isRightPanelShown:a}}exports.useSelectConversationTab=r;
 //# sourceMappingURL=use-select-conversation-tab.cjs.map

package/dist/hooks/use-select-conversation-tab.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-select-conversation-tab.cjs","names":[],"sources":["../../src/hooks/use-select-conversation-tab.ts"],"sourcesContent":["import { useConversationLocalStorageState } from \"#/utils/conversation-local-storage\";\nimport {\n  useConversationStore,\n  type ConversationTab,\n} from \"#/stores/conversation-store\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\n\n/**\n * Custom hook for selecting conversation tabs with consistent behavior.\n *\n * Handles panel visibility and tab toggling logic. The selected tab is\n * persisted per conversation (so users land on the same tab when they\n * come back), but the drawer's open/closed state is intentionally\n * session-only — see `useConversationStore` for the rationale.\n */\nexport function useSelectConversationTab() {\n  const { conversationId } = useConversationId();\n  const {\n    selectedTab,\n    isRightPanelShown,\n    setHasRightPanelToggled,\n    setSelectedTab,\n  } = useConversationStore();\n\n  const { setSelectedTab: setPersistedSelectedTab } =\n    useConversationLocalStorageState(conversationId);\n\n  const onTabChange = (value: ConversationTab | null) => {\n    setSelectedTab(value);\n    setPersistedSelectedTab(value);\n  };\n\n  /**\n   * Selects a tab with proper panel visibility handling.\n   * - If clicking the same active tab while panel is open, closes the panel\n   * - If clicking a different tab or panel is closed, opens panel and selects tab\n   */\n  const selectTab = (tab: ConversationTab) => {\n    if (selectedTab === tab && isRightPanelShown) {\n      setHasRightPanelToggled(false);\n    } else {\n      onTabChange(tab);\n      if (!isRightPanelShown) {\n        setHasRightPanelToggled(true);\n      }\n    }\n  };\n\n  /**\n   * Navigates to a tab without toggle behavior.\n   * Always shows the panel and selects the tab, even if already selected.\n   * Use this for \"View\" or \"Read More\" buttons that should always navigate.\n   */\n  const navigateToTab = (tab: ConversationTab) => {\n    onTabChange(tab);\n    if (!isRightPanelShown) {\n      setHasRightPanelToggled(true);\n    }\n  };\n\n  /**\n   * Checks if a specific tab is currently active (selected and panel is visible).\n   */\n  const isTabActive = (tab: ConversationTab) =>\n    isRightPanelShown && selectedTab === tab;\n\n  return {\n    selectTab,\n    navigateToTab,\n    isTabActive,\n    onTabChange,\n    selectedTab,\n    isRightPanelShown,\n  };\n}\n"],"mappings":"6LAeA,SAAgB,GAA2B,CACzC,GAAM,CAAE,kBAAmB,EAAA,kBAAkB,EACvC,CACJ,cACA,oBACA,0BACA,kBACE,EAAA,qBAAqB,EAEnB,CAAE,eAAgB,GACtB,EAAA,iCAAiC,CAAc,EAE3C,EAAe,GAAkC,CACrD,EAAe,CAAK,EACpB,EAAwB,CAAK,CAC/B,EAoCA,MAAO,CACL,UA9BiB,GAAyB,CACtC,IAAgB,GAAO,EACzB,EAAwB,EAAK,GAE7B,EAAY,CAAG,EACV,GACH,EAAwB,EAAI,EAGlC,EAsBE,cAfqB,GAAyB,CAC9C,EAAY,CAAG,EACV,GACH,EAAwB,EAAI,CAEhC,EAWE,YANmB,GACnB,GAAqB,IAAgB,EAMrC,cACA,cACA,mBACF,CACF"}
+{"version":3,"file":"use-select-conversation-tab.cjs","names":[],"sources":["../../src/hooks/use-select-conversation-tab.ts"],"sourcesContent":["import { useConversationLocalStorageState } from \"#/utils/conversation-local-storage\";\nimport {\n  useConversationStore,\n  type ConversationTab,\n} from \"#/stores/conversation-store\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\n\n/**\n * Custom hook for selecting conversation tabs with consistent behavior.\n *\n * Handles panel visibility and tab toggling logic. The selected tab is\n * persisted per conversation (so users land on the same tab when they\n * come back), but the drawer's open/closed state is intentionally\n * session-only — see `useConversationStore` for the rationale.\n */\nexport function useSelectConversationTab() {\n  const { conversationId } = useOptionalConversationId();\n  const {\n    selectedTab,\n    isRightPanelShown,\n    setHasRightPanelToggled,\n    setSelectedTab,\n  } = useConversationStore();\n\n  const { setSelectedTab: setPersistedSelectedTab } =\n    useConversationLocalStorageState(conversationId ?? \"\");\n\n  const onTabChange = (value: ConversationTab | null) => {\n    setSelectedTab(value);\n    setPersistedSelectedTab(value);\n  };\n\n  /**\n   * Selects a tab with proper panel visibility handling.\n   * - If clicking the same active tab while panel is open, closes the panel\n   * - If clicking a different tab or panel is closed, opens panel and selects tab\n   */\n  const selectTab = (tab: ConversationTab) => {\n    if (selectedTab === tab && isRightPanelShown) {\n      setHasRightPanelToggled(false);\n    } else {\n      onTabChange(tab);\n      if (!isRightPanelShown) {\n        setHasRightPanelToggled(true);\n      }\n    }\n  };\n\n  /**\n   * Navigates to a tab without toggle behavior.\n   * Always shows the panel and selects the tab, even if already selected.\n   * Use this for \"View\" or \"Read More\" buttons that should always navigate.\n   */\n  const navigateToTab = (tab: ConversationTab) => {\n    onTabChange(tab);\n    if (!isRightPanelShown) {\n      setHasRightPanelToggled(true);\n    }\n  };\n\n  /**\n   * Checks if a specific tab is currently active (selected and panel is visible).\n   */\n  const isTabActive = (tab: ConversationTab) =>\n    isRightPanelShown && selectedTab === tab;\n\n  return {\n    selectTab,\n    navigateToTab,\n    isTabActive,\n    onTabChange,\n    selectedTab,\n    isRightPanelShown,\n  };\n}\n"],"mappings":"6LAeA,SAAgB,GAA2B,CACzC,GAAM,CAAE,kBAAmB,EAAA,0BAA0B,EAC/C,CACJ,cACA,oBACA,0BACA,kBACE,EAAA,qBAAqB,EAEnB,CAAE,eAAgB,GACtB,EAAA,iCAAiC,GAAkB,EAAE,EAEjD,EAAe,GAAkC,CACrD,EAAe,CAAK,EACpB,EAAwB,CAAK,CAC/B,EAoCA,MAAO,CACL,UA9BiB,GAAyB,CACtC,IAAgB,GAAO,EACzB,EAAwB,EAAK,GAE7B,EAAY,CAAG,EACV,GACH,EAAwB,EAAI,EAGlC,EAsBE,cAfqB,GAAyB,CAC9C,EAAY,CAAG,EACV,GACH,EAAwB,EAAI,CAEhC,EAWE,YANmB,GACnB,GAAqB,IAAgB,EAMrC,cACA,cACA,mBACF,CACF"}

package/dist/hooks/use-select-conversation-tab.js

@@ -1,9 +1,9 @@
-import { useConversationId as e } from "./use-conversation-id.js";
+import { useOptionalConversationId as e } from "./use-conversation-id.js";
 import { useConversationLocalStorageState as t } from "../utils/conversation-local-storage.js";
 import { useConversationStore as n } from "../stores/conversation-store.js";
 //#region src/hooks/use-select-conversation-tab.ts
 function r() {
-	let { conversationId: r } = e(), { selectedTab: i, isRightPanelShown: a, setHasRightPanelToggled: o, setSelectedTab: s } = n(), { setSelectedTab: c } = t(r), l = (e) => {
+	let { conversationId: r } = e(), { selectedTab: i, isRightPanelShown: a, setHasRightPanelToggled: o, setSelectedTab: s } = n(), { setSelectedTab: c } = t(r ?? ""), l = (e) => {
 		s(e), c(e);
 	};
 	return {

package/dist/hooks/use-select-conversation-tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-select-conversation-tab.js","names":[],"sources":["../../src/hooks/use-select-conversation-tab.ts"],"sourcesContent":["import { useConversationLocalStorageState } from \"#/utils/conversation-local-storage\";\nimport {\n  useConversationStore,\n  type ConversationTab,\n} from \"#/stores/conversation-store\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\n\n/**\n * Custom hook for selecting conversation tabs with consistent behavior.\n *\n * Handles panel visibility and tab toggling logic. The selected tab is\n * persisted per conversation (so users land on the same tab when they\n * come back), but the drawer's open/closed state is intentionally\n * session-only — see `useConversationStore` for the rationale.\n */\nexport function useSelectConversationTab() {\n  const { conversationId } = useConversationId();\n  const {\n    selectedTab,\n    isRightPanelShown,\n    setHasRightPanelToggled,\n    setSelectedTab,\n  } = useConversationStore();\n\n  const { setSelectedTab: setPersistedSelectedTab } =\n    useConversationLocalStorageState(conversationId);\n\n  const onTabChange = (value: ConversationTab | null) => {\n    setSelectedTab(value);\n    setPersistedSelectedTab(value);\n  };\n\n  /**\n   * Selects a tab with proper panel visibility handling.\n   * - If clicking the same active tab while panel is open, closes the panel\n   * - If clicking a different tab or panel is closed, opens panel and selects tab\n   */\n  const selectTab = (tab: ConversationTab) => {\n    if (selectedTab === tab && isRightPanelShown) {\n      setHasRightPanelToggled(false);\n    } else {\n      onTabChange(tab);\n      if (!isRightPanelShown) {\n        setHasRightPanelToggled(true);\n      }\n    }\n  };\n\n  /**\n   * Navigates to a tab without toggle behavior.\n   * Always shows the panel and selects the tab, even if already selected.\n   * Use this for \"View\" or \"Read More\" buttons that should always navigate.\n   */\n  const navigateToTab = (tab: ConversationTab) => {\n    onTabChange(tab);\n    if (!isRightPanelShown) {\n      setHasRightPanelToggled(true);\n    }\n  };\n\n  /**\n   * Checks if a specific tab is currently active (selected and panel is visible).\n   */\n  const isTabActive = (tab: ConversationTab) =>\n    isRightPanelShown && selectedTab === tab;\n\n  return {\n    selectTab,\n    navigateToTab,\n    isTabActive,\n    onTabChange,\n    selectedTab,\n    isRightPanelShown,\n  };\n}\n"],"mappings":";;;;AAeA,SAAgB,IAA2B;CACzC,IAAM,EAAE,sBAAmB,EAAkB,GACvC,EACJ,gBACA,sBACA,4BACA,sBACE,EAAqB,GAEnB,EAAE,gBAAgB,MACtB,EAAiC,CAAc,GAE3C,KAAe,MAAkC;EAErD,AADA,EAAe,CAAK,GACpB,EAAwB,CAAK;CAC/B;CAoCA,OAAO;EACL,YA9BiB,MAAyB;GAC1C,AAAI,MAAgB,KAAO,IACzB,EAAwB,EAAK,KAE7B,EAAY,CAAG,GACV,KACH,EAAwB,EAAI;EAGlC;EAsBE,gBAfqB,MAAyB;GAE9C,AADA,EAAY,CAAG,GACV,KACH,EAAwB,EAAI;EAEhC;EAWE,cANmB,MACnB,KAAqB,MAAgB;EAMrC;EACA;EACA;CACF;AACF"}
+{"version":3,"file":"use-select-conversation-tab.js","names":[],"sources":["../../src/hooks/use-select-conversation-tab.ts"],"sourcesContent":["import { useConversationLocalStorageState } from \"#/utils/conversation-local-storage\";\nimport {\n  useConversationStore,\n  type ConversationTab,\n} from \"#/stores/conversation-store\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\n\n/**\n * Custom hook for selecting conversation tabs with consistent behavior.\n *\n * Handles panel visibility and tab toggling logic. The selected tab is\n * persisted per conversation (so users land on the same tab when they\n * come back), but the drawer's open/closed state is intentionally\n * session-only — see `useConversationStore` for the rationale.\n */\nexport function useSelectConversationTab() {\n  const { conversationId } = useOptionalConversationId();\n  const {\n    selectedTab,\n    isRightPanelShown,\n    setHasRightPanelToggled,\n    setSelectedTab,\n  } = useConversationStore();\n\n  const { setSelectedTab: setPersistedSelectedTab } =\n    useConversationLocalStorageState(conversationId ?? \"\");\n\n  const onTabChange = (value: ConversationTab | null) => {\n    setSelectedTab(value);\n    setPersistedSelectedTab(value);\n  };\n\n  /**\n   * Selects a tab with proper panel visibility handling.\n   * - If clicking the same active tab while panel is open, closes the panel\n   * - If clicking a different tab or panel is closed, opens panel and selects tab\n   */\n  const selectTab = (tab: ConversationTab) => {\n    if (selectedTab === tab && isRightPanelShown) {\n      setHasRightPanelToggled(false);\n    } else {\n      onTabChange(tab);\n      if (!isRightPanelShown) {\n        setHasRightPanelToggled(true);\n      }\n    }\n  };\n\n  /**\n   * Navigates to a tab without toggle behavior.\n   * Always shows the panel and selects the tab, even if already selected.\n   * Use this for \"View\" or \"Read More\" buttons that should always navigate.\n   */\n  const navigateToTab = (tab: ConversationTab) => {\n    onTabChange(tab);\n    if (!isRightPanelShown) {\n      setHasRightPanelToggled(true);\n    }\n  };\n\n  /**\n   * Checks if a specific tab is currently active (selected and panel is visible).\n   */\n  const isTabActive = (tab: ConversationTab) =>\n    isRightPanelShown && selectedTab === tab;\n\n  return {\n    selectTab,\n    navigateToTab,\n    isTabActive,\n    onTabChange,\n    selectedTab,\n    isRightPanelShown,\n  };\n}\n"],"mappings":";;;;AAeA,SAAgB,IAA2B;CACzC,IAAM,EAAE,sBAAmB,EAA0B,GAC/C,EACJ,gBACA,sBACA,4BACA,sBACE,EAAqB,GAEnB,EAAE,gBAAgB,MACtB,EAAiC,KAAkB,EAAE,GAEjD,KAAe,MAAkC;EAErD,AADA,EAAe,CAAK,GACpB,EAAwB,CAAK;CAC/B;CAoCA,OAAO;EACL,YA9BiB,MAAyB;GAC1C,AAAI,MAAgB,KAAO,IACzB,EAAwB,EAAK,KAE7B,EAAY,CAAG,GACV,KACH,EAAwB,EAAI;EAGlC;EAsBE,gBAfqB,MAAyB;GAE9C,AADA,EAAY,CAAG,GACV,KACH,EAAwB,EAAI;EAEhC;EAWE,cANmB,MACnB,KAAqB,MAAgB;EAMrC;EACA;EACA;CACF;AACF"}