@openhands/agent-canvas 1.14.0 → 1.15.0

package/dist/components/features/conversation/conversation-overview-toggle.js

@@ -0,0 +1,99 @@
+import { useTranslation as e } from "../../../node_modules/react-i18next/dist/es/useTranslation.js";
+import { I18nKey as t } from "../../../i18n/declaration.js";
+import { Info as n } from "../../../node_modules/lucide-react/dist/esm/icons/info.js";
+import { cn as r } from "../../../utils/utils.js";
+import { useOptionalConversationId as i } from "../../../hooks/use-conversation-id.js";
+import { setConversationState as a } from "../../../utils/conversation-local-storage.js";
+import { useConversationStore as o } from "../../../stores/conversation-store.js";
+import { useIsArchivedConversation as s } from "../../../hooks/use-is-archived-conversation.js";
+import { ConversationOverviewPanel as c } from "./conversation-overview-panel.js";
+import { ChatActionTooltip as l } from "../chat/chat-action-tooltip.js";
+import { openConversationOverviewPanelPeek as u, scheduleCloseConversationOverviewPanelPeek as d, useSyncConversationOverviewPanelPeek as f } from "../../../hooks/use-conversation-overview-panel-peek.js";
+import { mobileTopBarIconButtonClassName as p } from "../../../utils/mobile-top-bar-icon-button-classes.js";
+import { useEffect as m, useLayoutEffect as h, useRef as g, useState as _ } from "react";
+import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
+import x from "react-dom";
+//#region src/components/features/conversation/conversation-overview-toggle.tsx
+function S({ className: S }) {
+	let { t: C } = e("openhands"), w = s(), { conversationId: T } = i(), E = g(null), [D, O] = _(null), { isOverviewPanelShown: k, isOverviewPanelPeeked: A, isRightPanelShown: j, setIsOverviewPanelShown: M, setHasRightPanelToggled: N, setIsRightPanelShown: P } = o();
+	f(), m(() => {
+		j && k && M(!1);
+	}, [
+		k,
+		j,
+		M
+	]);
+	let F = !w && j && !k, I = F && A;
+	h(() => {
+		if (!I) {
+			O(null);
+			return;
+		}
+		let e = () => {
+			let e = E.current?.getBoundingClientRect();
+			e && O({
+				top: e.bottom + 4,
+				left: Math.max(8, e.right - 240)
+			});
+		};
+		return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+			window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+		};
+	}, [I]);
+	let L = () => {
+		if (!w) {
+			if (j) {
+				N(!1), P(!1), T && a(T, { rightPanelShown: !1 }), M(!0);
+				return;
+			}
+			M(!k);
+		}
+	}, R = k || I, z = C(w ? t.CONVERSATION$UNAVAILABLE_FOR_ARCHIVES : k ? t.CONVERSATION$HIDE_OVERVIEW : t.CONVERSATION$SHOW_OVERVIEW), B = I && D ? x.createPortal(/* @__PURE__ */ y("div", {
+		"data-testid": "conversation-overview-peek",
+		className: "fixed z-50",
+		style: {
+			top: D.top,
+			left: D.left,
+			width: 240
+		},
+		onMouseEnter: u,
+		onMouseLeave: d,
+		children: /* @__PURE__ */ y("div", {
+			className: "shadow-lg",
+			children: /* @__PURE__ */ y(c, {})
+		})
+	}), document.body) : null;
+	return /* @__PURE__ */ b(v, { children: [/* @__PURE__ */ y("div", {
+		ref: E,
+		className: "relative inline-flex items-center self-center",
+		onMouseEnter: () => {
+			F && u();
+		},
+		onMouseLeave: () => {
+			(F || A) && d();
+		},
+		children: /* @__PURE__ */ y(l, {
+			tooltip: z,
+			ariaLabel: z,
+			children: /* @__PURE__ */ y("button", {
+				type: "button",
+				onClick: L,
+				disabled: w,
+				className: r(p, "size-7", R && "bg-white/10 text-[var(--oh-foreground)]", w && "cursor-not-allowed opacity-50 hover:bg-transparent hover:text-[var(--oh-muted)]", S),
+				"aria-label": z,
+				"aria-pressed": k,
+				"aria-disabled": w,
+				"data-testid": "conversation-overview-toggle",
+				children: /* @__PURE__ */ y(n, {
+					className: "h-4 w-4 shrink-0",
+					size: 16,
+					"aria-hidden": !0
+				})
+			})
+		})
+	}), B] });
+}
+//#endregion
+export { S as ConversationOverviewToggle };
+
+//# sourceMappingURL=conversation-overview-toggle.js.map

package/dist/components/features/conversation/conversation-overview-toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation-overview-toggle.js","names":[],"sources":["../../../../src/components/features/conversation/conversation-overview-toggle.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { Info } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport {\n  openConversationOverviewPanelPeek,\n  scheduleCloseConversationOverviewPanelPeek,\n  useSyncConversationOverviewPanelPeek,\n} from \"#/hooks/use-conversation-overview-panel-peek\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { cn } from \"#/utils/utils\";\nimport { mobileTopBarIconButtonClassName } from \"#/utils/mobile-top-bar-icon-button-classes\";\nimport { ChatActionTooltip } from \"../chat/chat-action-tooltip\";\nimport { useIsArchivedConversation } from \"#/hooks/use-is-archived-conversation\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { setConversationState } from \"#/utils/conversation-local-storage\";\nimport { ConversationOverviewPanel } from \"./conversation-overview-panel\";\nimport { CONVERSATION_OVERVIEW_PANEL_WIDTH_PX } from \"./conversation-overview-panel.constants\";\n\ninterface ConversationOverviewToggleProps {\n  className?: string;\n}\n\n/**\n * Info toggle for the session-only overview panel beside the chat thread.\n * Opening overview closes the files/diffs drawer; the panel also auto-hides\n * when that drawer opens from elsewhere. While the drawer is open, hovering\n * this control peeks the overview as a portaled overlay.\n */\nexport function ConversationOverviewToggle({\n  className,\n}: ConversationOverviewToggleProps) {\n  const { t } = useTranslation(\"openhands\");\n  const isArchivedConversation = useIsArchivedConversation();\n  const { conversationId } = useOptionalConversationId();\n  const triggerRef = useRef<HTMLDivElement>(null);\n  const [peekPosition, setPeekPosition] = useState<{\n    top: number;\n    left: number;\n  } | null>(null);\n  const {\n    isOverviewPanelShown,\n    isOverviewPanelPeeked,\n    isRightPanelShown,\n    setIsOverviewPanelShown,\n    setHasRightPanelToggled,\n    setIsRightPanelShown,\n  } = useConversationStore();\n\n  useSyncConversationOverviewPanelPeek();\n\n  useEffect(() => {\n    if (isRightPanelShown && isOverviewPanelShown) {\n      setIsOverviewPanelShown(false);\n    }\n  }, [isOverviewPanelShown, isRightPanelShown, setIsOverviewPanelShown]);\n\n  const canPeekOnHover =\n    !isArchivedConversation && isRightPanelShown && !isOverviewPanelShown;\n  const showPeek = canPeekOnHover && isOverviewPanelPeeked;\n\n  useLayoutEffect(() => {\n    if (!showPeek) {\n      setPeekPosition(null);\n      return undefined;\n    }\n\n    const updatePosition = () => {\n      const rect = triggerRef.current?.getBoundingClientRect();\n      if (!rect) {\n        return;\n      }\n\n      setPeekPosition({\n        top: rect.bottom + 4,\n        left: Math.max(8, rect.right - CONVERSATION_OVERVIEW_PANEL_WIDTH_PX),\n      });\n    };\n\n    updatePosition();\n    window.addEventListener(\"resize\", updatePosition);\n    window.addEventListener(\"scroll\", updatePosition, true);\n    return () => {\n      window.removeEventListener(\"resize\", updatePosition);\n      window.removeEventListener(\"scroll\", updatePosition, true);\n    };\n  }, [showPeek]);\n\n  const handleToggle = () => {\n    if (isArchivedConversation) {\n      return;\n    }\n\n    // Reveal overview by closing the files/diffs drawer first; otherwise the\n    // mutual-exclusion effect above would immediately hide overview again.\n    if (isRightPanelShown) {\n      setHasRightPanelToggled(false);\n      setIsRightPanelShown(false);\n      if (conversationId) {\n        setConversationState(conversationId, { rightPanelShown: false });\n      }\n      setIsOverviewPanelShown(true);\n      return;\n    }\n\n    setIsOverviewPanelShown(!isOverviewPanelShown);\n  };\n\n  const isOverviewVisible = isOverviewPanelShown || showPeek;\n\n  const tooltipText = isArchivedConversation\n    ? t(I18nKey.CONVERSATION$UNAVAILABLE_FOR_ARCHIVES)\n    : isOverviewPanelShown\n      ? t(I18nKey.CONVERSATION$HIDE_OVERVIEW)\n      : t(I18nKey.CONVERSATION$SHOW_OVERVIEW);\n\n  const peek =\n    showPeek && peekPosition\n      ? ReactDOM.createPortal(\n          <div\n            data-testid=\"conversation-overview-peek\"\n            className=\"fixed z-50\"\n            style={{\n              top: peekPosition.top,\n              left: peekPosition.left,\n              width: CONVERSATION_OVERVIEW_PANEL_WIDTH_PX,\n            }}\n            onMouseEnter={openConversationOverviewPanelPeek}\n            onMouseLeave={scheduleCloseConversationOverviewPanelPeek}\n          >\n            <div className=\"shadow-lg\">\n              <ConversationOverviewPanel />\n            </div>\n          </div>,\n          document.body,\n        )\n      : null;\n\n  return (\n    <>\n      <div\n        ref={triggerRef}\n        className=\"relative inline-flex items-center self-center\"\n        onMouseEnter={() => {\n          if (canPeekOnHover) {\n            openConversationOverviewPanelPeek();\n          }\n        }}\n        onMouseLeave={() => {\n          if (canPeekOnHover || isOverviewPanelPeeked) {\n            scheduleCloseConversationOverviewPanelPeek();\n          }\n        }}\n      >\n        <ChatActionTooltip tooltip={tooltipText} ariaLabel={tooltipText}>\n          <button\n            type=\"button\"\n            onClick={handleToggle}\n            disabled={isArchivedConversation}\n            className={cn(\n              // Match RightPanelToggle hit target (p-1 + size-5 = 28px) while\n              // keeping the smaller Info glyph.\n              mobileTopBarIconButtonClassName,\n              \"size-7\",\n              isOverviewVisible && \"bg-white/10 text-[var(--oh-foreground)]\",\n              isArchivedConversation &&\n                \"cursor-not-allowed opacity-50 hover:bg-transparent hover:text-[var(--oh-muted)]\",\n              className,\n            )}\n            aria-label={tooltipText}\n            aria-pressed={isOverviewPanelShown}\n            aria-disabled={isArchivedConversation}\n            data-testid=\"conversation-overview-toggle\"\n          >\n            <Info className=\"h-4 w-4 shrink-0\" size={16} aria-hidden />\n          </button>\n        </ChatActionTooltip>\n      </div>\n      {peek}\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AA8BA,SAAgB,EAA2B,EACzC,gBACkC;CAClC,IAAM,EAAE,SAAM,EAAe,WAAW,GAClC,IAAyB,EAA0B,GACnD,EAAE,sBAAmB,EAA0B,GAC/C,IAAa,EAAuB,IAAI,GACxC,CAAC,GAAc,KAAmB,EAG9B,IAAI,GACR,EACJ,yBACA,0BACA,sBACA,4BACA,4BACA,4BACE,EAAqB;CAIzB,AAFA,EAAqC,GAErC,QAAgB;EACd,AAAI,KAAqB,KACvB,EAAwB,EAAK;CAEjC,GAAG;EAAC;EAAsB;EAAmB;CAAuB,CAAC;CAErE,IAAM,IACJ,CAAC,KAA0B,KAAqB,CAAC,GAC7C,IAAW,KAAkB;CAEnC,QAAsB;EACpB,IAAI,CAAC,GAAU;GACb,EAAgB,IAAI;GACpB;EACF;EAEA,IAAM,UAAuB;GAC3B,IAAM,IAAO,EAAW,SAAS,sBAAsB;GAClD,KAIL,EAAgB;IACd,KAAK,EAAK,SAAS;IACnB,MAAM,KAAK,IAAI,GAAG,EAAK,QAAA,GAA4C;GACrE,CAAC;EACH;EAKA,OAHA,EAAe,GACf,OAAO,iBAAiB,UAAU,CAAc,GAChD,OAAO,iBAAiB,UAAU,GAAgB,EAAI,SACzC;GAEX,AADA,OAAO,oBAAoB,UAAU,CAAc,GACnD,OAAO,oBAAoB,UAAU,GAAgB,EAAI;EAC3D;CACF,GAAG,CAAC,CAAQ,CAAC;CAEb,IAAM,UAAqB;EACrB,QAMJ;OAAI,GAAmB;IAMrB,AALA,EAAwB,EAAK,GAC7B,EAAqB,EAAK,GACtB,KACF,EAAqB,GAAgB,EAAE,iBAAiB,GAAM,CAAC,GAEjE,EAAwB,EAAI;IAC5B;GACF;GAEA,EAAwB,CAAC,CAAoB;EAF7C;CAGF,GAEM,IAAoB,KAAwB,GAE5C,IACF,EADgB,IACd,EAAQ,wCACV,IACI,EAAQ,6BACR,EAAQ,0BAA0B,GAEpC,IACJ,KAAY,IACR,EAAS,aACP,kBAAC,OAAD;EACE,eAAY;EACZ,WAAU;EACV,OAAO;GACL,KAAK,EAAa;GAClB,MAAM,EAAa;GACnB,OAAA;EACF;EACA,cAAc;EACd,cAAc;YAEd,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,GAAD,CAA4B,CAAA;EACzB,CAAA;CACF,CAAA,GACL,SAAS,IACX,IACA;CAEN,OACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD;EACE,KAAK;EACL,WAAU;EACV,oBAAoB;GAClB,AAAI,KACF,EAAkC;EAEtC;EACA,oBAAoB;GAClB,CAAI,KAAkB,MACpB,EAA2C;EAE/C;YAEA,kBAAC,GAAD;GAAmB,SAAS;GAAa,WAAW;aAClD,kBAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU;IACV,WAAW,EAGT,GACA,UACA,KAAqB,2CACrB,KACE,mFACF,CACF;IACA,cAAY;IACZ,gBAAc;IACd,iBAAe;IACf,eAAY;cAEZ,kBAAC,GAAD;KAAM,WAAU;KAAmB,MAAM;KAAI,eAAA;IAAa,CAAA;GACpD,CAAA;EACS,CAAA;CAChB,CAAA,GACJ,CACD,EAAA,CAAA;AAEN"}

package/dist/components/features/conversation/conversation-secondary-drawer.classes.cjs

@@ -0,0 +1,2 @@
+require("../../../_virtual/_rolldown/runtime.cjs");const e=require("../../../utils/utils.cjs");var t=e.cn(`flex h-10 min-h-10 shrink-0 items-center gap-1.5`,`border-b border-[var(--oh-border)] py-1 pl-1 pr-4`),n=e.cn(`h-7 min-h-7 shrink-0 whitespace-nowrap px-2.5 text-xs`),r=e.cn(`inline-flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-md`,`text-muted transition-colors hover:bg-white/10 hover:text-white`);exports.CONVERSATION_SECONDARY_DRAWER_CLOSE_BUTTON_CLASSNAME=r,exports.CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME=n,exports.CONVERSATION_SECONDARY_DRAWER_HEADER_CLASSNAME=t;
+//# sourceMappingURL=conversation-secondary-drawer.classes.cjs.map

package/dist/components/features/conversation/conversation-secondary-drawer.classes.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation-secondary-drawer.classes.cjs","names":[],"sources":["../../../../src/components/features/conversation/conversation-secondary-drawer.classes.ts"],"sourcesContent":["import { cn } from \"#/utils/utils\";\n\n/** Matches conversation tabs chrome height; right inset aligns with drawer body `px-4`. */\nexport const CONVERSATION_SECONDARY_DRAWER_HEADER_CLASSNAME = cn(\n  \"flex h-10 min-h-10 shrink-0 items-center gap-1.5\",\n  \"border-b border-[var(--oh-border)] py-1 pl-1 pr-4\",\n);\n\nexport const CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME = cn(\n  \"h-7 min-h-7 shrink-0 whitespace-nowrap px-2.5 text-xs\",\n);\n\nexport const CONVERSATION_SECONDARY_DRAWER_CLOSE_BUTTON_CLASSNAME = cn(\n  \"inline-flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-md\",\n  \"text-muted transition-colors hover:bg-white/10 hover:text-white\",\n);\n"],"mappings":"+FAGA,IAAa,EAAiD,EAAA,GAC5D,mDACA,mDACF,EAEa,EAAwD,EAAA,GACnE,uDACF,EAEa,EAAuD,EAAA,GAClE,oFACA,iEACF"}

package/dist/components/features/conversation/conversation-secondary-drawer.classes.d.ts

@@ -0,0 +1,4 @@
+/** Matches conversation tabs chrome height; right inset aligns with drawer body `px-4`. */
+export declare const CONVERSATION_SECONDARY_DRAWER_HEADER_CLASSNAME: string;
+export declare const CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME: string;
+export declare const CONVERSATION_SECONDARY_DRAWER_CLOSE_BUTTON_CLASSNAME: string;

package/dist/components/features/conversation/conversation-secondary-drawer.classes.js

@@ -0,0 +1,7 @@
+import { cn as e } from "../../../utils/utils.js";
+//#region src/components/features/conversation/conversation-secondary-drawer.classes.ts
+var t = e("flex h-10 min-h-10 shrink-0 items-center gap-1.5", "border-b border-[var(--oh-border)] py-1 pl-1 pr-4"), n = e("h-7 min-h-7 shrink-0 whitespace-nowrap px-2.5 text-xs"), r = e("inline-flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-md", "text-muted transition-colors hover:bg-white/10 hover:text-white");
+//#endregion
+export { r as CONVERSATION_SECONDARY_DRAWER_CLOSE_BUTTON_CLASSNAME, n as CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME, t as CONVERSATION_SECONDARY_DRAWER_HEADER_CLASSNAME };
+
+//# sourceMappingURL=conversation-secondary-drawer.classes.js.map

package/dist/components/features/conversation/conversation-secondary-drawer.classes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation-secondary-drawer.classes.js","names":[],"sources":["../../../../src/components/features/conversation/conversation-secondary-drawer.classes.ts"],"sourcesContent":["import { cn } from \"#/utils/utils\";\n\n/** Matches conversation tabs chrome height; right inset aligns with drawer body `px-4`. */\nexport const CONVERSATION_SECONDARY_DRAWER_HEADER_CLASSNAME = cn(\n  \"flex h-10 min-h-10 shrink-0 items-center gap-1.5\",\n  \"border-b border-[var(--oh-border)] py-1 pl-1 pr-4\",\n);\n\nexport const CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME = cn(\n  \"h-7 min-h-7 shrink-0 whitespace-nowrap px-2.5 text-xs\",\n);\n\nexport const CONVERSATION_SECONDARY_DRAWER_CLOSE_BUTTON_CLASSNAME = cn(\n  \"inline-flex size-7 shrink-0 cursor-pointer items-center justify-center rounded-md\",\n  \"text-muted transition-colors hover:bg-white/10 hover:text-white\",\n);\n"],"mappings":";;AAGA,IAAa,IAAiD,EAC5D,oDACA,mDACF,GAEa,IAAwD,EACnE,uDACF,GAEa,IAAuD,EAClE,qFACA,iEACF"}

package/dist/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.cjs

@@ -1,2 +1,2 @@
-require("../../../../../_virtual/_rolldown/runtime.cjs");const e=require("../../../../../hooks/use-conversation-id.cjs"),t=require("../../../../../stores/conversation-store.cjs"),n=require("./tab-wrapper.cjs"),r=require("./tab-container.cjs"),i=require("./tab-content-area.cjs"),a=require("./conversation-tab-content-crossfade.cjs");let o=require("react"),s=require("react/jsx-runtime");var c=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/files-tab.cjs"))),l=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/browser-tab.cjs"))),u=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/planner-tab.cjs"))),d=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/task-list-tab.cjs"))),f=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/usage-tab.cjs"))),p=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../terminal/terminal.cjs"))),m={tasklist:{component:d},files:{component:c},browser:{component:l},terminal:{component:p},planner:{component:u},usage:{component:f}};function h(){let{selectedTab:c,shouldShownAgentLoading:l}=t.useConversationStore(),{conversationId:u}=e.useConversationId(),d=(0,o.useMemo)(()=>m[c]??m.files,[c]).component,f=c===`terminal`?`${c}-${u}`:c??`files`;return(0,s.jsx)(r.TabContainer,{children:(0,s.jsx)(i.TabContentArea,{children:(0,s.jsx)(a.ConversationTabContentCrossfade,{showAgentLoading:l,tabKey:f,children:(0,s.jsx)(n.TabWrapper,{children:(0,s.jsx)(d,{})},f)})})})}exports.ConversationTabContent=h;
+require("../../../../../_virtual/_rolldown/runtime.cjs");const e=require("../../../../../hooks/use-conversation-id.cjs"),t=require("../../../../../stores/conversation-store.cjs"),n=require("./tab-wrapper.cjs"),r=require("./tab-container.cjs"),i=require("./tab-content-area.cjs"),a=require("./conversation-tab-content-crossfade.cjs");let o=require("react"),s=require("react/jsx-runtime");var c=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/files-tab.cjs"))),l=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/commits-tab.cjs"))),u=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/browser-tab.cjs"))),d=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/planner-tab.cjs"))),f=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/task-list-tab.cjs"))),p=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../../../routes/usage-tab.cjs"))),m=(0,o.lazy)(()=>Promise.resolve().then(()=>require("../../../terminal/terminal.cjs"))),h={tasklist:{component:f},files:{component:c},commits:{component:l},browser:{component:u},terminal:{component:m},planner:{component:d},usage:{component:p}};function g(){let{selectedTab:c,shouldShownAgentLoading:l}=t.useConversationStore(),{conversationId:u}=e.useConversationId(),d=(0,o.useMemo)(()=>h[c]??h.files,[c]).component,f=c===`terminal`?`${c}-${u}`:c??`files`;return(0,s.jsx)(r.TabContainer,{children:(0,s.jsx)(i.TabContentArea,{children:(0,s.jsx)(a.ConversationTabContentCrossfade,{showAgentLoading:l,tabKey:f,children:(0,s.jsx)(n.TabWrapper,{children:(0,s.jsx)(d,{})},f)})})})}exports.ConversationTabContent=g;
 //# sourceMappingURL=conversation-tab-content.cjs.map

package/dist/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"conversation-tab-content.cjs","names":[],"sources":["../../../../../../src/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.tsx"],"sourcesContent":["import { lazy, useMemo } from \"react\";\nimport { TabWrapper } from \"./tab-wrapper\";\nimport { TabContainer } from \"./tab-container\";\nimport { TabContentArea } from \"./tab-content-area\";\nimport { ConversationTabContentCrossfade } from \"./conversation-tab-content-crossfade\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\n\n// Lazy load all tab components, including the terminal — xterm + addon-fit +\n// xterm.css are large enough that we don't want them in the conversation\n// route's eager graph just because the terminal tab might be selected later.\nconst FilesTab = lazy(() => import(\"#/routes/files-tab\"));\nconst BrowserTab = lazy(() => import(\"#/routes/browser-tab\"));\nconst PlannerTab = lazy(() => import(\"#/routes/planner-tab\"));\nconst TaskListTab = lazy(() => import(\"#/routes/task-list-tab\"));\nconst UsageTab = lazy(() => import(\"#/routes/usage-tab\"));\nconst Terminal = lazy(() => import(\"#/components/features/terminal/terminal\"));\n\nconst TAB_CONFIG = {\n  tasklist: { component: TaskListTab },\n  files: { component: FilesTab },\n  browser: { component: BrowserTab },\n  terminal: { component: Terminal },\n  planner: { component: PlannerTab },\n  usage: { component: UsageTab },\n};\n\nexport function ConversationTabContent() {\n  const { selectedTab, shouldShownAgentLoading } = useConversationStore();\n  const { conversationId } = useConversationId();\n\n  const activeTab = useMemo(\n    () =>\n      TAB_CONFIG[selectedTab as keyof typeof TAB_CONFIG] ?? TAB_CONFIG.files,\n    [selectedTab],\n  );\n\n  const ActiveComponent = activeTab.component;\n\n  const tabWrapperKey =\n    selectedTab === \"terminal\"\n      ? `${selectedTab}-${conversationId}`\n      : (selectedTab ?? \"files\");\n\n  return (\n    <TabContainer>\n      <TabContentArea>\n        <ConversationTabContentCrossfade\n          showAgentLoading={shouldShownAgentLoading}\n          tabKey={tabWrapperKey}\n        >\n          <TabWrapper key={tabWrapperKey}>\n            <ActiveComponent />\n          </TabWrapper>\n        </ConversationTabContentCrossfade>\n      </TabContentArea>\n    </TabContainer>\n  );\n}\n"],"mappings":"mYAWA,IAAM,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAsB,qCAAA,CAAA,CAA4B,EAClD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAwB,uCAAA,CAAA,CAA8B,EACtD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAwB,uCAAA,CAAA,CAA8B,EACtD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAyB,yCAAA,CAAA,CAAgC,EACzD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAsB,qCAAA,CAAA,CAA4B,EAClD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAsB,gCAAA,CAAA,CAAiD,EAEvE,EAAa,CACjB,SAAU,CAAE,UAAW,CAAY,EACnC,MAAO,CAAE,UAAW,CAAS,EAC7B,QAAS,CAAE,UAAW,CAAW,EACjC,SAAU,CAAE,UAAW,CAAS,EAChC,QAAS,CAAE,UAAW,CAAW,EACjC,MAAO,CAAE,UAAW,CAAS,CAC/B,EAEA,SAAgB,GAAyB,CACvC,GAAM,CAAE,cAAa,2BAA4B,EAAA,qBAAqB,EAChE,CAAE,kBAAmB,EAAA,kBAAkB,EAQvC,GAAA,EAAA,EAAA,aAJF,EAAW,IAA2C,EAAW,MACnE,CAAC,CAAW,CAGU,EAAU,UAE5B,EACJ,IAAgB,WACZ,GAAG,EAAY,GAAG,IACjB,GAAe,QAEtB,OACE,EAAA,EAAA,KAAC,EAAA,aAAD,CAAA,UACE,EAAA,EAAA,KAAC,EAAA,eAAD,CAAA,UACE,EAAA,EAAA,KAAC,EAAA,gCAAD,CACE,iBAAkB,EAClB,OAAQ,YAER,EAAA,EAAA,KAAC,EAAA,WAAD,CAAA,UACE,EAAA,EAAA,KAAC,EAAD,CAAkB,CAAA,CACR,EAFK,CAEL,CACmB,CAAA,CACnB,CAAA,CACJ,CAAA,CAElB"}
+{"version":3,"file":"conversation-tab-content.cjs","names":[],"sources":["../../../../../../src/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.tsx"],"sourcesContent":["import { lazy, useMemo } from \"react\";\nimport { TabWrapper } from \"./tab-wrapper\";\nimport { TabContainer } from \"./tab-container\";\nimport { TabContentArea } from \"./tab-content-area\";\nimport { ConversationTabContentCrossfade } from \"./conversation-tab-content-crossfade\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\n\n// Lazy load all tab components, including the terminal — xterm + addon-fit +\n// xterm.css are large enough that we don't want them in the conversation\n// route's eager graph just because the terminal tab might be selected later.\nconst FilesTab = lazy(() => import(\"#/routes/files-tab\"));\nconst CommitsTab = lazy(() => import(\"#/routes/commits-tab\"));\nconst BrowserTab = lazy(() => import(\"#/routes/browser-tab\"));\nconst PlannerTab = lazy(() => import(\"#/routes/planner-tab\"));\nconst TaskListTab = lazy(() => import(\"#/routes/task-list-tab\"));\nconst UsageTab = lazy(() => import(\"#/routes/usage-tab\"));\nconst Terminal = lazy(() => import(\"#/components/features/terminal/terminal\"));\n\nconst TAB_CONFIG = {\n  tasklist: { component: TaskListTab },\n  files: { component: FilesTab },\n  commits: { component: CommitsTab },\n  browser: { component: BrowserTab },\n  terminal: { component: Terminal },\n  planner: { component: PlannerTab },\n  usage: { component: UsageTab },\n};\n\nexport function ConversationTabContent() {\n  const { selectedTab, shouldShownAgentLoading } = useConversationStore();\n  const { conversationId } = useConversationId();\n\n  const activeTab = useMemo(\n    () =>\n      TAB_CONFIG[selectedTab as keyof typeof TAB_CONFIG] ?? TAB_CONFIG.files,\n    [selectedTab],\n  );\n\n  const ActiveComponent = activeTab.component;\n\n  const tabWrapperKey =\n    selectedTab === \"terminal\"\n      ? `${selectedTab}-${conversationId}`\n      : (selectedTab ?? \"files\");\n\n  return (\n    <TabContainer>\n      <TabContentArea>\n        <ConversationTabContentCrossfade\n          showAgentLoading={shouldShownAgentLoading}\n          tabKey={tabWrapperKey}\n        >\n          <TabWrapper key={tabWrapperKey}>\n            <ActiveComponent />\n          </TabWrapper>\n        </ConversationTabContentCrossfade>\n      </TabContentArea>\n    </TabContainer>\n  );\n}\n"],"mappings":"mYAWA,IAAM,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAsB,qCAAA,CAAA,CAA4B,EAClD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAwB,uCAAA,CAAA,CAA8B,EACtD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAwB,uCAAA,CAAA,CAA8B,EACtD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAwB,uCAAA,CAAA,CAA8B,EACtD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAyB,yCAAA,CAAA,CAAgC,EACzD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAsB,qCAAA,CAAA,CAA4B,EAClD,GAAA,EAAA,EAAA,UAAA,QAAA,QAAA,EAAA,SAAA,QAAsB,gCAAA,CAAA,CAAiD,EAEvE,EAAa,CACjB,SAAU,CAAE,UAAW,CAAY,EACnC,MAAO,CAAE,UAAW,CAAS,EAC7B,QAAS,CAAE,UAAW,CAAW,EACjC,QAAS,CAAE,UAAW,CAAW,EACjC,SAAU,CAAE,UAAW,CAAS,EAChC,QAAS,CAAE,UAAW,CAAW,EACjC,MAAO,CAAE,UAAW,CAAS,CAC/B,EAEA,SAAgB,GAAyB,CACvC,GAAM,CAAE,cAAa,2BAA4B,EAAA,qBAAqB,EAChE,CAAE,kBAAmB,EAAA,kBAAkB,EAQvC,GAAA,EAAA,EAAA,aAJF,EAAW,IAA2C,EAAW,MACnE,CAAC,CAAW,CAGU,EAAU,UAE5B,EACJ,IAAgB,WACZ,GAAG,EAAY,GAAG,IACjB,GAAe,QAEtB,OACE,EAAA,EAAA,KAAC,EAAA,aAAD,CAAA,UACE,EAAA,EAAA,KAAC,EAAA,eAAD,CAAA,UACE,EAAA,EAAA,KAAC,EAAA,gCAAD,CACE,iBAAkB,EAClB,OAAQ,YAER,EAAA,EAAA,KAAC,EAAA,WAAD,CAAA,UACE,EAAA,EAAA,KAAC,EAAD,CAAkB,CAAA,CACR,EAFK,CAEL,CACmB,CAAA,CACnB,CAAA,CACJ,CAAA,CAElB"}

package/dist/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.js

@@ -7,16 +7,17 @@ import { ConversationTabContentCrossfade as a } from "./conversation-tab-content
 import { lazy as o, useMemo as s } from "react";
 import { jsx as c } from "react/jsx-runtime";
 //#region src/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.tsx
-var l = o(() => import("../../../../../routes/files-tab.js")), u = o(() => import("../../../../../routes/browser-tab.js")), d = o(() => import("../../../../../routes/planner-tab.js")), f = o(() => import("../../../../../routes/task-list-tab.js")), p = o(() => import("../../../../../routes/usage-tab.js")), m = o(() => import("../../../terminal/terminal.js")), h = {
-	tasklist: { component: f },
+var l = o(() => import("../../../../../routes/files-tab.js")), u = o(() => import("../../../../../routes/commits-tab.js")), d = o(() => import("../../../../../routes/browser-tab.js")), f = o(() => import("../../../../../routes/planner-tab.js")), p = o(() => import("../../../../../routes/task-list-tab.js")), m = o(() => import("../../../../../routes/usage-tab.js")), h = o(() => import("../../../terminal/terminal.js")), g = {
+	tasklist: { component: p },
 	files: { component: l },
-	browser: { component: u },
-	terminal: { component: m },
-	planner: { component: d },
-	usage: { component: p }
+	commits: { component: u },
+	browser: { component: d },
+	terminal: { component: h },
+	planner: { component: f },
+	usage: { component: m }
 };
-function g() {
-	let { selectedTab: o, shouldShownAgentLoading: l } = t(), { conversationId: u } = e(), d = s(() => h[o] ?? h.files, [o]).component, f = o === "terminal" ? `${o}-${u}` : o ?? "files";
+function _() {
+	let { selectedTab: o, shouldShownAgentLoading: l } = t(), { conversationId: u } = e(), d = s(() => g[o] ?? g.files, [o]).component, f = o === "terminal" ? `${o}-${u}` : o ?? "files";
 	return /* @__PURE__ */ c(r, { children: /* @__PURE__ */ c(i, { children: /* @__PURE__ */ c(a, {
 		showAgentLoading: l,
 		tabKey: f,
@@ -24,6 +25,6 @@ function g() {
 	}) }) });
 }
 //#endregion
-export { g as ConversationTabContent };
+export { _ as ConversationTabContent };
 
 //# sourceMappingURL=conversation-tab-content.js.map

package/dist/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.js.map

@@ -1 +1 @@
-{"version":3,"file":"conversation-tab-content.js","names":[],"sources":["../../../../../../src/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.tsx"],"sourcesContent":["import { lazy, useMemo } from \"react\";\nimport { TabWrapper } from \"./tab-wrapper\";\nimport { TabContainer } from \"./tab-container\";\nimport { TabContentArea } from \"./tab-content-area\";\nimport { ConversationTabContentCrossfade } from \"./conversation-tab-content-crossfade\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\n\n// Lazy load all tab components, including the terminal — xterm + addon-fit +\n// xterm.css are large enough that we don't want them in the conversation\n// route's eager graph just because the terminal tab might be selected later.\nconst FilesTab = lazy(() => import(\"#/routes/files-tab\"));\nconst BrowserTab = lazy(() => import(\"#/routes/browser-tab\"));\nconst PlannerTab = lazy(() => import(\"#/routes/planner-tab\"));\nconst TaskListTab = lazy(() => import(\"#/routes/task-list-tab\"));\nconst UsageTab = lazy(() => import(\"#/routes/usage-tab\"));\nconst Terminal = lazy(() => import(\"#/components/features/terminal/terminal\"));\n\nconst TAB_CONFIG = {\n  tasklist: { component: TaskListTab },\n  files: { component: FilesTab },\n  browser: { component: BrowserTab },\n  terminal: { component: Terminal },\n  planner: { component: PlannerTab },\n  usage: { component: UsageTab },\n};\n\nexport function ConversationTabContent() {\n  const { selectedTab, shouldShownAgentLoading } = useConversationStore();\n  const { conversationId } = useConversationId();\n\n  const activeTab = useMemo(\n    () =>\n      TAB_CONFIG[selectedTab as keyof typeof TAB_CONFIG] ?? TAB_CONFIG.files,\n    [selectedTab],\n  );\n\n  const ActiveComponent = activeTab.component;\n\n  const tabWrapperKey =\n    selectedTab === \"terminal\"\n      ? `${selectedTab}-${conversationId}`\n      : (selectedTab ?? \"files\");\n\n  return (\n    <TabContainer>\n      <TabContentArea>\n        <ConversationTabContentCrossfade\n          showAgentLoading={shouldShownAgentLoading}\n          tabKey={tabWrapperKey}\n        >\n          <TabWrapper key={tabWrapperKey}>\n            <ActiveComponent />\n          </TabWrapper>\n        </ConversationTabContentCrossfade>\n      </TabContentArea>\n    </TabContainer>\n  );\n}\n"],"mappings":";;;;;;;;;AAWA,IAAM,IAAW,QAAW,OAAO,qCAAqB,GAClD,IAAa,QAAW,OAAO,uCAAuB,GACtD,IAAa,QAAW,OAAO,uCAAuB,GACtD,IAAc,QAAW,OAAO,yCAAyB,GACzD,IAAW,QAAW,OAAO,qCAAqB,GAClD,IAAW,QAAW,OAAO,gCAA0C,GAEvE,IAAa;CACjB,UAAU,EAAE,WAAW,EAAY;CACnC,OAAO,EAAE,WAAW,EAAS;CAC7B,SAAS,EAAE,WAAW,EAAW;CACjC,UAAU,EAAE,WAAW,EAAS;CAChC,SAAS,EAAE,WAAW,EAAW;CACjC,OAAO,EAAE,WAAW,EAAS;AAC/B;AAEA,SAAgB,IAAyB;CACvC,IAAM,EAAE,gBAAa,+BAA4B,EAAqB,GAChE,EAAE,sBAAmB,EAAkB,GAQvC,IANY,QAEd,EAAW,MAA2C,EAAW,OACnE,CAAC,CAAW,CAGU,EAAU,WAE5B,IACJ,MAAgB,aACZ,GAAG,EAAY,GAAG,MACjB,KAAe;CAEtB,OACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;EACE,kBAAkB;EAClB,QAAQ;YAER,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,CAAkB,CAAA,EACR,GAFK,CAEL;CACmB,CAAA,EACnB,CAAA,EACJ,CAAA;AAElB"}
+{"version":3,"file":"conversation-tab-content.js","names":[],"sources":["../../../../../../src/components/features/conversation/conversation-tabs/conversation-tab-content/conversation-tab-content.tsx"],"sourcesContent":["import { lazy, useMemo } from \"react\";\nimport { TabWrapper } from \"./tab-wrapper\";\nimport { TabContainer } from \"./tab-container\";\nimport { TabContentArea } from \"./tab-content-area\";\nimport { ConversationTabContentCrossfade } from \"./conversation-tab-content-crossfade\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\n\n// Lazy load all tab components, including the terminal — xterm + addon-fit +\n// xterm.css are large enough that we don't want them in the conversation\n// route's eager graph just because the terminal tab might be selected later.\nconst FilesTab = lazy(() => import(\"#/routes/files-tab\"));\nconst CommitsTab = lazy(() => import(\"#/routes/commits-tab\"));\nconst BrowserTab = lazy(() => import(\"#/routes/browser-tab\"));\nconst PlannerTab = lazy(() => import(\"#/routes/planner-tab\"));\nconst TaskListTab = lazy(() => import(\"#/routes/task-list-tab\"));\nconst UsageTab = lazy(() => import(\"#/routes/usage-tab\"));\nconst Terminal = lazy(() => import(\"#/components/features/terminal/terminal\"));\n\nconst TAB_CONFIG = {\n  tasklist: { component: TaskListTab },\n  files: { component: FilesTab },\n  commits: { component: CommitsTab },\n  browser: { component: BrowserTab },\n  terminal: { component: Terminal },\n  planner: { component: PlannerTab },\n  usage: { component: UsageTab },\n};\n\nexport function ConversationTabContent() {\n  const { selectedTab, shouldShownAgentLoading } = useConversationStore();\n  const { conversationId } = useConversationId();\n\n  const activeTab = useMemo(\n    () =>\n      TAB_CONFIG[selectedTab as keyof typeof TAB_CONFIG] ?? TAB_CONFIG.files,\n    [selectedTab],\n  );\n\n  const ActiveComponent = activeTab.component;\n\n  const tabWrapperKey =\n    selectedTab === \"terminal\"\n      ? `${selectedTab}-${conversationId}`\n      : (selectedTab ?? \"files\");\n\n  return (\n    <TabContainer>\n      <TabContentArea>\n        <ConversationTabContentCrossfade\n          showAgentLoading={shouldShownAgentLoading}\n          tabKey={tabWrapperKey}\n        >\n          <TabWrapper key={tabWrapperKey}>\n            <ActiveComponent />\n          </TabWrapper>\n        </ConversationTabContentCrossfade>\n      </TabContentArea>\n    </TabContainer>\n  );\n}\n"],"mappings":";;;;;;;;;AAWA,IAAM,IAAW,QAAW,OAAO,qCAAqB,GAClD,IAAa,QAAW,OAAO,uCAAuB,GACtD,IAAa,QAAW,OAAO,uCAAuB,GACtD,IAAa,QAAW,OAAO,uCAAuB,GACtD,IAAc,QAAW,OAAO,yCAAyB,GACzD,IAAW,QAAW,OAAO,qCAAqB,GAClD,IAAW,QAAW,OAAO,gCAA0C,GAEvE,IAAa;CACjB,UAAU,EAAE,WAAW,EAAY;CACnC,OAAO,EAAE,WAAW,EAAS;CAC7B,SAAS,EAAE,WAAW,EAAW;CACjC,SAAS,EAAE,WAAW,EAAW;CACjC,UAAU,EAAE,WAAW,EAAS;CAChC,SAAS,EAAE,WAAW,EAAW;CACjC,OAAO,EAAE,WAAW,EAAS;AAC/B;AAEA,SAAgB,IAAyB;CACvC,IAAM,EAAE,gBAAa,+BAA4B,EAAqB,GAChE,EAAE,sBAAmB,EAAkB,GAQvC,IANY,QAEd,EAAW,MAA2C,EAAW,OACnE,CAAC,CAAW,CAGU,EAAU,WAE5B,IACJ,MAAgB,aACZ,GAAG,EAAY,GAAG,MACjB,KAAe;CAEtB,OACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;EACE,kBAAkB;EAClB,QAAQ;YAER,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,CAAkB,CAAA,EACR,GAFK,CAEL;CACmB,CAAA,EACnB,CAAA,EACJ,CAAA;AAElB"}

package/dist/components/features/conversation/conversation-tabs/conversation-tabs-context-menu.cjs

@@ -1,2 +1,2 @@
-const e=require("../../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../../node_modules/react-i18next/dist/es/useTranslation.cjs"),n=require("../../../../i18n/declaration.cjs"),r=require("../../../../node_modules/lucide-react/dist/esm/icons/gauge.cjs"),i=require("../../../../node_modules/lucide-react/dist/esm/icons/globe.cjs"),a=require("../../../../node_modules/lucide-react/dist/esm/icons/list-todo.cjs"),o=require("../../../../node_modules/lucide-react/dist/esm/icons/square-chevron-right.cjs"),s=require("../../../../utils/utils.cjs"),c=require("../../../../hooks/use-conversation-id.cjs"),l=require("../../../../utils/conversation-local-storage.cjs"),u=require("../../../../stores/conversation-store.cjs"),d=require("../../../../contexts/active-backend-context.cjs"),f=require("../../../../utils/dropdown-classes.cjs"),p=require("../../../../ui/context-menu.cjs"),m=require("../../../../hooks/use-click-outside-element.cjs"),h=require("../../../../hooks/use-select-conversation-tab.cjs"),g=require("../../../../icons/document.cjs"),_=require("../../context-menu/archived-disabled-tooltip.cjs"),v=require("../../../../hooks/use-is-archived-conversation.cjs"),y=require("../../../../icons/double-check.cjs"),b=require("../../../../icons/pill.cjs"),x=require("../../../../icons/pill-fill.cjs"),S=require("../../../../hooks/use-task-list.cjs");let C=require("react");C=e.__toESM(C,1);let w=require("react/jsx-runtime"),T=require("react-dom");T=e.__toESM(T,1);function E({isOpen:e,onClose:E,ignoreOutsideClickRef:D,anchorRef:O}){let k=m.useClickOutsideElement(E,D),[A,j]=(0,C.useState)();(0,C.useLayoutEffect)(()=>{if(!e||!O?.current){j(void 0);return}let t=()=>{let e=O.current?.getBoundingClientRect();e&&j({position:`fixed`,zIndex:9999,top:e.bottom+8,left:e.left})};return t(),window.addEventListener(`resize`,t),window.addEventListener(`scroll`,t,!0),()=>{window.removeEventListener(`resize`,t),window.removeEventListener(`scroll`,t,!0)}},[e,O]);let{t:M}=t.useTranslation(`openhands`),{conversationId:N}=c.useConversationId(),{state:P,setUnpinnedTabs:F,setSelectedTab:I}=l.useConversationLocalStorageState(N),{selectedTab:L,isRightPanelShown:R,setSelectedTab:z}=u.useConversationStore(),{navigateToTab:B}=h.useSelectConversationTab(),{hasTaskList:V}=S.useTaskList(),{backend:H}=d.useActiveBackend(),U=v.useIsArchivedConversation(),W=[{tab:`planner`,icon:a.ListTodo,i18nKey:n.I18nKey.COMMON$PLANNER},{tab:`files`,icon:g.default,i18nKey:n.I18nKey.COMMON$FILES},{tab:`terminal`,icon:o.SquareChevronRight,i18nKey:n.I18nKey.COMMON$TERMINAL},{tab:`browser`,icon:i.Globe,i18nKey:n.I18nKey.COMMON$BROWSER},{tab:`usage`,icon:r.Gauge,i18nKey:n.I18nKey.COMMON$USAGE}];V&&W.unshift({tab:`tasklist`,icon:y.default,i18nKey:n.I18nKey.COMMON$TASK_LIST});let G=W.filter(({tab:e})=>e!==`planner`||H.kind===`cloud`),K=e=>{U||(B(e),E())},q=(e,t)=>{if(U){t.preventDefault(),t.stopPropagation();return}if(t.preventDefault(),t.stopPropagation(),P.unpinnedTabs.includes(e))F(P.unpinnedTabs.filter(t=>t!==e));else{let t=[...P.unpinnedTabs,e];if(F(t),L===e&&R){let n=G.find(({tab:n})=>n!==e&&!t.includes(n));n&&(z(n.tab),I(n.tab))}}};if(!e)return null;let J=!!(O?.current&&A),Y=(0,w.jsx)(p.ContextMenu,{ref:k,theme:J?`popover`:`default`,position:J?`none`:`bottom`,alignment:J?`none`:`left`,spacing:J?`none`:`default`,className:s.cn(`z-[9999] w-fit`,J?`mt-0`:`mt-2`),children:G.map(({tab:e,icon:t,i18nKey:r})=>{let i=!P.unpinnedTabs.includes(e);return(0,w.jsx)(`li`,{className:`list-none`,children:(0,w.jsx)(_.ArchivedDisabledTooltip,{isDisabled:U,children:(0,w.jsxs)(`div`,{className:s.cn(`group flex h-[30px] w-full min-w-0 items-stretch rounded`,!U&&`hover:bg-[var(--oh-interactive-hover)]`,U&&`opacity-50`),children:[(0,w.jsxs)(`button`,{type:`button`,"data-testid":`conversation-tabs-menu-open-${e}`,disabled:U,className:s.cn(`flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white`,f.dropdownInstantColorClassName,U?`cursor-not-allowed`:`cursor-pointer`),onClick:()=>K(e),children:[(0,w.jsx)(`span`,{className:f.dropdownMenuRowIconWrapperClassName,"aria-hidden":!0,children:(0,w.jsx)(t,{className:`h-4 w-4`})}),(0,w.jsx)(`span`,{className:`text-sm`,children:M(r)})]}),(0,w.jsx)(`button`,{type:`button`,"data-testid":`conversation-tabs-menu-pin-${e}`,disabled:U,className:s.cn(`flex shrink-0 items-center justify-center rounded-r px-2 text-white`,f.dropdownInstantColorClassName,U?`cursor-not-allowed`:`cursor-pointer hover:bg-white/10`),"aria-pressed":i,"aria-label":M(i?n.I18nKey.CONVERSATION$UNPIN_TAB:n.I18nKey.CONVERSATION$PIN_TAB),onClick:t=>q(e,t),children:i?(0,w.jsx)(`span`,{className:s.cn(`-mr-[5px] ml-auto`,f.dropdownMenuRowIconWrapperClassName),"aria-hidden":!0,children:(0,w.jsx)(x.default,{className:`h-7 w-7`})}):(0,w.jsx)(`span`,{className:s.cn(`ml-auto`,f.dropdownMenuRowIconWrapperClassName),"aria-hidden":!0,children:(0,w.jsx)(b.default,{className:`h-4.5 w-4.5`})})})]})})},e)})});return J&&A&&typeof document<`u`?T.default.createPortal((0,w.jsx)(`div`,{style:A,children:Y}),document.body):Y}exports.ConversationTabsContextMenu=E;
+const e=require("../../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../../node_modules/react-i18next/dist/es/useTranslation.cjs"),n=require("../../../../i18n/declaration.cjs"),r=require("../../../../node_modules/lucide-react/dist/esm/icons/gauge.cjs"),i=require("../../../../node_modules/lucide-react/dist/esm/icons/globe.cjs"),a=require("../../../../node_modules/lucide-react/dist/esm/icons/list-todo.cjs"),o=require("../../../../node_modules/lucide-react/dist/esm/icons/square-chevron-right.cjs"),s=require("../../../../utils/utils.cjs"),c=require("../../../../hooks/use-conversation-id.cjs"),l=require("../../../../utils/conversation-local-storage.cjs"),u=require("../../../../stores/conversation-store.cjs"),d=require("../../../../contexts/active-backend-context.cjs"),f=require("../../../../utils/dropdown-classes.cjs"),p=require("../../../../ui/context-menu.cjs"),m=require("../../../../hooks/use-click-outside-element.cjs"),h=require("../../../../hooks/use-select-conversation-tab.cjs"),g=require("../../../../icons/document.cjs"),_=require("../../context-menu/archived-disabled-tooltip.cjs"),v=require("../../../../hooks/use-is-archived-conversation.cjs"),y=require("../../../../node_modules/react-icons/lu/index.cjs"),b=require("../../../../icons/pill.cjs"),x=require("../../../../icons/pill-fill.cjs"),S=require("../../../../icons/double-check.cjs"),C=require("../../../../hooks/use-task-list.cjs");let w=require("react");w=e.__toESM(w,1);let T=require("react/jsx-runtime"),E=require("react-dom");E=e.__toESM(E,1);function D({isOpen:e,onClose:D,ignoreOutsideClickRef:O,anchorRef:k}){let A=m.useClickOutsideElement(D,O),[j,M]=(0,w.useState)();(0,w.useLayoutEffect)(()=>{if(!e||!k?.current){M(void 0);return}let t=()=>{let e=k.current?.getBoundingClientRect();e&&M({position:`fixed`,zIndex:9999,top:e.bottom+8,left:e.left})};return t(),window.addEventListener(`resize`,t),window.addEventListener(`scroll`,t,!0),()=>{window.removeEventListener(`resize`,t),window.removeEventListener(`scroll`,t,!0)}},[e,k]);let{t:N}=t.useTranslation(`openhands`),{conversationId:P}=c.useConversationId(),{state:F,setUnpinnedTabs:I,setSelectedTab:L}=l.useConversationLocalStorageState(P),{selectedTab:R,isRightPanelShown:z,setSelectedTab:B}=u.useConversationStore(),{navigateToTab:V}=h.useSelectConversationTab(),{hasTaskList:H}=C.useTaskList(),{backend:U}=d.useActiveBackend(),W=v.useIsArchivedConversation(),G=[{tab:`planner`,icon:a.ListTodo,i18nKey:n.I18nKey.COMMON$PLANNER},{tab:`files`,icon:g.default,i18nKey:n.I18nKey.COMMON$FILES},{tab:`commits`,icon:y.LuFileDiff,i18nKey:n.I18nKey.DIFF_VIEWER$COMMITS},{tab:`terminal`,icon:o.SquareChevronRight,i18nKey:n.I18nKey.COMMON$TERMINAL},{tab:`browser`,icon:i.Globe,i18nKey:n.I18nKey.COMMON$BROWSER},{tab:`usage`,icon:r.Gauge,i18nKey:n.I18nKey.COMMON$USAGE}];H&&G.unshift({tab:`tasklist`,icon:S.default,i18nKey:n.I18nKey.COMMON$TASK_LIST});let K=G.filter(({tab:e})=>e!==`planner`||U.kind===`cloud`),q=e=>{W||(V(e),D())},J=(e,t)=>{if(W){t.preventDefault(),t.stopPropagation();return}if(t.preventDefault(),t.stopPropagation(),F.unpinnedTabs.includes(e))I(F.unpinnedTabs.filter(t=>t!==e));else{let t=[...F.unpinnedTabs,e];if(I(t),R===e&&z){let n=K.find(({tab:n})=>n!==e&&!t.includes(n));n&&(B(n.tab),L(n.tab))}}};if(!e)return null;let Y=!!(k?.current&&j),X=(0,T.jsx)(p.ContextMenu,{ref:A,theme:Y?`popover`:`default`,position:Y?`none`:`bottom`,alignment:Y?`none`:`left`,spacing:Y?`none`:`default`,className:s.cn(`z-[9999] w-fit`,Y?`mt-0`:`mt-2`),children:K.map(({tab:e,icon:t,i18nKey:r})=>{let i=!F.unpinnedTabs.includes(e);return(0,T.jsx)(`li`,{className:`list-none`,children:(0,T.jsx)(_.ArchivedDisabledTooltip,{isDisabled:W,children:(0,T.jsxs)(`div`,{className:s.cn(`group flex h-[30px] w-full min-w-0 items-stretch rounded`,!W&&`hover:bg-[var(--oh-interactive-hover)]`,W&&`opacity-50`),children:[(0,T.jsxs)(`button`,{type:`button`,"data-testid":`conversation-tabs-menu-open-${e}`,disabled:W,className:s.cn(`flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white`,f.dropdownInstantColorClassName,W?`cursor-not-allowed`:`cursor-pointer`),onClick:()=>q(e),children:[(0,T.jsx)(`span`,{className:f.dropdownMenuRowIconWrapperClassName,"aria-hidden":!0,children:(0,T.jsx)(t,{className:`h-4 w-4`})}),(0,T.jsx)(`span`,{className:`text-sm`,children:N(r)})]}),(0,T.jsx)(`button`,{type:`button`,"data-testid":`conversation-tabs-menu-pin-${e}`,disabled:W,className:s.cn(`flex shrink-0 items-center justify-center rounded-r px-2 text-white`,f.dropdownInstantColorClassName,W?`cursor-not-allowed`:`cursor-pointer hover:bg-white/10`),"aria-pressed":i,"aria-label":N(i?n.I18nKey.CONVERSATION$UNPIN_TAB:n.I18nKey.CONVERSATION$PIN_TAB),onClick:t=>J(e,t),children:i?(0,T.jsx)(`span`,{className:s.cn(`-mr-[5px] ml-auto`,f.dropdownMenuRowIconWrapperClassName),"aria-hidden":!0,children:(0,T.jsx)(x.default,{className:`h-7 w-7`})}):(0,T.jsx)(`span`,{className:s.cn(`ml-auto`,f.dropdownMenuRowIconWrapperClassName),"aria-hidden":!0,children:(0,T.jsx)(b.default,{className:`h-4.5 w-4.5`})})})]})})},e)})});return Y&&j&&typeof document<`u`?E.default.createPortal((0,T.jsx)(`div`,{style:j,children:X}),document.body):X}exports.ConversationTabsContextMenu=D;
 //# sourceMappingURL=conversation-tabs-context-menu.cjs.map

package/dist/components/features/conversation/conversation-tabs/conversation-tabs-context-menu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"conversation-tabs-context-menu.cjs","names":[],"sources":["../../../../../src/components/features/conversation/conversation-tabs/conversation-tabs-context-menu.tsx"],"sourcesContent":["import React, { useLayoutEffect, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { useTranslation } from \"react-i18next\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\nimport { useConversationLocalStorageState } from \"#/utils/conversation-local-storage\";\nimport {\n  useConversationStore,\n  type ConversationTab,\n} from \"#/stores/conversation-store\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { Gauge, Globe, ListTodo, SquareChevronRight } from \"lucide-react\";\nimport DocumentIcon from \"#/icons/document.svg?react\";\nimport PillIcon from \"#/icons/pill.svg?react\";\nimport PillFillIcon from \"#/icons/pill-fill.svg?react\";\nimport DoubleCheckIcon from \"#/icons/double-check.svg?react\";\nimport { useTaskList } from \"#/hooks/use-task-list\";\nimport { useActiveBackend } from \"#/contexts/active-backend-context\";\nimport { useSelectConversationTab } from \"#/hooks/use-select-conversation-tab\";\nimport { useIsArchivedConversation } from \"#/hooks/use-is-archived-conversation\";\nimport { ArchivedDisabledTooltip } from \"../../context-menu/archived-disabled-tooltip\";\nimport { cn } from \"#/utils/utils\";\nimport {\n  dropdownInstantColorClassName,\n  dropdownMenuRowIconWrapperClassName,\n} from \"#/utils/dropdown-classes\";\n\ninterface ConversationTabsContextMenuProps {\n  isOpen: boolean;\n  onClose: () => void;\n  ignoreOutsideClickRef?: React.RefObject<HTMLElement | null>;\n  /** Portal anchor so the menu is not clipped by drawer overflow. */\n  anchorRef?: React.RefObject<HTMLElement | null>;\n}\n\nexport function ConversationTabsContextMenu({\n  isOpen,\n  onClose,\n  ignoreOutsideClickRef,\n  anchorRef,\n}: ConversationTabsContextMenuProps) {\n  const ref = useClickOutsideElement<HTMLUListElement>(\n    onClose,\n    ignoreOutsideClickRef,\n  );\n  const [portalStyle, setPortalStyle] = useState<React.CSSProperties>();\n\n  useLayoutEffect(() => {\n    if (!isOpen || !anchorRef?.current) {\n      setPortalStyle(undefined);\n      return undefined;\n    }\n\n    const updatePosition = () => {\n      const rect = anchorRef.current?.getBoundingClientRect();\n      if (!rect) return;\n\n      const gap = 8;\n      setPortalStyle({\n        position: \"fixed\",\n        zIndex: 9999,\n        top: rect.bottom + gap,\n        left: rect.left,\n      });\n    };\n\n    updatePosition();\n    window.addEventListener(\"resize\", updatePosition);\n    window.addEventListener(\"scroll\", updatePosition, true);\n    return () => {\n      window.removeEventListener(\"resize\", updatePosition);\n      window.removeEventListener(\"scroll\", updatePosition, true);\n    };\n  }, [isOpen, anchorRef]);\n  const { t } = useTranslation(\"openhands\");\n  const { conversationId } = useConversationId();\n  const {\n    state,\n    setUnpinnedTabs,\n    setSelectedTab: setPersistedSelectedTab,\n  } = useConversationLocalStorageState(conversationId);\n  const { selectedTab, isRightPanelShown, setSelectedTab } =\n    useConversationStore();\n\n  const { navigateToTab } = useSelectConversationTab();\n\n  const { hasTaskList } = useTaskList();\n  const { backend } = useActiveBackend();\n  const isArchivedConversation = useIsArchivedConversation();\n\n  const tabConfig = [\n    {\n      tab: \"planner\",\n      icon: ListTodo,\n      i18nKey: I18nKey.COMMON$PLANNER,\n    },\n    { tab: \"files\", icon: DocumentIcon, i18nKey: I18nKey.COMMON$FILES },\n    {\n      tab: \"terminal\",\n      icon: SquareChevronRight,\n      i18nKey: I18nKey.COMMON$TERMINAL,\n    },\n    { tab: \"browser\", icon: Globe, i18nKey: I18nKey.COMMON$BROWSER },\n    { tab: \"usage\", icon: Gauge, i18nKey: I18nKey.COMMON$USAGE },\n  ];\n\n  if (hasTaskList) {\n    tabConfig.unshift({\n      tab: \"tasklist\",\n      icon: DoubleCheckIcon,\n      i18nKey: I18nKey.COMMON$TASK_LIST,\n    });\n  }\n\n  const visibleTabConfig = tabConfig.filter(\n    ({ tab }) => tab !== \"planner\" || backend.kind === \"cloud\",\n  );\n\n  const handleOpenTab = (tab: string) => {\n    if (isArchivedConversation) {\n      return;\n    }\n    navigateToTab(tab as ConversationTab);\n    onClose();\n  };\n\n  const handlePinToggle = (tab: string, e: React.MouseEvent) => {\n    if (isArchivedConversation) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n    e.preventDefault();\n    e.stopPropagation();\n    if (state.unpinnedTabs.includes(tab)) {\n      setUnpinnedTabs(state.unpinnedTabs.filter((item) => item !== tab));\n    } else {\n      const newUnpinnedTabs = [...state.unpinnedTabs, tab];\n      setUnpinnedTabs(newUnpinnedTabs);\n\n      if (selectedTab === tab && isRightPanelShown) {\n        const nextPinnedTab = visibleTabConfig.find(\n          ({ tab: tabKey }) =>\n            tabKey !== tab && !newUnpinnedTabs.includes(tabKey),\n        );\n\n        if (nextPinnedTab) {\n          setSelectedTab(nextPinnedTab.tab as ConversationTab);\n          setPersistedSelectedTab(nextPinnedTab.tab as ConversationTab);\n        }\n      }\n    }\n  };\n\n  if (!isOpen) return null;\n\n  const isPortaled = Boolean(anchorRef?.current && portalStyle);\n\n  const menu = (\n    <ContextMenu\n      ref={ref}\n      theme={isPortaled ? \"popover\" : \"default\"}\n      position={isPortaled ? \"none\" : \"bottom\"}\n      alignment={isPortaled ? \"none\" : \"left\"}\n      spacing={isPortaled ? \"none\" : \"default\"}\n      className={cn(\"z-[9999] w-fit\", isPortaled ? \"mt-0\" : \"mt-2\")}\n    >\n      {visibleTabConfig.map(({ tab, icon: Icon, i18nKey }) => {\n        const pinned = !state.unpinnedTabs.includes(tab);\n        return (\n          <li key={tab} className=\"list-none\">\n            <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n              <div\n                className={cn(\n                  \"group flex h-[30px] w-full min-w-0 items-stretch rounded\",\n                  !isArchivedConversation &&\n                    \"hover:bg-[var(--oh-interactive-hover)]\",\n                  isArchivedConversation && \"opacity-50\",\n                )}\n              >\n                <button\n                  type=\"button\"\n                  data-testid={`conversation-tabs-menu-open-${tab}`}\n                  disabled={isArchivedConversation}\n                  className={cn(\n                    \"flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white\",\n                    dropdownInstantColorClassName,\n                    isArchivedConversation\n                      ? \"cursor-not-allowed\"\n                      : \"cursor-pointer\",\n                  )}\n                  onClick={() => handleOpenTab(tab)}\n                >\n                  <span\n                    className={dropdownMenuRowIconWrapperClassName}\n                    aria-hidden\n                  >\n                    <Icon className=\"h-4 w-4\" />\n                  </span>\n                  <span className=\"text-sm\">{t(i18nKey)}</span>\n                </button>\n                <button\n                  type=\"button\"\n                  data-testid={`conversation-tabs-menu-pin-${tab}`}\n                  disabled={isArchivedConversation}\n                  className={cn(\n                    \"flex shrink-0 items-center justify-center rounded-r px-2 text-white\",\n                    dropdownInstantColorClassName,\n                    isArchivedConversation\n                      ? \"cursor-not-allowed\"\n                      : \"cursor-pointer hover:bg-white/10\",\n                  )}\n                  aria-pressed={pinned}\n                  aria-label={\n                    pinned\n                      ? t(I18nKey.CONVERSATION$UNPIN_TAB)\n                      : t(I18nKey.CONVERSATION$PIN_TAB)\n                  }\n                  onClick={(e) => handlePinToggle(tab, e)}\n                >\n                  {pinned ? (\n                    <span\n                      className={cn(\n                        \"-mr-[5px] ml-auto\",\n                        dropdownMenuRowIconWrapperClassName,\n                      )}\n                      aria-hidden\n                    >\n                      <PillFillIcon className=\"h-7 w-7\" />\n                    </span>\n                  ) : (\n                    <span\n                      className={cn(\n                        \"ml-auto\",\n                        dropdownMenuRowIconWrapperClassName,\n                      )}\n                      aria-hidden\n                    >\n                      <PillIcon className=\"h-4.5 w-4.5\" />\n                    </span>\n                  )}\n                </button>\n              </div>\n            </ArchivedDisabledTooltip>\n          </li>\n        );\n      })}\n    </ContextMenu>\n  );\n\n  if (isPortaled && portalStyle && typeof document !== \"undefined\") {\n    return ReactDOM.createPortal(\n      <div style={portalStyle}>{menu}</div>,\n      document.body,\n    );\n  }\n\n  return menu;\n}\n"],"mappings":"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"}
+{"version":3,"file":"conversation-tabs-context-menu.cjs","names":[],"sources":["../../../../../src/components/features/conversation/conversation-tabs/conversation-tabs-context-menu.tsx"],"sourcesContent":["import React, { useLayoutEffect, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { useTranslation } from \"react-i18next\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\nimport { useConversationLocalStorageState } from \"#/utils/conversation-local-storage\";\nimport {\n  useConversationStore,\n  type ConversationTab,\n} from \"#/stores/conversation-store\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { Gauge, Globe, ListTodo, SquareChevronRight } from \"lucide-react\";\nimport { LuFileDiff } from \"react-icons/lu\";\nimport DocumentIcon from \"#/icons/document.svg?react\";\nimport PillIcon from \"#/icons/pill.svg?react\";\nimport PillFillIcon from \"#/icons/pill-fill.svg?react\";\nimport DoubleCheckIcon from \"#/icons/double-check.svg?react\";\nimport { useTaskList } from \"#/hooks/use-task-list\";\nimport { useActiveBackend } from \"#/contexts/active-backend-context\";\nimport { useSelectConversationTab } from \"#/hooks/use-select-conversation-tab\";\nimport { useIsArchivedConversation } from \"#/hooks/use-is-archived-conversation\";\nimport { ArchivedDisabledTooltip } from \"../../context-menu/archived-disabled-tooltip\";\nimport { cn } from \"#/utils/utils\";\nimport {\n  dropdownInstantColorClassName,\n  dropdownMenuRowIconWrapperClassName,\n} from \"#/utils/dropdown-classes\";\n\ninterface ConversationTabsContextMenuProps {\n  isOpen: boolean;\n  onClose: () => void;\n  ignoreOutsideClickRef?: React.RefObject<HTMLElement | null>;\n  /** Portal anchor so the menu is not clipped by drawer overflow. */\n  anchorRef?: React.RefObject<HTMLElement | null>;\n}\n\nexport function ConversationTabsContextMenu({\n  isOpen,\n  onClose,\n  ignoreOutsideClickRef,\n  anchorRef,\n}: ConversationTabsContextMenuProps) {\n  const ref = useClickOutsideElement<HTMLUListElement>(\n    onClose,\n    ignoreOutsideClickRef,\n  );\n  const [portalStyle, setPortalStyle] = useState<React.CSSProperties>();\n\n  useLayoutEffect(() => {\n    if (!isOpen || !anchorRef?.current) {\n      setPortalStyle(undefined);\n      return undefined;\n    }\n\n    const updatePosition = () => {\n      const rect = anchorRef.current?.getBoundingClientRect();\n      if (!rect) return;\n\n      const gap = 8;\n      setPortalStyle({\n        position: \"fixed\",\n        zIndex: 9999,\n        top: rect.bottom + gap,\n        left: rect.left,\n      });\n    };\n\n    updatePosition();\n    window.addEventListener(\"resize\", updatePosition);\n    window.addEventListener(\"scroll\", updatePosition, true);\n    return () => {\n      window.removeEventListener(\"resize\", updatePosition);\n      window.removeEventListener(\"scroll\", updatePosition, true);\n    };\n  }, [isOpen, anchorRef]);\n  const { t } = useTranslation(\"openhands\");\n  const { conversationId } = useConversationId();\n  const {\n    state,\n    setUnpinnedTabs,\n    setSelectedTab: setPersistedSelectedTab,\n  } = useConversationLocalStorageState(conversationId);\n  const { selectedTab, isRightPanelShown, setSelectedTab } =\n    useConversationStore();\n\n  const { navigateToTab } = useSelectConversationTab();\n\n  const { hasTaskList } = useTaskList();\n  const { backend } = useActiveBackend();\n  const isArchivedConversation = useIsArchivedConversation();\n\n  const tabConfig = [\n    {\n      tab: \"planner\",\n      icon: ListTodo,\n      i18nKey: I18nKey.COMMON$PLANNER,\n    },\n    { tab: \"files\", icon: DocumentIcon, i18nKey: I18nKey.COMMON$FILES },\n    {\n      tab: \"commits\",\n      icon: LuFileDiff,\n      i18nKey: I18nKey.DIFF_VIEWER$COMMITS,\n    },\n    {\n      tab: \"terminal\",\n      icon: SquareChevronRight,\n      i18nKey: I18nKey.COMMON$TERMINAL,\n    },\n    { tab: \"browser\", icon: Globe, i18nKey: I18nKey.COMMON$BROWSER },\n    { tab: \"usage\", icon: Gauge, i18nKey: I18nKey.COMMON$USAGE },\n  ];\n\n  if (hasTaskList) {\n    tabConfig.unshift({\n      tab: \"tasklist\",\n      icon: DoubleCheckIcon,\n      i18nKey: I18nKey.COMMON$TASK_LIST,\n    });\n  }\n\n  const visibleTabConfig = tabConfig.filter(\n    ({ tab }) => tab !== \"planner\" || backend.kind === \"cloud\",\n  );\n\n  const handleOpenTab = (tab: string) => {\n    if (isArchivedConversation) {\n      return;\n    }\n    navigateToTab(tab as ConversationTab);\n    onClose();\n  };\n\n  const handlePinToggle = (tab: string, e: React.MouseEvent) => {\n    if (isArchivedConversation) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n    e.preventDefault();\n    e.stopPropagation();\n    if (state.unpinnedTabs.includes(tab)) {\n      setUnpinnedTabs(state.unpinnedTabs.filter((item) => item !== tab));\n    } else {\n      const newUnpinnedTabs = [...state.unpinnedTabs, tab];\n      setUnpinnedTabs(newUnpinnedTabs);\n\n      if (selectedTab === tab && isRightPanelShown) {\n        const nextPinnedTab = visibleTabConfig.find(\n          ({ tab: tabKey }) =>\n            tabKey !== tab && !newUnpinnedTabs.includes(tabKey),\n        );\n\n        if (nextPinnedTab) {\n          setSelectedTab(nextPinnedTab.tab as ConversationTab);\n          setPersistedSelectedTab(nextPinnedTab.tab as ConversationTab);\n        }\n      }\n    }\n  };\n\n  if (!isOpen) return null;\n\n  const isPortaled = Boolean(anchorRef?.current && portalStyle);\n\n  const menu = (\n    <ContextMenu\n      ref={ref}\n      theme={isPortaled ? \"popover\" : \"default\"}\n      position={isPortaled ? \"none\" : \"bottom\"}\n      alignment={isPortaled ? \"none\" : \"left\"}\n      spacing={isPortaled ? \"none\" : \"default\"}\n      className={cn(\"z-[9999] w-fit\", isPortaled ? \"mt-0\" : \"mt-2\")}\n    >\n      {visibleTabConfig.map(({ tab, icon: Icon, i18nKey }) => {\n        const pinned = !state.unpinnedTabs.includes(tab);\n        return (\n          <li key={tab} className=\"list-none\">\n            <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n              <div\n                className={cn(\n                  \"group flex h-[30px] w-full min-w-0 items-stretch rounded\",\n                  !isArchivedConversation &&\n                    \"hover:bg-[var(--oh-interactive-hover)]\",\n                  isArchivedConversation && \"opacity-50\",\n                )}\n              >\n                <button\n                  type=\"button\"\n                  data-testid={`conversation-tabs-menu-open-${tab}`}\n                  disabled={isArchivedConversation}\n                  className={cn(\n                    \"flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white\",\n                    dropdownInstantColorClassName,\n                    isArchivedConversation\n                      ? \"cursor-not-allowed\"\n                      : \"cursor-pointer\",\n                  )}\n                  onClick={() => handleOpenTab(tab)}\n                >\n                  <span\n                    className={dropdownMenuRowIconWrapperClassName}\n                    aria-hidden\n                  >\n                    <Icon className=\"h-4 w-4\" />\n                  </span>\n                  <span className=\"text-sm\">{t(i18nKey)}</span>\n                </button>\n                <button\n                  type=\"button\"\n                  data-testid={`conversation-tabs-menu-pin-${tab}`}\n                  disabled={isArchivedConversation}\n                  className={cn(\n                    \"flex shrink-0 items-center justify-center rounded-r px-2 text-white\",\n                    dropdownInstantColorClassName,\n                    isArchivedConversation\n                      ? \"cursor-not-allowed\"\n                      : \"cursor-pointer hover:bg-white/10\",\n                  )}\n                  aria-pressed={pinned}\n                  aria-label={\n                    pinned\n                      ? t(I18nKey.CONVERSATION$UNPIN_TAB)\n                      : t(I18nKey.CONVERSATION$PIN_TAB)\n                  }\n                  onClick={(e) => handlePinToggle(tab, e)}\n                >\n                  {pinned ? (\n                    <span\n                      className={cn(\n                        \"-mr-[5px] ml-auto\",\n                        dropdownMenuRowIconWrapperClassName,\n                      )}\n                      aria-hidden\n                    >\n                      <PillFillIcon className=\"h-7 w-7\" />\n                    </span>\n                  ) : (\n                    <span\n                      className={cn(\n                        \"ml-auto\",\n                        dropdownMenuRowIconWrapperClassName,\n                      )}\n                      aria-hidden\n                    >\n                      <PillIcon className=\"h-4.5 w-4.5\" />\n                    </span>\n                  )}\n                </button>\n              </div>\n            </ArchivedDisabledTooltip>\n          </li>\n        );\n      })}\n    </ContextMenu>\n  );\n\n  if (isPortaled && portalStyle && typeof document !== \"undefined\") {\n    return ReactDOM.createPortal(\n      <div style={portalStyle}>{menu}</div>,\n      document.body,\n    );\n  }\n\n  return menu;\n}\n"],"mappings":"+/CAqCA,SAAgB,EAA4B,CAC1C,SACA,UACA,wBACA,aACmC,CACnC,IAAM,EAAM,EAAA,uBACV,EACA,CACF,EACM,CAAC,EAAa,IAAA,EAAA,EAAA,UAAgD,GAEpE,EAAA,EAAA,qBAAsB,CACpB,GAAI,CAAC,GAAU,CAAC,GAAW,QAAS,CAClC,EAAe,IAAA,EAAS,EACxB,MACF,CAEA,IAAM,MAAuB,CAC3B,IAAM,EAAO,EAAU,SAAS,sBAAsB,EACjD,GAGL,EAAe,CACb,SAAU,QACV,OAAQ,KACR,IAAK,EAAK,OAAS,EACnB,KAAM,EAAK,IACb,CAAC,CACH,EAKA,OAHA,EAAe,EACf,OAAO,iBAAiB,SAAU,CAAc,EAChD,OAAO,iBAAiB,SAAU,EAAgB,EAAI,MACzC,CACX,OAAO,oBAAoB,SAAU,CAAc,EACnD,OAAO,oBAAoB,SAAU,EAAgB,EAAI,CAC3D,CACF,EAAG,CAAC,EAAQ,CAAS,CAAC,EACtB,GAAM,CAAE,KAAM,EAAA,eAAe,WAAW,EAClC,CAAE,kBAAmB,EAAA,kBAAkB,EACvC,CACJ,QACA,kBACA,eAAgB,GACd,EAAA,iCAAiC,CAAc,EAC7C,CAAE,cAAa,oBAAmB,kBACtC,EAAA,qBAAqB,EAEjB,CAAE,iBAAkB,EAAA,yBAAyB,EAE7C,CAAE,eAAgB,EAAA,YAAY,EAC9B,CAAE,WAAY,EAAA,iBAAiB,EAC/B,EAAyB,EAAA,0BAA0B,EAEnD,EAAY,CAChB,CACE,IAAK,UACL,KAAM,EAAA,SACN,QAAS,EAAA,QAAQ,cACnB,EACA,CAAE,IAAK,QAAS,KAAM,EAAA,QAAc,QAAS,EAAA,QAAQ,YAAa,EAClE,CACE,IAAK,UACL,KAAM,EAAA,WACN,QAAS,EAAA,QAAQ,mBACnB,EACA,CACE,IAAK,WACL,KAAM,EAAA,mBACN,QAAS,EAAA,QAAQ,eACnB,EACA,CAAE,IAAK,UAAW,KAAM,EAAA,MAAO,QAAS,EAAA,QAAQ,cAAe,EAC/D,CAAE,IAAK,QAAS,KAAM,EAAA,MAAO,QAAS,EAAA,QAAQ,YAAa,CAC7D,EAEI,GACF,EAAU,QAAQ,CAChB,IAAK,WACL,KAAM,EAAA,QACN,QAAS,EAAA,QAAQ,gBACnB,CAAC,EAGH,IAAM,EAAmB,EAAU,QAChC,CAAE,SAAU,IAAQ,WAAa,EAAQ,OAAS,OACrD,EAEM,EAAiB,GAAgB,CACjC,IAGJ,EAAc,CAAsB,EACpC,EAAQ,EACV,EAEM,GAAmB,EAAa,IAAwB,CAC5D,GAAI,EAAwB,CAC1B,EAAE,eAAe,EACjB,EAAE,gBAAgB,EAClB,MACF,CAGA,GAFA,EAAE,eAAe,EACjB,EAAE,gBAAgB,EACd,EAAM,aAAa,SAAS,CAAG,EACjC,EAAgB,EAAM,aAAa,OAAQ,GAAS,IAAS,CAAG,CAAC,MAC5D,CACL,IAAM,EAAkB,CAAC,GAAG,EAAM,aAAc,CAAG,EAGnD,GAFA,EAAgB,CAAe,EAE3B,IAAgB,GAAO,EAAmB,CAC5C,IAAM,EAAgB,EAAiB,MACpC,CAAE,IAAK,KACN,IAAW,GAAO,CAAC,EAAgB,SAAS,CAAM,CACtD,EAEI,IACF,EAAe,EAAc,GAAsB,EACnD,EAAwB,EAAc,GAAsB,EAEhE,CACF,CACF,EAEA,GAAI,CAAC,EAAQ,OAAO,KAEpB,IAAM,EAAa,GAAQ,GAAW,SAAW,GAE3C,GACJ,EAAA,EAAA,KAAC,EAAA,YAAD,CACO,MACL,MAAO,EAAa,UAAY,UAChC,SAAU,EAAa,OAAS,SAChC,UAAW,EAAa,OAAS,OACjC,QAAS,EAAa,OAAS,UAC/B,UAAW,EAAA,GAAG,iBAAkB,EAAa,OAAS,MAAM,WAE3D,EAAiB,KAAK,CAAE,MAAK,KAAM,EAAM,aAAc,CACtD,IAAM,EAAS,CAAC,EAAM,aAAa,SAAS,CAAG,EAC/C,OACE,EAAA,EAAA,KAAC,KAAD,CAAc,UAAU,sBACtB,EAAA,EAAA,KAAC,EAAA,wBAAD,CAAyB,WAAY,YACnC,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,EAAA,GACT,2DACA,CAAC,GACC,yCACF,GAA0B,YAC5B,WANF,EAQE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,cAAa,+BAA+B,IAC5C,SAAU,EACV,UAAW,EAAA,GACT,6EACA,EAAA,8BACA,EACI,qBACA,gBACN,EACA,YAAe,EAAc,CAAG,WAXlC,EAaE,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,EAAA,oCACX,cAAA,aAEA,EAAA,EAAA,KAAC,EAAD,CAAM,UAAU,SAAW,CAAA,CACvB,CAAA,GACN,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,mBAAW,EAAE,CAAO,CAAQ,CAAA,CACtC,KACR,EAAA,EAAA,KAAC,SAAD,CACE,KAAK,SACL,cAAa,8BAA8B,IAC3C,SAAU,EACV,UAAW,EAAA,GACT,sEACA,EAAA,8BACA,EACI,qBACA,kCACN,EACA,eAAc,EACd,aAEM,EADJ,EACM,EAAA,QAAQ,uBACR,EAAA,QAAQ,oBAAoB,EAEpC,QAAU,GAAM,EAAgB,EAAK,CAAC,WAErC,GACC,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,EAAA,GACT,oBACA,EAAA,mCACF,EACA,cAAA,aAEA,EAAA,EAAA,KAAC,EAAA,QAAD,CAAc,UAAU,SAAW,CAAA,CAC/B,CAAA,GAEN,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,EAAA,GACT,UACA,EAAA,mCACF,EACA,cAAA,aAEA,EAAA,EAAA,KAAC,EAAA,QAAD,CAAU,UAAU,aAAe,CAAA,CAC/B,CAAA,CAEF,CAAA,CACL,GACkB,CAAA,CACvB,EA1EK,CA0EL,CAER,CAAC,CACU,CAAA,EAUf,OAPI,GAAc,GAAe,OAAO,SAAa,IAC5C,EAAA,QAAS,cACd,EAAA,EAAA,KAAC,MAAD,CAAK,MAAO,WAAc,CAAU,CAAA,EACpC,SAAS,IACX,EAGK,CACT"}

package/dist/components/features/conversation/conversation-tabs/conversation-tabs-context-menu.js

@@ -16,24 +16,25 @@ import { useSelectConversationTab as h } from "../../../../hooks/use-select-conv
 import g from "../../../../icons/document.js";
 import { ArchivedDisabledTooltip as _ } from "../../context-menu/archived-disabled-tooltip.js";
 import { useIsArchivedConversation as v } from "../../../../hooks/use-is-archived-conversation.js";
-import y from "../../../../icons/double-check.js";
+import { LuFileDiff as y } from "../../../../node_modules/react-icons/lu/index.js";
 import b from "../../../../icons/pill.js";
 import x from "../../../../icons/pill-fill.js";
-import { useTaskList as S } from "../../../../hooks/use-task-list.js";
-import { useLayoutEffect as C, useState as w } from "react";
-import { jsx as T, jsxs as E } from "react/jsx-runtime";
-import D from "react-dom";
+import S from "../../../../icons/double-check.js";
+import { useTaskList as C } from "../../../../hooks/use-task-list.js";
+import { useLayoutEffect as w, useState as T } from "react";
+import { jsx as E, jsxs as D } from "react/jsx-runtime";
+import O from "react-dom";
 //#region src/components/features/conversation/conversation-tabs/conversation-tabs-context-menu.tsx
-function O({ isOpen: O, onClose: k, ignoreOutsideClickRef: A, anchorRef: j }) {
-	let M = m(k, A), [N, P] = w();
-	C(() => {
-		if (!O || !j?.current) {
-			P(void 0);
+function k({ isOpen: k, onClose: A, ignoreOutsideClickRef: j, anchorRef: M }) {
+	let N = m(A, j), [P, F] = T();
+	w(() => {
+		if (!k || !M?.current) {
+			F(void 0);
 			return;
 		}
 		let e = () => {
-			let e = j.current?.getBoundingClientRect();
-			e && P({
+			let e = M.current?.getBoundingClientRect();
+			e && F({
 				position: "fixed",
 				zIndex: 9999,
 				top: e.bottom + 8,
@@ -43,8 +44,8 @@ function O({ isOpen: O, onClose: k, ignoreOutsideClickRef: A, anchorRef: j }) {
 		return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
 			window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
 		};
-	}, [O, j]);
-	let { t: F } = e("openhands"), { conversationId: I } = s(), { state: L, setUnpinnedTabs: R, setSelectedTab: z } = c(I), { selectedTab: B, isRightPanelShown: V, setSelectedTab: H } = l(), { navigateToTab: U } = h(), { hasTaskList: W } = S(), { backend: G } = u(), K = v(), q = [
+	}, [k, M]);
+	let { t: I } = e("openhands"), { conversationId: L } = s(), { state: R, setUnpinnedTabs: z, setSelectedTab: B } = c(L), { selectedTab: V, isRightPanelShown: H, setSelectedTab: U } = l(), { navigateToTab: W } = h(), { hasTaskList: G } = C(), { backend: K } = u(), q = v(), J = [
 		{
 			tab: "planner",
 			icon: i,
@@ -55,6 +56,11 @@ function O({ isOpen: O, onClose: k, ignoreOutsideClickRef: A, anchorRef: j }) {
 			icon: g,
 			i18nKey: t.COMMON$FILES
 		},
+		{
+			tab: "commits",
+			icon: y,
+			i18nKey: t.DIFF_VIEWER$COMMITS
+		},
 		{
 			tab: "terminal",
 			icon: a,
@@ -71,73 +77,73 @@ function O({ isOpen: O, onClose: k, ignoreOutsideClickRef: A, anchorRef: j }) {
 			i18nKey: t.COMMON$USAGE
 		}
 	];
-	W && q.unshift({
+	G && J.unshift({
 		tab: "tasklist",
-		icon: y,
+		icon: S,
 		i18nKey: t.COMMON$TASK_LIST
 	});
-	let J = q.filter(({ tab: e }) => e !== "planner" || G.kind === "cloud"), Y = (e) => {
-		K || (U(e), k());
-	}, X = (e, t) => {
-		if (K) {
+	let Y = J.filter(({ tab: e }) => e !== "planner" || K.kind === "cloud"), X = (e) => {
+		q || (W(e), A());
+	}, Z = (e, t) => {
+		if (q) {
 			t.preventDefault(), t.stopPropagation();
 			return;
 		}
-		if (t.preventDefault(), t.stopPropagation(), L.unpinnedTabs.includes(e)) R(L.unpinnedTabs.filter((t) => t !== e));
+		if (t.preventDefault(), t.stopPropagation(), R.unpinnedTabs.includes(e)) z(R.unpinnedTabs.filter((t) => t !== e));
 		else {
-			let t = [...L.unpinnedTabs, e];
-			if (R(t), B === e && V) {
-				let n = J.find(({ tab: n }) => n !== e && !t.includes(n));
-				n && (H(n.tab), z(n.tab));
+			let t = [...R.unpinnedTabs, e];
+			if (z(t), V === e && H) {
+				let n = Y.find(({ tab: n }) => n !== e && !t.includes(n));
+				n && (U(n.tab), B(n.tab));
 			}
 		}
 	};
-	if (!O) return null;
-	let Z = !!(j?.current && N), Q = /* @__PURE__ */ T(p, {
-		ref: M,
-		theme: Z ? "popover" : "default",
-		position: Z ? "none" : "bottom",
-		alignment: Z ? "none" : "left",
-		spacing: Z ? "none" : "default",
-		className: o("z-[9999] w-fit", Z ? "mt-0" : "mt-2"),
-		children: J.map(({ tab: e, icon: n, i18nKey: r }) => {
-			let i = !L.unpinnedTabs.includes(e);
-			return /* @__PURE__ */ T("li", {
+	if (!k) return null;
+	let Q = !!(M?.current && P), $ = /* @__PURE__ */ E(p, {
+		ref: N,
+		theme: Q ? "popover" : "default",
+		position: Q ? "none" : "bottom",
+		alignment: Q ? "none" : "left",
+		spacing: Q ? "none" : "default",
+		className: o("z-[9999] w-fit", Q ? "mt-0" : "mt-2"),
+		children: Y.map(({ tab: e, icon: n, i18nKey: r }) => {
+			let i = !R.unpinnedTabs.includes(e);
+			return /* @__PURE__ */ E("li", {
 				className: "list-none",
-				children: /* @__PURE__ */ T(_, {
-					isDisabled: K,
-					children: /* @__PURE__ */ E("div", {
-						className: o("group flex h-[30px] w-full min-w-0 items-stretch rounded", !K && "hover:bg-[var(--oh-interactive-hover)]", K && "opacity-50"),
-						children: [/* @__PURE__ */ E("button", {
+				children: /* @__PURE__ */ E(_, {
+					isDisabled: q,
+					children: /* @__PURE__ */ D("div", {
+						className: o("group flex h-[30px] w-full min-w-0 items-stretch rounded", !q && "hover:bg-[var(--oh-interactive-hover)]", q && "opacity-50"),
+						children: [/* @__PURE__ */ D("button", {
 							type: "button",
 							"data-testid": `conversation-tabs-menu-open-${e}`,
-							disabled: K,
-							className: o("flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white", d, K ? "cursor-not-allowed" : "cursor-pointer"),
-							onClick: () => Y(e),
-							children: [/* @__PURE__ */ T("span", {
+							disabled: q,
+							className: o("flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white", d, q ? "cursor-not-allowed" : "cursor-pointer"),
+							onClick: () => X(e),
+							children: [/* @__PURE__ */ E("span", {
 								className: f,
 								"aria-hidden": !0,
-								children: /* @__PURE__ */ T(n, { className: "h-4 w-4" })
-							}), /* @__PURE__ */ T("span", {
+								children: /* @__PURE__ */ E(n, { className: "h-4 w-4" })
+							}), /* @__PURE__ */ E("span", {
 								className: "text-sm",
-								children: F(r)
+								children: I(r)
 							})]
-						}), /* @__PURE__ */ T("button", {
+						}), /* @__PURE__ */ E("button", {
 							type: "button",
 							"data-testid": `conversation-tabs-menu-pin-${e}`,
-							disabled: K,
-							className: o("flex shrink-0 items-center justify-center rounded-r px-2 text-white", d, K ? "cursor-not-allowed" : "cursor-pointer hover:bg-white/10"),
+							disabled: q,
+							className: o("flex shrink-0 items-center justify-center rounded-r px-2 text-white", d, q ? "cursor-not-allowed" : "cursor-pointer hover:bg-white/10"),
 							"aria-pressed": i,
-							"aria-label": F(i ? t.CONVERSATION$UNPIN_TAB : t.CONVERSATION$PIN_TAB),
-							onClick: (t) => X(e, t),
-							children: i ? /* @__PURE__ */ T("span", {
+							"aria-label": I(i ? t.CONVERSATION$UNPIN_TAB : t.CONVERSATION$PIN_TAB),
+							onClick: (t) => Z(e, t),
+							children: i ? /* @__PURE__ */ E("span", {
 								className: o("-mr-[5px] ml-auto", f),
 								"aria-hidden": !0,
-								children: /* @__PURE__ */ T(x, { className: "h-7 w-7" })
-							}) : /* @__PURE__ */ T("span", {
+								children: /* @__PURE__ */ E(x, { className: "h-7 w-7" })
+							}) : /* @__PURE__ */ E("span", {
 								className: o("ml-auto", f),
 								"aria-hidden": !0,
-								children: /* @__PURE__ */ T(b, { className: "h-4.5 w-4.5" })
+								children: /* @__PURE__ */ E(b, { className: "h-4.5 w-4.5" })
 							})
 						})]
 					})
@@ -145,12 +151,12 @@ function O({ isOpen: O, onClose: k, ignoreOutsideClickRef: A, anchorRef: j }) {
 			}, e);
 		})
 	});
-	return Z && N && typeof document < "u" ? D.createPortal(/* @__PURE__ */ T("div", {
-		style: N,
-		children: Q
-	}), document.body) : Q;
+	return Q && P && typeof document < "u" ? O.createPortal(/* @__PURE__ */ E("div", {
+		style: P,
+		children: $
+	}), document.body) : $;
 }
 //#endregion
-export { O as ConversationTabsContextMenu };
+export { k as ConversationTabsContextMenu };
 
 //# sourceMappingURL=conversation-tabs-context-menu.js.map