npm - @openhands/agent-canvas - Versions diffs - 1.0.0-beta.6 → 1.0.0-beta.8 - Mend

@openhands/agent-canvas 1.0.0-beta.6 → 1.0.0-beta.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (802) hide show

package/dist/components/features/chat/pending-user-messages.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pending-user-messages.cjs","names":[],"sources":["../../../../src/components/features/chat/pending-user-messages.tsx"],"sourcesContent":["import React from \"react\";\nimport { useOptimisticUserMessageStore } from \"#/stores/optimistic-user-message-store\";\nimport { useSendMessage } from \"#/hooks/use-send-message\";\nimport { createChatMessage } from \"#/services/chat-service\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { matchesPendingConversationId } from \"#/utils/pending-task-message-link\";\nimport { ImageCarousel } from \"#/components/features/images/image-carousel\";\nimport { ChatMessage } from \"./chat-message\";\n\n/*\n Renders the queue of locally-tracked user messages that have been submitted\n * but not yet echoed back through the WebSocket. Each message shows a faded\n * \"sending\" treatment until the server echoes a real `UserMessageEvent`\n * (which removes it via `consumeMatchingPendingMessage`). If the API rejects the\n * send, the message switches to an \"error\" state with a retry button.\n \n The queue is global but each entry is tagged with the conversation id it\n * was enqueued from; this component filters to only entries belonging to the\n * active conversation, so switching conversations never carries pending\n * bubbles over.\n */\nexport function PendingUserMessages() {\n const { conversationId } = useOptionalConversationId();\n const pendingMessages = useOptimisticUserMessageStore(\n (state) => state.pendingMessages,\n );\n const markPendingMessageError = useOptimisticUserMessageStore(\n (state) => state.markPendingMessageError,\n );\n const markPendingMessageSending = useOptimisticUserMessageStore(\n (state) => state.markPendingMessageSending,\n );\n const { send } = useSendMessage();\n\n const visibleMessages = React.useMemo(\n () =>\n conversationId\n ? pendingMessages.filter((message) =>\n matchesPendingConversationId(\n conversationId,\n message.conversationId,\n ),\n )\n : [],\n [pendingMessages, conversationId],\n );\n\n const handleRetry = React.useCallback(\n async (id: string) => {\n const message = useOptimisticUserMessageStore\n .getState()\n .pendingMessages.find((entry) => entry.id === id);\n if (!message) return;\n\n markPendingMessageSending(id);\n\n try {\n await send(\n createChatMessage(\n message.text,\n message.imageUrls,\n message.fileUrls,\n message.timestamp,\n ),\n );\n } catch (error) {\n const errorMessage =\n error instanceof Error ? error.message : \"Failed to send message\";\n markPendingMessageError(id, errorMessage);\n }\n },\n [send, markPendingMessageError, markPendingMessageSending],\n );\n\n if (visibleMessages.length === 0) {\n return null;\n }\n\n return (\n <>\n {visibleMessages.map((message) => (\n <ChatMessage\n key={message.id}\n type=\"user\"\n message={message.text}\n pendingStatus={message.status}\n onRetry={\n message.status === \"error\"\n ? () => handleRetry(message.id)\n : undefined\n }\n >\n {message.imageUrls.length > 0 && (\n <ImageCarousel size=\"small\" images={message.imageUrls} />\n )}\n </ChatMessage>\n ))}\n </>\n );\n}\n"],"mappings":"~~8dAqBA~~,SAAgB,GAAsB,CACpC,GAAM,CAAE,kBAAmB,EAAA,2BAA2B,CAChD,EAAkB,EAAA,8BACrB,GAAU,EAAM,gBAClB,CACK,EAA0B,EAAA,8BAC7B,GAAU,EAAM,wBAClB,CACK,EAA4B,EAAA,8BAC/B,GAAU,EAAM,0BAClB,CACK,CAAE,QAAS,EAAA,gBAAgB,CAE3B,EAAkB,EAAA,QAAM,YAE1B,EACI,EAAgB,OAAQ,GACtB,EAAA,6BACE,EACA,EAAQ,eACT,CACF,CACD,EAAE,CACR,CAAC,EAAiB,EAAe,CAClC,CAEK,EAAc,EAAA,QAAM,YACxB,KAAO,IAAe,CACpB,IAAM,EAAU,EAAA,8BACb,UAAU,CACV,gBAAgB,KAAM,GAAU,EAAM,KAAO,EAAG,CAC9C,KAEL,GAA0B,EAAG,CAE7B,GAAI,CACF,MAAM,EACJ,EAAA,kBACE,EAAQ,KACR,EAAQ,UACR,EAAQ,SACR,EAAQ,UACT,CACF,OACM,EAAO,CAGd,EAAwB,EADtB,aAAiB,MAAQ,EAAM,QAAU,yBACF,IAG7C,CAAC,EAAM,EAAyB,EAA0B,CAC3D,CAMD,OAJI,EAAgB,SAAW,EACtB,MAIP,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SACG,EAAgB,IAAK,IACpB,EAAA,EAAA,KAAC,EAAA,YAAD,CAEE,KAAK,OACL,QAAS,EAAQ,KACjB,cAAe,EAAQ,OACvB,QACE,EAAQ,SAAW,YACT,EAAY,EAAQ,GAAG,CAC7B,IAAA,YAGL,EAAQ,UAAU,OAAS,IAC1B,EAAA,EAAA,KAAC,EAAA,cAAD,CAAe,KAAK,QAAQ,OAAQ,EAAQ,UAAa,CAAA,CAE/C,~~CAbP~~,EAAQ,~~GAaD~~,CACd,CACD,CAAA"}
1	+ {"version":3,"file":"pending-user-messages.cjs","names":[],"sources":["../../../../src/components/features/chat/pending-user-messages.tsx"],"sourcesContent":["import React from \"react\";\nimport { useOptimisticUserMessageStore } from \"#/stores/optimistic-user-message-store\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { useSendMessage } from \"#/hooks/use-send-message\";\nimport { createChatMessage } from \"#/services/chat-service\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { matchesPendingConversationId } from \"#/utils/pending-task-message-link\";\nimport { ImageCarousel } from \"#/components/features/images/image-carousel\";\nimport { ChatMessage } from \"./chat-message\";\n\n/*\n Renders the queue of locally-tracked user messages that have been submitted\n * but not yet echoed back through the WebSocket. Each message shows a faded\n * \"sending\" treatment until the server echoes a real `UserMessageEvent`\n * (which removes it via `consumeMatchingPendingMessage`). If the API rejects the\n * send, the message switches to an \"error\" state with a retry button.\n \n The queue is global but each entry is tagged with the conversation id it\n * was enqueued from; this component filters to only entries belonging to the\n * active conversation, so switching conversations never carries pending\n * bubbles over.\n */\nexport function PendingUserMessages() {\n const { conversationId } = useOptionalConversationId();\n const pendingMessages = useOptimisticUserMessageStore(\n (state) => state.pendingMessages,\n );\n const markPendingMessageError = useOptimisticUserMessageStore(\n (state) => state.markPendingMessageError,\n );\n const markPendingMessageSending = useOptimisticUserMessageStore(\n (state) => state.markPendingMessageSending,\n );\n const removePendingMessage = useOptimisticUserMessageStore(\n (state) => state.removePendingMessage,\n );\n const restoreMessageToInputIfEmpty = useConversationStore(\n (state) => state.restoreMessageToInputIfEmpty,\n );\n const { send } = useSendMessage();\n\n const visibleMessages = React.useMemo(\n () =>\n conversationId\n ? pendingMessages.filter((message) =>\n matchesPendingConversationId(\n conversationId,\n message.conversationId,\n ),\n )\n : [],\n [pendingMessages, conversationId],\n );\n\n const handleRetry = React.useCallback(\n async (id: string) => {\n const message = useOptimisticUserMessageStore\n .getState()\n .pendingMessages.find((entry) => entry.id === id);\n if (!message) return;\n\n markPendingMessageSending(id);\n\n try {\n await send(\n createChatMessage(\n message.text,\n message.imageUrls,\n message.fileUrls,\n message.timestamp,\n ),\n );\n } catch (error) {\n const errorMessage =\n error instanceof Error ? error.message : \"Failed to send message\";\n markPendingMessageError(id, errorMessage);\n }\n },\n [send, markPendingMessageError, markPendingMessageSending],\n );\n\n const handleStop = React.useCallback(\n (id: string, text: string) => {\n restoreMessageToInputIfEmpty(text);\n removePendingMessage(id);\n },\n [restoreMessageToInputIfEmpty, removePendingMessage],\n );\n\n if (visibleMessages.length === 0) {\n return null;\n }\n\n return (\n <>\n {visibleMessages.map((message) => (\n <ChatMessage\n key={message.id}\n type=\"user\"\n message={message.text}\n pendingStatus={message.status}\n onRetry={\n message.status === \"error\"\n ? () => handleRetry(message.id)\n : undefined\n }\n onStop={\n message.status === \"sending\"\n ? () => handleStop(message.id, message.text)\n : undefined\n }\n >\n {message.imageUrls.length > 0 && (\n <ImageCarousel size=\"small\" images={message.imageUrls} />\n )}\n </ChatMessage>\n ))}\n </>\n );\n}\n"],"mappings":"khBAsBA,SAAgB,GAAsB,CACpC,GAAM,CAAE,kBAAmB,EAAA,2BAA2B,CAChD,EAAkB,EAAA,8BACrB,GAAU,EAAM,gBAClB,CACK,EAA0B,EAAA,8BAC7B,GAAU,EAAM,wBAClB,CACK,EAA4B,EAAA,8BAC/B,GAAU,EAAM,0BAClB,CACK,EAAuB,EAAA,8BAC1B,GAAU,EAAM,qBAClB,CACK,EAA+B,EAAA,qBAClC,GAAU,EAAM,6BAClB,CACK,CAAE,QAAS,EAAA,gBAAgB,CAE3B,EAAkB,EAAA,QAAM,YAE1B,EACI,EAAgB,OAAQ,GACtB,EAAA,6BACE,EACA,EAAQ,eACT,CACF,CACD,EAAE,CACR,CAAC,EAAiB,EAAe,CAClC,CAEK,EAAc,EAAA,QAAM,YACxB,KAAO,IAAe,CACpB,IAAM,EAAU,EAAA,8BACb,UAAU,CACV,gBAAgB,KAAM,GAAU,EAAM,KAAO,EAAG,CAC9C,KAEL,GAA0B,EAAG,CAE7B,GAAI,CACF,MAAM,EACJ,EAAA,kBACE,EAAQ,KACR,EAAQ,UACR,EAAQ,SACR,EAAQ,UACT,CACF,OACM,EAAO,CAGd,EAAwB,EADtB,aAAiB,MAAQ,EAAM,QAAU,yBACF,IAG7C,CAAC,EAAM,EAAyB,EAA0B,CAC3D,CAEK,EAAa,EAAA,QAAM,aACtB,EAAY,IAAiB,CAC5B,EAA6B,EAAK,CAClC,EAAqB,EAAG,EAE1B,CAAC,EAA8B,EAAqB,CACrD,CAMD,OAJI,EAAgB,SAAW,EACtB,MAIP,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SACG,EAAgB,IAAK,IACpB,EAAA,EAAA,KAAC,EAAA,YAAD,CAEE,KAAK,OACL,QAAS,EAAQ,KACjB,cAAe,EAAQ,OACvB,QACE,EAAQ,SAAW,YACT,EAAY,EAAQ,GAAG,CAC7B,IAAA,GAEN,OACE,EAAQ,SAAW,cACT,EAAW,EAAQ,GAAI,EAAQ,KAAK,CAC1C,IAAA,YAGL,EAAQ,UAAU,OAAS,IAC1B,EAAA,EAAA,KAAC,EAAA,cAAD,CAAe,KAAK,QAAQ,OAAQ,EAAQ,UAAa,CAAA,CAE/C,CAlBP,EAAQ,GAkBD,CACd,CACD,CAAA"}

package/dist/components/features/chat/pending-user-messages.js CHANGED Viewed

@@ -1,41 +1,45 @@
 import { useOptionalConversationId as e } from "../../../hooks/use-conversation-id.js";
-import { useOptimisticUserMessageStore as t } from "../../../stores/optimistic-user-message-store.js";
-import { useSendMessage as n } from "../../../hooks/use-send-message.js";
-import { matchesPendingConversationId as r } from "../../../utils/pending-task-message-link.js";
-import { createChatMessage as i } from "../../../services/chat-service.js";
-import { ChatMessage as a } from "./chat-message.js";
-import { ImageCarousel as o } from "../images/image-carousel.js";
-import s from "react";
-import { Fragment as c, jsx as l } from "react/jsx-runtime";
+import { useConversationStore as t } from "../../../stores/conversation-store.js";
+import { useOptimisticUserMessageStore as n } from "../../../stores/optimistic-user-message-store.js";
+import { useSendMessage as r } from "../../../hooks/use-send-message.js";
+import { matchesPendingConversationId as i } from "../../../utils/pending-task-message-link.js";
+import { createChatMessage as a } from "../../../services/chat-service.js";
+import { ChatMessage as o } from "./chat-message.js";
+import { ImageCarousel as s } from "../images/image-carousel.js";
+import c from "react";
+import { Fragment as l, jsx as u } from "react/jsx-runtime";
 //#region src/components/features/chat/pending-user-messages.tsx
-function u() {
-	let { conversationId: u } = e(), d = t((e) => e.pendingMessages), f = t((e) => e.markPendingMessageError), p = t((e) => e.markPendingMessageSending), { send: m } = n(), h = s.useMemo(() => u ? d.filter((e) => r(u, e.conversationId)) : [], [d, u]), g = s.useCallback(async (e) => {
-		let n = t.getState().pendingMessages.find((t) => t.id === e);
-		if (n) {
-			p(e);
+function d() {
+	let { conversationId: d } = e(), f = n((e) => e.pendingMessages), p = n((e) => e.markPendingMessageError), m = n((e) => e.markPendingMessageSending), h = n((e) => e.removePendingMessage), g = t((e) => e.restoreMessageToInputIfEmpty), { send: _ } = r(), v = c.useMemo(() => d ? f.filter((e) => i(d, e.conversationId)) : [], [f, d]), y = c.useCallback(async (e) => {
+		let t = n.getState().pendingMessages.find((t) => t.id === e);
+		if (t) {
+			m(e);
 			try {
-				await m(i(n.text, n.imageUrls, n.fileUrls, n.timestamp));
+				await _(a(t.text, t.imageUrls, t.fileUrls, t.timestamp));
 			} catch (t) {
-				f(e, t instanceof Error ? t.message : "Failed to send message");
+				p(e, t instanceof Error ? t.message : "Failed to send message");
 			}
 		}
 	}, [
-		m,
-		f,
-		p
-	]);
-	return h.length === 0 ? null : /* @__PURE__ */ l(c, { children: h.map((e) => /* @__PURE__ */ l(a, {
+		_,
+		p,
+		m
+	]), b = c.useCallback((e, t) => {
+		g(t), h(e);
+	}, [g, h]);
+	return v.length === 0 ? null : /* @__PURE__ */ u(l, { children: v.map((e) => /* @__PURE__ */ u(o, {
 		type: "user",
 		message: e.text,
 		pendingStatus: e.status,
-		onRetry: e.status === "error" ? () => g(e.id) : void 0,
-		children: e.imageUrls.length > 0 && /* @__PURE__ */ l(o, {
+		onRetry: e.status === "error" ? () => y(e.id) : void 0,
+		onStop: e.status === "sending" ? () => b(e.id, e.text) : void 0,
+		children: e.imageUrls.length > 0 && /* @__PURE__ */ u(s, {
 			size: "small",
 			images: e.imageUrls
 		})
 	}, e.id)) });
 }
 //#endregion
-export { u as PendingUserMessages };
+export { d as PendingUserMessages };
 //# sourceMappingURL=pending-user-messages.js.map

package/dist/components/features/chat/pending-user-messages.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pending-user-messages.js","names":[],"sources":["../../../../src/components/features/chat/pending-user-messages.tsx"],"sourcesContent":["import React from \"react\";\nimport { useOptimisticUserMessageStore } from \"#/stores/optimistic-user-message-store\";\nimport { useSendMessage } from \"#/hooks/use-send-message\";\nimport { createChatMessage } from \"#/services/chat-service\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { matchesPendingConversationId } from \"#/utils/pending-task-message-link\";\nimport { ImageCarousel } from \"#/components/features/images/image-carousel\";\nimport { ChatMessage } from \"./chat-message\";\n\n/*\n Renders the queue of locally-tracked user messages that have been submitted\n * but not yet echoed back through the WebSocket. Each message shows a faded\n * \"sending\" treatment until the server echoes a real `UserMessageEvent`\n * (which removes it via `consumeMatchingPendingMessage`). If the API rejects the\n * send, the message switches to an \"error\" state with a retry button.\n \n The queue is global but each entry is tagged with the conversation id it\n * was enqueued from; this component filters to only entries belonging to the\n * active conversation, so switching conversations never carries pending\n * bubbles over.\n */\nexport function PendingUserMessages() {\n const { conversationId } = useOptionalConversationId();\n const pendingMessages = useOptimisticUserMessageStore(\n (state) => state.pendingMessages,\n );\n const markPendingMessageError = useOptimisticUserMessageStore(\n (state) => state.markPendingMessageError,\n );\n const markPendingMessageSending = useOptimisticUserMessageStore(\n (state) => state.markPendingMessageSending,\n );\n const { send } = useSendMessage();\n\n const visibleMessages = React.useMemo(\n () =>\n conversationId\n ? pendingMessages.filter((message) =>\n matchesPendingConversationId(\n conversationId,\n message.conversationId,\n ),\n )\n : [],\n [pendingMessages, conversationId],\n );\n\n const handleRetry = React.useCallback(\n async (id: string) => {\n const message = useOptimisticUserMessageStore\n .getState()\n .pendingMessages.find((entry) => entry.id === id);\n if (!message) return;\n\n markPendingMessageSending(id);\n\n try {\n await send(\n createChatMessage(\n message.text,\n message.imageUrls,\n message.fileUrls,\n message.timestamp,\n ),\n );\n } catch (error) {\n const errorMessage =\n error instanceof Error ? error.message : \"Failed to send message\";\n markPendingMessageError(id, errorMessage);\n }\n },\n [send, markPendingMessageError, markPendingMessageSending],\n );\n\n if (visibleMessages.length === 0) {\n return null;\n }\n\n return (\n <>\n {visibleMessages.map((message) => (\n <ChatMessage\n key={message.id}\n type=\"user\"\n message={message.text}\n pendingStatus={message.status}\n onRetry={\n message.status === \"error\"\n ? () => handleRetry(message.id)\n : undefined\n }\n >\n {message.imageUrls.length > 0 && (\n <ImageCarousel size=\"small\" images={message.imageUrls} />\n )}\n </ChatMessage>\n ))}\n </>\n );\n}\n"],"mappings":"~~;;;;;;;;;;AAqBA~~,SAAgB,IAAsB;CACpC,IAAM,EAAE,sBAAmB,GAA2B,EAChD,IAAkB,GACrB,MAAU,EAAM,gBAClB,EACK,IAA0B,GAC7B,MAAU,EAAM,wBAClB,EACK,IAA4B,GAC/B,MAAU,EAAM,0BAClB,EACK,EAAE,YAAS,GAAgB,EAE3B,IAAkB,EAAM,cAE1B,IACI,EAAgB,QAAQ,MACtB,EACE,GACA,EAAQ,eACT,CACF,GACD,EAAE,EACR,CAAC,GAAiB,EAAe,CAClC,EAEK,IAAc,EAAM,YACxB,OAAO,MAAe;EACpB,IAAM,IAAU,EACb,UAAU,CACV,gBAAgB,MAAM,MAAU,EAAM,OAAO,EAAG;AAC9C,SAEL;KAA0B,EAAG;AAE7B,OAAI;AACF,UAAM,EACJ,EACE,EAAQ,MACR,EAAQ,WACR,EAAQ,UACR,EAAQ,UACT,CACF;YACM,GAAO;AAGd,MAAwB,GADtB,aAAiB,QAAQ,EAAM,UAAU,yBACF;;;IAG7C;EAAC;EAAM;EAAyB;EAA0B,CAC3D;AAMD,QAJI,EAAgB,WAAW,IACtB,OAIP,kBAAA,GAAA,EAAA,UACG,EAAgB,KAAK,MACpB,kBAAC,GAAD;EAEE,MAAK;EACL,SAAS,EAAQ;EACjB,eAAe,EAAQ;EACvB,SACE,EAAQ,WAAW,gBACT,EAAY,EAAQ,GAAG,GAC7B,KAAA;YAGL,EAAQ,UAAU,SAAS,KAC1B,kBAAC,GAAD;GAAe,MAAK;GAAQ,QAAQ,EAAQ;GAAa,CAAA;EAE/C,~~EAbP~~,EAAQ,~~GAaD~~,CACd,EACD,CAAA"}
1	+ {"version":3,"file":"pending-user-messages.js","names":[],"sources":["../../../../src/components/features/chat/pending-user-messages.tsx"],"sourcesContent":["import React from \"react\";\nimport { useOptimisticUserMessageStore } from \"#/stores/optimistic-user-message-store\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { useSendMessage } from \"#/hooks/use-send-message\";\nimport { createChatMessage } from \"#/services/chat-service\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { matchesPendingConversationId } from \"#/utils/pending-task-message-link\";\nimport { ImageCarousel } from \"#/components/features/images/image-carousel\";\nimport { ChatMessage } from \"./chat-message\";\n\n/*\n Renders the queue of locally-tracked user messages that have been submitted\n * but not yet echoed back through the WebSocket. Each message shows a faded\n * \"sending\" treatment until the server echoes a real `UserMessageEvent`\n * (which removes it via `consumeMatchingPendingMessage`). If the API rejects the\n * send, the message switches to an \"error\" state with a retry button.\n \n The queue is global but each entry is tagged with the conversation id it\n * was enqueued from; this component filters to only entries belonging to the\n * active conversation, so switching conversations never carries pending\n * bubbles over.\n */\nexport function PendingUserMessages() {\n const { conversationId } = useOptionalConversationId();\n const pendingMessages = useOptimisticUserMessageStore(\n (state) => state.pendingMessages,\n );\n const markPendingMessageError = useOptimisticUserMessageStore(\n (state) => state.markPendingMessageError,\n );\n const markPendingMessageSending = useOptimisticUserMessageStore(\n (state) => state.markPendingMessageSending,\n );\n const removePendingMessage = useOptimisticUserMessageStore(\n (state) => state.removePendingMessage,\n );\n const restoreMessageToInputIfEmpty = useConversationStore(\n (state) => state.restoreMessageToInputIfEmpty,\n );\n const { send } = useSendMessage();\n\n const visibleMessages = React.useMemo(\n () =>\n conversationId\n ? pendingMessages.filter((message) =>\n matchesPendingConversationId(\n conversationId,\n message.conversationId,\n ),\n )\n : [],\n [pendingMessages, conversationId],\n );\n\n const handleRetry = React.useCallback(\n async (id: string) => {\n const message = useOptimisticUserMessageStore\n .getState()\n .pendingMessages.find((entry) => entry.id === id);\n if (!message) return;\n\n markPendingMessageSending(id);\n\n try {\n await send(\n createChatMessage(\n message.text,\n message.imageUrls,\n message.fileUrls,\n message.timestamp,\n ),\n );\n } catch (error) {\n const errorMessage =\n error instanceof Error ? error.message : \"Failed to send message\";\n markPendingMessageError(id, errorMessage);\n }\n },\n [send, markPendingMessageError, markPendingMessageSending],\n );\n\n const handleStop = React.useCallback(\n (id: string, text: string) => {\n restoreMessageToInputIfEmpty(text);\n removePendingMessage(id);\n },\n [restoreMessageToInputIfEmpty, removePendingMessage],\n );\n\n if (visibleMessages.length === 0) {\n return null;\n }\n\n return (\n <>\n {visibleMessages.map((message) => (\n <ChatMessage\n key={message.id}\n type=\"user\"\n message={message.text}\n pendingStatus={message.status}\n onRetry={\n message.status === \"error\"\n ? () => handleRetry(message.id)\n : undefined\n }\n onStop={\n message.status === \"sending\"\n ? () => handleStop(message.id, message.text)\n : undefined\n }\n >\n {message.imageUrls.length > 0 && (\n <ImageCarousel size=\"small\" images={message.imageUrls} />\n )}\n </ChatMessage>\n ))}\n </>\n );\n}\n"],"mappings":";;;;;;;;;;;AAsBA,SAAgB,IAAsB;CACpC,IAAM,EAAE,sBAAmB,GAA2B,EAChD,IAAkB,GACrB,MAAU,EAAM,gBAClB,EACK,IAA0B,GAC7B,MAAU,EAAM,wBAClB,EACK,IAA4B,GAC/B,MAAU,EAAM,0BAClB,EACK,IAAuB,GAC1B,MAAU,EAAM,qBAClB,EACK,IAA+B,GAClC,MAAU,EAAM,6BAClB,EACK,EAAE,YAAS,GAAgB,EAE3B,IAAkB,EAAM,cAE1B,IACI,EAAgB,QAAQ,MACtB,EACE,GACA,EAAQ,eACT,CACF,GACD,EAAE,EACR,CAAC,GAAiB,EAAe,CAClC,EAEK,IAAc,EAAM,YACxB,OAAO,MAAe;EACpB,IAAM,IAAU,EACb,UAAU,CACV,gBAAgB,MAAM,MAAU,EAAM,OAAO,EAAG;AAC9C,SAEL;KAA0B,EAAG;AAE7B,OAAI;AACF,UAAM,EACJ,EACE,EAAQ,MACR,EAAQ,WACR,EAAQ,UACR,EAAQ,UACT,CACF;YACM,GAAO;AAGd,MAAwB,GADtB,aAAiB,QAAQ,EAAM,UAAU,yBACF;;;IAG7C;EAAC;EAAM;EAAyB;EAA0B,CAC3D,EAEK,IAAa,EAAM,aACtB,GAAY,MAAiB;AAE5B,EADA,EAA6B,EAAK,EAClC,EAAqB,EAAG;IAE1B,CAAC,GAA8B,EAAqB,CACrD;AAMD,QAJI,EAAgB,WAAW,IACtB,OAIP,kBAAA,GAAA,EAAA,UACG,EAAgB,KAAK,MACpB,kBAAC,GAAD;EAEE,MAAK;EACL,SAAS,EAAQ;EACjB,eAAe,EAAQ;EACvB,SACE,EAAQ,WAAW,gBACT,EAAY,EAAQ,GAAG,GAC7B,KAAA;EAEN,QACE,EAAQ,WAAW,kBACT,EAAW,EAAQ,IAAI,EAAQ,KAAK,GAC1C,KAAA;YAGL,EAAQ,UAAU,SAAS,KAC1B,kBAAC,GAAD;GAAe,MAAK;GAAQ,QAAQ,EAAQ;GAAa,CAAA;EAE/C,EAlBP,EAAQ,GAkBD,CACd,EACD,CAAA"}

package/dist/components/features/chat/switch-profile-button.cjs CHANGED Viewed

@@ -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(`../../../utils/utils.cjs`),i=require(`../../../hooks/use-conversation-id.cjs`),a=require(`../../../stores/model-store.cjs`),o=require(`../../../hooks/query/use-active-conversation.cjs`),s=require(`../../../hooks/query/use-llm-profiles.cjs`),c=require(`../../../hooks/query/use-settings.cjs`),l=require(`../../../ui/combobox-caret.cjs`),u=require(`../../../hooks/mutation/use-switch-llm-profile-and-log.cjs`),d=require(`./switch-profile-context-menu.cjs`);let f=require(`react`);f=e.__toESM(f,1);let p=require(`react/jsx-runtime`);function m(){let{t:e}=t.useTranslation(`openhands`),[m,h]=f.default.useState(!1),{conversationId:g}=i.useOptionalConversationId(),{data:_}=s.useLlmProfiles(),{data:v}=o.useActiveConversation(),{data:y}=c.useSettings(),{switchAndLog:b,isPending:x}=u.useSwitchLlmProfileAndLog(),S=a.useModelStore(e=>g?e.activeProfileByConversation[g]:void 0),C=_?.profiles??[],w=v?.llm_model??null,T=v?.agent_kind===`acp`||!v&&y?.agent_settings?.agent_kind===`acp`,E=S??(w?C.find(e=>e.model===w)?.name??null:_?.active_profile??null),D=C.find(e=>e.name===E)?.model??w??null;return C.length===0||T?null:(0,p.jsxs)(`div`,{className:`relative`,children:[(0,p.jsxs)(`button`,{type:`button`,onClick:e=>{e.preventDefault(),e.stopPropagation(),h(e=>!e)},disabled:x,"data-testid":`switch-profile-button`,title:D??void 0,"aria-haspopup":`menu`,"aria-expanded":m,className:r.cn(`inline-flex items-center gap-1 rounded-[100px] border border-transparent px-1.5 text-sm font-normal leading-5 text-[var(--oh-muted)] whitespace-nowrap min-w-0 transition-[border-color,background-color,box-shadow,opacity] duration-150 motion-reduce:transition-none max-w-[200px]`,`hover:text-white hover:bg-white/10 cursor-pointer`,`disabled:opacity-50 disabled:cursor-not-allowed`),children:[(0,p.jsx)(`span`,{className:`truncate`,children:E??e(n.I18nKey.LLM$SELECT_MODEL_PLACEHOLDER)}),(0,p.jsx)(l.ComboboxCaretInline,{isOpen:m})]}),m&&(0,p.jsx)(d.SwitchProfileContextMenu,{profiles:C,activeProfileName:E,onSelect:e=>{e!==E&&b(g,e)},onClose:()=>h(!1)})]})}exports.SwitchProfileButton=m;
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../utils/utils.cjs`),i=require(`../../../hooks/use-conversation-id.cjs`),a=require(`../../../stores/model-store.cjs`),o=require(`../../../hooks/query/use-active-conversation.cjs`),s=require(`../../../utils/form-control-classes.cjs`),c=require(`../../../hooks/query/use-llm-profiles.cjs`),l=require(`../../../hooks/query/use-settings.cjs`),u=require(`../../../ui/combobox-caret.cjs`),d=require(`../../../hooks/mutation/use-switch-llm-profile-and-log.cjs`),f=require(`./switch-profile-context-menu.cjs`);let p=require(`react`);p=e.__toESM(p,1);let m=require(`react/jsx-runtime`);function h(){let{t:e}=t.useTranslation(`openhands`),[h,g]=p.default.useState(!1),{conversationId:_}=i.useOptionalConversationId(),{data:v}=c.useLlmProfiles(),{data:y}=o.useActiveConversation(),{data:b}=l.useSettings(),{switchAndLog:x,isPending:S}=d.useSwitchLlmProfileAndLog(),C=a.useModelStore(e=>_?e.activeProfileByConversation[_]:void 0),w=v?.profiles??[],T=y?.llm_model??null,E=y?.agent_kind===`acp`||!y&&b?.agent_settings?.agent_kind===`acp`,D=C??(T?w.find(e=>e.model===T)?.name??null:v?.active_profile??null),O=w.find(e=>e.name===D)?.model??T??null;return w.length===0||E?null:(0,m.jsxs)(`div`,{className:`relative`,children:[(0,m.jsxs)(`button`,{type:`button`,onClick:e=>{e.preventDefault(),e.stopPropagation(),g(e=>!e)},disabled:S,"data-testid":`switch-profile-button`,title:O??void 0,"aria-haspopup":`menu`,"aria-expanded":h,className:r.cn(s.chatInputPillButtonClassName,`max-w-[200px]`,`disabled:opacity-50 disabled:cursor-not-allowed`),children:[(0,m.jsx)(`span`,{className:`truncate`,children:D??e(n.I18nKey.LLM$SELECT_MODEL_PLACEHOLDER)}),(0,m.jsx)(u.ComboboxCaretInline,{isOpen:h})]}),h&&(0,m.jsx)(f.SwitchProfileContextMenu,{profiles:w,activeProfileName:D,onSelect:e=>{e!==D&&x(_,e)},onClose:()=>g(!1)})]})}exports.SwitchProfileButton=h;
 //# sourceMappingURL=switch-profile-button.cjs.map

package/dist/components/features/chat/switch-profile-button.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"switch-profile-button.cjs","names":[],"sources":["../../../../src/components/features/chat/switch-profile-button.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ComboboxCaretInline } from \"#/ui/combobox-caret\";\nimport { useLlmProfiles } from \"#/hooks/query/use-llm-profiles\";\nimport { useSwitchLlmProfileAndLog } from \"#/hooks/mutation/use-switch-llm-profile-and-log\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useSettings } from \"#/hooks/query/use-settings\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { useModelStore } from \"#/stores/model-store\";\nimport { cn } from \"#/utils/utils\";\nimport { SwitchProfileContextMenu } from \"./switch-profile-context-menu\";\n\nexport function SwitchProfileButton() {\n const { t } = useTranslation(\"openhands\");\n const [contextMenuOpen, setContextMenuOpen] = React.useState(false);\n // Null on the home page; `useSwitchLlmProfileAndLog` is fine with that\n // because /api/profiles/<name>/activate is a global endpoint.\n const { conversationId } = useOptionalConversationId();\n const { data } = useLlmProfiles();\n const { data: conversation } = useActiveConversation();\n const { data: settings } = useSettings();\n const { switchAndLog, isPending } = useSwitchLlmProfileAndLog();\n // Optimistic value written by recordSwitch on a successful switch — gives\n // instant in-conversation feedback before the conversation refetch lands\n // with the new `llm_model`.\n const optimisticActiveProfile = useModelStore((s) =>\n conversationId ? s.activeProfileByConversation[conversationId] : undefined,\n );\n\n const profiles = data?.profiles ?? [];\n const conversationModel = conversation?.llm_model ?? null;\n // ACPAgent conversations route prompts to a CLI subprocess whose model is\n // controlled by ``acp_model`` (set in Settings → Agent), not by the LLM\n // profile picker. Surfacing the switcher here would let the user \"change\n // the model\" while the running subprocess silently keeps its own — a\n // confusing no-op. Hide the button even when ``llm_model`` carries an ACP\n // display model for chips/headers.\n //\n // On the home screen ``conversation`` is undefined; fall back to\n // ``settings.agent_settings.agent_kind`` so the picker also hides when\n // ACP is the default the next-created conversation would inherit.\n // Otherwise an ACP user lands on a home page with an LLM-switch\n // control that contradicts the ACP nav gating everywhere else.\n const isAcpActive =\n conversation?.agent_kind === \"acp\" \|\|\n (!conversation && settings?.agent_settings?.agent_kind === \"acp\");\n\n // Resolution priority for the active profile name:\n // 1. Optimistic (just-clicked) — instant feedback before the refetch.\n // 2. Profile whose model matches the running llm_model — cold loads.\n // 3. User-level active_profile — home page / before the conversation has\n // sent any messages.\n const activeProfileName =\n optimisticActiveProfile ??\n (conversationModel\n ? (profiles.find((p) => p.model === conversationModel)?.name ?? null)\n : (data?.active_profile ?? null));\n const activeProfileModel =\n profiles.find((p) => p.name === activeProfileName)?.model ??\n conversationModel ??\n null;\n\n if (profiles.length === 0 \|\| isAcpActive) {\n return null;\n }\n\n const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n setContextMenuOpen((open) => !open);\n };\n\n const handleSelect = (profileName: string) => {\n if (profileName === activeProfileName) return;\n switchAndLog(conversationId, profileName);\n };\n\n return (\n <div className=\"relative\">\n <button\n type=\"button\"\n onClick={handleClick}\n disabled={isPending}\n data-testid=\"switch-profile-button\"\n title={activeProfileModel ?? undefined}\n aria-haspopup=\"menu\"\n aria-expanded={contextMenuOpen}\n className={cn(\n \"inline-flex items-center gap-1 rounded-[100px] border border-transparent px-1.5 text-sm font-normal leading-5 text-[var(--oh-muted)] whitespace-nowrap min-w-0 transition-[border-color,background-color,box-shadow,opacity] duration-150 motion-reduce:transition-none max-w-[200px]\",\n \"~~hover:text-white hover:bg-white/10 cursor-pointer\",\n \"~~disabled:opacity-50 disabled:cursor-not-allowed\",\n )}\n >\n <span className=\"truncate\">\n {activeProfileName ?? t(I18nKey.LLM$SELECT_MODEL_PLACEHOLDER)}\n </span>\n <ComboboxCaretInline isOpen={contextMenuOpen} />\n </button>\n {contextMenuOpen && (\n <SwitchProfileContextMenu\n profiles={profiles}\n activeProfileName={activeProfileName}\n onSelect={handleSelect}\n onClose={() => setContextMenuOpen(false)}\n />\n )}\n </div>\n );\n}\n"],"mappings":"~~+sBAaA~~,SAAgB,GAAsB,CACpC,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,CAAC,EAAiB,GAAsB,EAAA,QAAM,SAAS,GAAM,CAG7D,CAAE,kBAAmB,EAAA,2BAA2B,CAChD,CAAE,QAAS,EAAA,gBAAgB,CAC3B,CAAE,KAAM,GAAiB,EAAA,uBAAuB,CAChD,CAAE,KAAM,GAAa,EAAA,aAAa,CAClC,CAAE,eAAc,aAAc,EAAA,2BAA2B,CAIzD,EAA0B,EAAA,cAAe,GAC7C,EAAiB,EAAE,4BAA4B,GAAkB,IAAA,GAClE,CAEK,EAAW,GAAM,UAAY,EAAE,CAC/B,EAAoB,GAAc,WAAa,KAa/C,EACJ,GAAc,aAAe,OAC5B,CAAC,GAAgB,GAAU,gBAAgB,aAAe,MAOvD,EACJ,IACC,EACI,EAAS,KAAM,GAAM,EAAE,QAAU,EAAkB,EAAE,MAAQ,KAC7D,GAAM,gBAAkB,MACzB,EACJ,EAAS,KAAM,GAAM,EAAE,OAAS,EAAkB,EAAE,OACpD,GACA,KAiBF,OAfI,EAAS,SAAW,GAAK,EACpB,MAeP,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,oBAAf,EACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,QAfe,GAA+C,CAClE,EAAM,gBAAgB,CACtB,EAAM,iBAAiB,CACvB,EAAoB,GAAS,CAAC,EAAK,EAa/B,SAAU,EACV,cAAY,wBACZ,MAAO,GAAsB,IAAA,GAC7B,gBAAc,OACd,gBAAe,EACf,UAAW,EAAA,GACT,~~wRACA~~,~~oDACA~~,kDACD,UAZH,EAcE,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,oBACb,GAAqB,EAAE,EAAA,QAAQ,6BAA6B,CACxD,CAAA,EACP,EAAA,EAAA,KAAC,EAAA,oBAAD,CAAqB,OAAQ,EAAmB,CAAA,CACzC,GACR,IACC,EAAA,EAAA,KAAC,EAAA,yBAAD,CACY,WACS,oBACnB,SA9Bc,GAAwB,CACxC,IAAgB,GACpB,EAAa,EAAgB,EAAY,EA6BnC,YAAe,EAAmB,GAAM,CACxC,CAAA,CAEA"}
1	+ {"version":3,"file":"switch-profile-button.cjs","names":[],"sources":["../../../../src/components/features/chat/switch-profile-button.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ComboboxCaretInline } from \"#/ui/combobox-caret\";\nimport { useLlmProfiles } from \"#/hooks/query/use-llm-profiles\";\nimport { useSwitchLlmProfileAndLog } from \"#/hooks/mutation/use-switch-llm-profile-and-log\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useSettings } from \"#/hooks/query/use-settings\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { useModelStore } from \"#/stores/model-store\";\nimport { cn } from \"#/utils/utils\";\nimport { chatInputPillButtonClassName } from \"#/utils/form-control-classes\";\nimport { SwitchProfileContextMenu } from \"./switch-profile-context-menu\";\n\nexport function SwitchProfileButton() {\n const { t } = useTranslation(\"openhands\");\n const [contextMenuOpen, setContextMenuOpen] = React.useState(false);\n // Null on the home page; `useSwitchLlmProfileAndLog` is fine with that\n // because /api/profiles/<name>/activate is a global endpoint.\n const { conversationId } = useOptionalConversationId();\n const { data } = useLlmProfiles();\n const { data: conversation } = useActiveConversation();\n const { data: settings } = useSettings();\n const { switchAndLog, isPending } = useSwitchLlmProfileAndLog();\n // Optimistic value written by recordSwitch on a successful switch — gives\n // instant in-conversation feedback before the conversation refetch lands\n // with the new `llm_model`.\n const optimisticActiveProfile = useModelStore((s) =>\n conversationId ? s.activeProfileByConversation[conversationId] : undefined,\n );\n\n const profiles = data?.profiles ?? [];\n const conversationModel = conversation?.llm_model ?? null;\n // ACPAgent conversations route prompts to a CLI subprocess whose model is\n // controlled by ``acp_model`` (set in Settings → Agent), not by the LLM\n // profile picker. Surfacing the switcher here would let the user \"change\n // the model\" while the running subprocess silently keeps its own — a\n // confusing no-op. Hide the button even when ``llm_model`` carries an ACP\n // display model for chips/headers.\n //\n // On the home screen ``conversation`` is undefined; fall back to\n // ``settings.agent_settings.agent_kind`` so the picker also hides when\n // ACP is the default the next-created conversation would inherit.\n // Otherwise an ACP user lands on a home page with an LLM-switch\n // control that contradicts the ACP nav gating everywhere else.\n const isAcpActive =\n conversation?.agent_kind === \"acp\" \|\|\n (!conversation && settings?.agent_settings?.agent_kind === \"acp\");\n\n // Resolution priority for the active profile name:\n // 1. Optimistic (just-clicked) — instant feedback before the refetch.\n // 2. Profile whose model matches the running llm_model — cold loads.\n // 3. User-level active_profile — home page / before the conversation has\n // sent any messages.\n const activeProfileName =\n optimisticActiveProfile ??\n (conversationModel\n ? (profiles.find((p) => p.model === conversationModel)?.name ?? null)\n : (data?.active_profile ?? null));\n const activeProfileModel =\n profiles.find((p) => p.name === activeProfileName)?.model ??\n conversationModel ??\n null;\n\n if (profiles.length === 0 \|\| isAcpActive) {\n return null;\n }\n\n const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n setContextMenuOpen((open) => !open);\n };\n\n const handleSelect = (profileName: string) => {\n if (profileName === activeProfileName) return;\n switchAndLog(conversationId, profileName);\n };\n\n return (\n <div className=\"relative\">\n <button\n type=\"button\"\n onClick={handleClick}\n disabled={isPending}\n data-testid=\"switch-profile-button\"\n title={activeProfileModel ?? undefined}\n aria-haspopup=\"menu\"\n aria-expanded={contextMenuOpen}\n className={cn(\n chatInputPillButtonClassName,\n \"max-w-[200px]\",\n \"disabled:opacity-50 disabled:cursor-not-allowed\",\n )}\n >\n <span className=\"truncate\">\n {activeProfileName ?? t(I18nKey.LLM$SELECT_MODEL_PLACEHOLDER)}\n </span>\n <ComboboxCaretInline isOpen={contextMenuOpen} />\n </button>\n {contextMenuOpen && (\n <SwitchProfileContextMenu\n profiles={profiles}\n activeProfileName={activeProfileName}\n onSelect={handleSelect}\n onClose={() => setContextMenuOpen(false)}\n />\n )}\n </div>\n );\n}\n"],"mappings":"owBAcA,SAAgB,GAAsB,CACpC,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,CAAC,EAAiB,GAAsB,EAAA,QAAM,SAAS,GAAM,CAG7D,CAAE,kBAAmB,EAAA,2BAA2B,CAChD,CAAE,QAAS,EAAA,gBAAgB,CAC3B,CAAE,KAAM,GAAiB,EAAA,uBAAuB,CAChD,CAAE,KAAM,GAAa,EAAA,aAAa,CAClC,CAAE,eAAc,aAAc,EAAA,2BAA2B,CAIzD,EAA0B,EAAA,cAAe,GAC7C,EAAiB,EAAE,4BAA4B,GAAkB,IAAA,GAClE,CAEK,EAAW,GAAM,UAAY,EAAE,CAC/B,EAAoB,GAAc,WAAa,KAa/C,EACJ,GAAc,aAAe,OAC5B,CAAC,GAAgB,GAAU,gBAAgB,aAAe,MAOvD,EACJ,IACC,EACI,EAAS,KAAM,GAAM,EAAE,QAAU,EAAkB,EAAE,MAAQ,KAC7D,GAAM,gBAAkB,MACzB,EACJ,EAAS,KAAM,GAAM,EAAE,OAAS,EAAkB,EAAE,OACpD,GACA,KAiBF,OAfI,EAAS,SAAW,GAAK,EACpB,MAeP,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,oBAAf,EACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,QAfe,GAA+C,CAClE,EAAM,gBAAgB,CACtB,EAAM,iBAAiB,CACvB,EAAoB,GAAS,CAAC,EAAK,EAa/B,SAAU,EACV,cAAY,wBACZ,MAAO,GAAsB,IAAA,GAC7B,gBAAc,OACd,gBAAe,EACf,UAAW,EAAA,GACT,EAAA,6BACA,gBACA,kDACD,UAZH,EAcE,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,oBACb,GAAqB,EAAE,EAAA,QAAQ,6BAA6B,CACxD,CAAA,EACP,EAAA,EAAA,KAAC,EAAA,oBAAD,CAAqB,OAAQ,EAAmB,CAAA,CACzC,GACR,IACC,EAAA,EAAA,KAAC,EAAA,yBAAD,CACY,WACS,oBACnB,SA9Bc,GAAwB,CACxC,IAAgB,GACpB,EAAa,EAAgB,EAAY,EA6BnC,YAAe,EAAmB,GAAM,CACxC,CAAA,CAEA"}

package/dist/components/features/chat/switch-profile-button.js CHANGED Viewed

@@ -4,44 +4,45 @@ import { cn as n } from "../../../utils/utils.js";
 import { useOptionalConversationId as r } from "../../../hooks/use-conversation-id.js";
 import { useModelStore as i } from "../../../stores/model-store.js";
 import { useActiveConversation as a } from "../../../hooks/query/use-active-conversation.js";
-import { useLlmProfiles as o } from "../../../hooks/query/use-llm-profiles.js";
-import { useSettings as s } from "../../../hooks/query/use-settings.js";
-import { ComboboxCaretInline as c } from "../../../ui/combobox-caret.js";
-import { useSwitchLlmProfileAndLog as l } from "../../../hooks/mutation/use-switch-llm-profile-and-log.js";
-import { SwitchProfileContextMenu as u } from "./switch-profile-context-menu.js";
-import d from "react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { chatInputPillButtonClassName as o } from "../../../utils/form-control-classes.js";
+import { useLlmProfiles as s } from "../../../hooks/query/use-llm-profiles.js";
+import { useSettings as c } from "../../../hooks/query/use-settings.js";
+import { ComboboxCaretInline as l } from "../../../ui/combobox-caret.js";
+import { useSwitchLlmProfileAndLog as u } from "../../../hooks/mutation/use-switch-llm-profile-and-log.js";
+import { SwitchProfileContextMenu as d } from "./switch-profile-context-menu.js";
+import f from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
 //#region src/components/features/chat/switch-profile-button.tsx
-function m() {
-	let { t: m } = e("openhands"), [h, g] = d.useState(!1), { conversationId: _ } = r(), { data: v } = o(), { data: y } = a(), { data: b } = s(), { switchAndLog: x, isPending: S } = l(), C = i((e) => _ ? e.activeProfileByConversation[_] : void 0), w = v?.profiles ?? [], T = y?.llm_model ?? null, E = y?.agent_kind === "acp" || !y && b?.agent_settings?.agent_kind === "acp", D = C ?? (T ? w.find((e) => e.model === T)?.name ?? null : v?.active_profile ?? null), O = w.find((e) => e.name === D)?.model ?? T ?? null;
-	return w.length === 0 || E ? null : /* @__PURE__ */ p("div", {
+function h() {
+	let { t: h } = e("openhands"), [g, _] = f.useState(!1), { conversationId: v } = r(), { data: y } = s(), { data: b } = a(), { data: x } = c(), { switchAndLog: S, isPending: C } = u(), w = i((e) => v ? e.activeProfileByConversation[v] : void 0), T = y?.profiles ?? [], E = b?.llm_model ?? null, D = b?.agent_kind === "acp" || !b && x?.agent_settings?.agent_kind === "acp", O = w ?? (E ? T.find((e) => e.model === E)?.name ?? null : y?.active_profile ?? null), k = T.find((e) => e.name === O)?.model ?? E ?? null;
+	return T.length === 0 || D ? null : /* @__PURE__ */ m("div", {
 		className: "relative",
-		children: [/* @__PURE__ */ p("button", {
+		children: [/* @__PURE__ */ m("button", {
 			type: "button",
 			onClick: (e) => {
-				e.preventDefault(), e.stopPropagation(), g((e) => !e);
+				e.preventDefault(), e.stopPropagation(), _((e) => !e);
 			},
-			disabled: S,
+			disabled: C,
 			"data-testid": "switch-profile-button",
-			title: O ?? void 0,
+			title: k ?? void 0,
 			"aria-haspopup": "menu",
-			"aria-expanded": h,
-			className: n("inline-flex items-center gap-1 rounded-[100px] border border-transparent px-1.5 text-sm font-normal leading-5 text-[var(--oh-muted)] whitespace-nowrap min-w-0 transition-[border-color,background-color,box-shadow,opacity] duration-150 motion-reduce:transition-none max-w-[200px]", "hover:text-white hover:bg-white/10 cursor-pointer", "disabled:opacity-50 disabled:cursor-not-allowed"),
-			children: [/* @__PURE__ */ f("span", {
+			"aria-expanded": g,
+			className: n(o, "max-w-[200px]", "disabled:opacity-50 disabled:cursor-not-allowed"),
+			children: [/* @__PURE__ */ p("span", {
 				className: "truncate",
-				children: D ?? m(t.LLM$SELECT_MODEL_PLACEHOLDER)
-			}), /* @__PURE__ */ f(c, { isOpen: h })]
-		}), h && /* @__PURE__ */ f(u, {
-			profiles: w,
-			activeProfileName: D,
+				children: O ?? h(t.LLM$SELECT_MODEL_PLACEHOLDER)
+			}), /* @__PURE__ */ p(l, { isOpen: g })]
+		}), g && /* @__PURE__ */ p(d, {
+			profiles: T,
+			activeProfileName: O,
 			onSelect: (e) => {
-				e !== D && x(_, e);
+				e !== O && S(v, e);
 			},
-			onClose: () => g(!1)
+			onClose: () => _(!1)
 		})]
 	});
 }
 //#endregion
-export { m as SwitchProfileButton };
+export { h as SwitchProfileButton };
 //# sourceMappingURL=switch-profile-button.js.map

package/dist/components/features/chat/switch-profile-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"switch-profile-button.js","names":[],"sources":["../../../../src/components/features/chat/switch-profile-button.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ComboboxCaretInline } from \"#/ui/combobox-caret\";\nimport { useLlmProfiles } from \"#/hooks/query/use-llm-profiles\";\nimport { useSwitchLlmProfileAndLog } from \"#/hooks/mutation/use-switch-llm-profile-and-log\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useSettings } from \"#/hooks/query/use-settings\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { useModelStore } from \"#/stores/model-store\";\nimport { cn } from \"#/utils/utils\";\nimport { SwitchProfileContextMenu } from \"./switch-profile-context-menu\";\n\nexport function SwitchProfileButton() {\n const { t } = useTranslation(\"openhands\");\n const [contextMenuOpen, setContextMenuOpen] = React.useState(false);\n // Null on the home page; `useSwitchLlmProfileAndLog` is fine with that\n // because /api/profiles/<name>/activate is a global endpoint.\n const { conversationId } = useOptionalConversationId();\n const { data } = useLlmProfiles();\n const { data: conversation } = useActiveConversation();\n const { data: settings } = useSettings();\n const { switchAndLog, isPending } = useSwitchLlmProfileAndLog();\n // Optimistic value written by recordSwitch on a successful switch — gives\n // instant in-conversation feedback before the conversation refetch lands\n // with the new `llm_model`.\n const optimisticActiveProfile = useModelStore((s) =>\n conversationId ? s.activeProfileByConversation[conversationId] : undefined,\n );\n\n const profiles = data?.profiles ?? [];\n const conversationModel = conversation?.llm_model ?? null;\n // ACPAgent conversations route prompts to a CLI subprocess whose model is\n // controlled by ``acp_model`` (set in Settings → Agent), not by the LLM\n // profile picker. Surfacing the switcher here would let the user \"change\n // the model\" while the running subprocess silently keeps its own — a\n // confusing no-op. Hide the button even when ``llm_model`` carries an ACP\n // display model for chips/headers.\n //\n // On the home screen ``conversation`` is undefined; fall back to\n // ``settings.agent_settings.agent_kind`` so the picker also hides when\n // ACP is the default the next-created conversation would inherit.\n // Otherwise an ACP user lands on a home page with an LLM-switch\n // control that contradicts the ACP nav gating everywhere else.\n const isAcpActive =\n conversation?.agent_kind === \"acp\" \|\|\n (!conversation && settings?.agent_settings?.agent_kind === \"acp\");\n\n // Resolution priority for the active profile name:\n // 1. Optimistic (just-clicked) — instant feedback before the refetch.\n // 2. Profile whose model matches the running llm_model — cold loads.\n // 3. User-level active_profile — home page / before the conversation has\n // sent any messages.\n const activeProfileName =\n optimisticActiveProfile ??\n (conversationModel\n ? (profiles.find((p) => p.model === conversationModel)?.name ?? null)\n : (data?.active_profile ?? null));\n const activeProfileModel =\n profiles.find((p) => p.name === activeProfileName)?.model ??\n conversationModel ??\n null;\n\n if (profiles.length === 0 \|\| isAcpActive) {\n return null;\n }\n\n const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n setContextMenuOpen((open) => !open);\n };\n\n const handleSelect = (profileName: string) => {\n if (profileName === activeProfileName) return;\n switchAndLog(conversationId, profileName);\n };\n\n return (\n <div className=\"relative\">\n <button\n type=\"button\"\n onClick={handleClick}\n disabled={isPending}\n data-testid=\"switch-profile-button\"\n title={activeProfileModel ?? undefined}\n aria-haspopup=\"menu\"\n aria-expanded={contextMenuOpen}\n className={cn(\n \"inline-flex items-center gap-1 rounded-[100px] border border-transparent px-1.5 text-sm font-normal leading-5 text-[var(--oh-muted)] whitespace-nowrap min-w-0 transition-[border-color,background-color,box-shadow,opacity] duration-150 motion-reduce:transition-none max-w-[200px]\",\n \"~~hover:text-white hover:bg-white/10 cursor-pointer\",\n \"~~disabled:opacity-50 disabled:cursor-not-allowed\",\n )}\n >\n <span className=\"truncate\">\n {activeProfileName ?? t(I18nKey.LLM$SELECT_MODEL_PLACEHOLDER)}\n </span>\n <ComboboxCaretInline isOpen={contextMenuOpen} />\n </button>\n {contextMenuOpen && (\n <SwitchProfileContextMenu\n profiles={profiles}\n activeProfileName={activeProfileName}\n onSelect={handleSelect}\n onClose={() => setContextMenuOpen(false)}\n />\n )}\n </div>\n );\n}\n"],"mappings":"~~;;;;;;;;;;;;;;AAaA~~,SAAgB,IAAsB;CACpC,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,CAAC,GAAiB,KAAsB,EAAM,SAAS,GAAM,EAG7D,EAAE,sBAAmB,GAA2B,EAChD,EAAE,YAAS,GAAgB,EAC3B,EAAE,MAAM,MAAiB,GAAuB,EAChD,EAAE,MAAM,MAAa,GAAa,EAClC,EAAE,iBAAc,iBAAc,GAA2B,EAIzD,IAA0B,GAAe,MAC7C,IAAiB,EAAE,4BAA4B,KAAkB,KAAA,EAClE,EAEK,IAAW,GAAM,YAAY,EAAE,EAC/B,IAAoB,GAAc,aAAa,MAa/C,IACJ,GAAc,eAAe,SAC5B,CAAC,KAAgB,GAAU,gBAAgB,eAAe,OAOvD,IACJ,MACC,IACI,EAAS,MAAM,MAAM,EAAE,UAAU,EAAkB,EAAE,QAAQ,OAC7D,GAAM,kBAAkB,OACzB,IACJ,EAAS,MAAM,MAAM,EAAE,SAAS,EAAkB,EAAE,SACpD,KACA;AAiBF,QAfI,EAAS,WAAW,KAAK,IACpB,OAeP,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,UAAD;GACE,MAAK;GACL,UAfe,MAA+C;AAGlE,IAFA,EAAM,gBAAgB,EACtB,EAAM,iBAAiB,EACvB,GAAoB,MAAS,CAAC,EAAK;;GAa/B,UAAU;GACV,eAAY;GACZ,OAAO,KAAsB,KAAA;GAC7B,iBAAc;GACd,iBAAe;GACf,WAAW,EACT,~~yRACA~~,~~qDACA~~,kDACD;aAZH,CAcE,kBAAC,QAAD;IAAM,WAAU;cACb,KAAqB,EAAE,EAAQ,6BAA6B;IACxD,CAAA,EACP,kBAAC,GAAD,EAAqB,QAAQ,GAAmB,CAAA,CACzC;MACR,KACC,kBAAC,GAAD;GACY;GACS;GACnB,WA9Bc,MAAwB;AACxC,UAAgB,KACpB,EAAa,GAAgB,EAAY;;GA6BnC,eAAe,EAAmB,GAAM;GACxC,CAAA,CAEA"}
1	+ {"version":3,"file":"switch-profile-button.js","names":[],"sources":["../../../../src/components/features/chat/switch-profile-button.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ComboboxCaretInline } from \"#/ui/combobox-caret\";\nimport { useLlmProfiles } from \"#/hooks/query/use-llm-profiles\";\nimport { useSwitchLlmProfileAndLog } from \"#/hooks/mutation/use-switch-llm-profile-and-log\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useSettings } from \"#/hooks/query/use-settings\";\nimport { useOptionalConversationId } from \"#/hooks/use-conversation-id\";\nimport { useModelStore } from \"#/stores/model-store\";\nimport { cn } from \"#/utils/utils\";\nimport { chatInputPillButtonClassName } from \"#/utils/form-control-classes\";\nimport { SwitchProfileContextMenu } from \"./switch-profile-context-menu\";\n\nexport function SwitchProfileButton() {\n const { t } = useTranslation(\"openhands\");\n const [contextMenuOpen, setContextMenuOpen] = React.useState(false);\n // Null on the home page; `useSwitchLlmProfileAndLog` is fine with that\n // because /api/profiles/<name>/activate is a global endpoint.\n const { conversationId } = useOptionalConversationId();\n const { data } = useLlmProfiles();\n const { data: conversation } = useActiveConversation();\n const { data: settings } = useSettings();\n const { switchAndLog, isPending } = useSwitchLlmProfileAndLog();\n // Optimistic value written by recordSwitch on a successful switch — gives\n // instant in-conversation feedback before the conversation refetch lands\n // with the new `llm_model`.\n const optimisticActiveProfile = useModelStore((s) =>\n conversationId ? s.activeProfileByConversation[conversationId] : undefined,\n );\n\n const profiles = data?.profiles ?? [];\n const conversationModel = conversation?.llm_model ?? null;\n // ACPAgent conversations route prompts to a CLI subprocess whose model is\n // controlled by ``acp_model`` (set in Settings → Agent), not by the LLM\n // profile picker. Surfacing the switcher here would let the user \"change\n // the model\" while the running subprocess silently keeps its own — a\n // confusing no-op. Hide the button even when ``llm_model`` carries an ACP\n // display model for chips/headers.\n //\n // On the home screen ``conversation`` is undefined; fall back to\n // ``settings.agent_settings.agent_kind`` so the picker also hides when\n // ACP is the default the next-created conversation would inherit.\n // Otherwise an ACP user lands on a home page with an LLM-switch\n // control that contradicts the ACP nav gating everywhere else.\n const isAcpActive =\n conversation?.agent_kind === \"acp\" \|\|\n (!conversation && settings?.agent_settings?.agent_kind === \"acp\");\n\n // Resolution priority for the active profile name:\n // 1. Optimistic (just-clicked) — instant feedback before the refetch.\n // 2. Profile whose model matches the running llm_model — cold loads.\n // 3. User-level active_profile — home page / before the conversation has\n // sent any messages.\n const activeProfileName =\n optimisticActiveProfile ??\n (conversationModel\n ? (profiles.find((p) => p.model === conversationModel)?.name ?? null)\n : (data?.active_profile ?? null));\n const activeProfileModel =\n profiles.find((p) => p.name === activeProfileName)?.model ??\n conversationModel ??\n null;\n\n if (profiles.length === 0 \|\| isAcpActive) {\n return null;\n }\n\n const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n setContextMenuOpen((open) => !open);\n };\n\n const handleSelect = (profileName: string) => {\n if (profileName === activeProfileName) return;\n switchAndLog(conversationId, profileName);\n };\n\n return (\n <div className=\"relative\">\n <button\n type=\"button\"\n onClick={handleClick}\n disabled={isPending}\n data-testid=\"switch-profile-button\"\n title={activeProfileModel ?? undefined}\n aria-haspopup=\"menu\"\n aria-expanded={contextMenuOpen}\n className={cn(\n chatInputPillButtonClassName,\n \"max-w-[200px]\",\n \"disabled:opacity-50 disabled:cursor-not-allowed\",\n )}\n >\n <span className=\"truncate\">\n {activeProfileName ?? t(I18nKey.LLM$SELECT_MODEL_PLACEHOLDER)}\n </span>\n <ComboboxCaretInline isOpen={contextMenuOpen} />\n </button>\n {contextMenuOpen && (\n <SwitchProfileContextMenu\n profiles={profiles}\n activeProfileName={activeProfileName}\n onSelect={handleSelect}\n onClose={() => setContextMenuOpen(false)}\n />\n )}\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAcA,SAAgB,IAAsB;CACpC,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,CAAC,GAAiB,KAAsB,EAAM,SAAS,GAAM,EAG7D,EAAE,sBAAmB,GAA2B,EAChD,EAAE,YAAS,GAAgB,EAC3B,EAAE,MAAM,MAAiB,GAAuB,EAChD,EAAE,MAAM,MAAa,GAAa,EAClC,EAAE,iBAAc,iBAAc,GAA2B,EAIzD,IAA0B,GAAe,MAC7C,IAAiB,EAAE,4BAA4B,KAAkB,KAAA,EAClE,EAEK,IAAW,GAAM,YAAY,EAAE,EAC/B,IAAoB,GAAc,aAAa,MAa/C,IACJ,GAAc,eAAe,SAC5B,CAAC,KAAgB,GAAU,gBAAgB,eAAe,OAOvD,IACJ,MACC,IACI,EAAS,MAAM,MAAM,EAAE,UAAU,EAAkB,EAAE,QAAQ,OAC7D,GAAM,kBAAkB,OACzB,IACJ,EAAS,MAAM,MAAM,EAAE,SAAS,EAAkB,EAAE,SACpD,KACA;AAiBF,QAfI,EAAS,WAAW,KAAK,IACpB,OAeP,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,UAAD;GACE,MAAK;GACL,UAfe,MAA+C;AAGlE,IAFA,EAAM,gBAAgB,EACtB,EAAM,iBAAiB,EACvB,GAAoB,MAAS,CAAC,EAAK;;GAa/B,UAAU;GACV,eAAY;GACZ,OAAO,KAAsB,KAAA;GAC7B,iBAAc;GACd,iBAAe;GACf,WAAW,EACT,GACA,iBACA,kDACD;aAZH,CAcE,kBAAC,QAAD;IAAM,WAAU;cACb,KAAqB,EAAE,EAAQ,6BAA6B;IACxD,CAAA,EACP,kBAAC,GAAD,EAAqB,QAAQ,GAAmB,CAAA,CACzC;MACR,KACC,kBAAC,GAAD;GACY;GACS;GACnB,WA9Bc,MAAwB;AACxC,UAAgB,KACpB,EAAa,GAAgB,EAAY;;GA6BnC,eAAe,EAAmB,GAAM;GACxC,CAAA,CAEA"}

package/dist/components/features/chat/switch-profile-context-menu.cjs CHANGED Viewed

@@ -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(`../../../utils/utils.cjs`),i=require(`../../../icons/checkmark.cjs`),a=require(`../../../ui/typography.cjs`),o=require(`../../../ui/context-menu.cjs`),s=require(`../context-menu/context-menu-list-item.cjs`),c=require(`../../../hooks/use-click-outside-element.cjs`),l=require(`../../shared/navigation-link.cjs`),u=require(`../../../ui/divider.cjs`),d=require(`../../../icons/u-circuit.cjs`),f=require(`../../../icons/settings.cjs`);let p=require(`react`);p=e.__toESM(p,1);let m=require(`react/jsx-runtime`);var h=r.cn(r.cn(`w-full flex flex-col gap-0.5 p-2 rounded`,`text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap`),`h-auto`),g=r.cn(`w-full flex items-center gap-2 p-2 rounded`,`text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap`);function _({profiles:e,activeProfileName:_,onSelect:v,onClose:y}){let{t:b}=t.useTranslation(`openhands`),x=c.useClickOutsideElement(y);p.default.useEffect(()=>{let e=e=>{e.key===`Escape`&&y()};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[y]);let S=(e,t)=>{e.preventDefault(),e.stopPropagation(),v(t),y()};return(0,m.jsxs)(o.ContextMenu,{ref:x,testId:`switch-profile-context-menu`,position:`top`,alignment:`left`,className:`z-[60] left-0 mb-2 bottom-full min-w-[280px] max-h-[60vh] overflow-y-auto`,children:[(0,m.jsx)(`div`,{className:`px-2 pt-1 pb-0.5`,children:(0,m.jsx)(a.Typography.Text,{className:`text-[11px] font-medium text-[var(--oh-text-dim)] uppercase tracking-wide leading-4`,children:b(n.I18nKey.SETTINGS$AVAILABLE_PROFILES)})}),e.map(e=>{let t=e.name===_;return(0,m.jsxs)(s.ContextMenuListItem,{testId:`switch-profile-option-${e.name}`,onClick:t=>S(t,e.name),className:r.cn(h,t&&`bg-[var(--oh-interactive-hover)]`),children:[(0,m.jsxs)(`span`,{className:`flex items-center gap-2 min-w-0`,title:e.model??void 0,children:[(0,m.jsx)(d.default,{width:16,height:16,className:`shrink-0`,"aria-hidden":!0}),(0,m.jsx)(`span`,{className:`flex-1 truncate text-sm leading-5`,children:e.name}),t&&(0,m.jsx)(i.default,{width:14,height:14,className:`shrink-0`,"aria-hidden":!0})]}),e.model&&(0,m.jsx)(`span`,{className:`block truncate text-xs leading-4 text-[var(--oh-muted)] pl-6`,children:e.model})]},e.name)}),(0,m.jsx)(u.Divider,{}),(0,m.jsxs)(l.NavigationLink,{to:`/settings`,onClick:y,"data-testid":`switch-profile-open-settings`,className:g,children:[(0,m.jsx)(f.default,{width:16,height:16,className:`shrink-0`}),(0,m.jsx)(`span`,{className:`text-sm leading-5`,children:b(n.I18nKey.MODEL$OPEN_SETTINGS)})]})]})}exports.SwitchProfileContextMenu=_;
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../utils/utils.cjs`),i=require(`../../../icons/checkmark.cjs`),a=require(`../../../ui/typography.cjs`),o=require(`../../../utils/dropdown-classes.cjs`),s=require(`../../../ui/context-menu.cjs`),c=require(`../context-menu/context-menu-list-item.cjs`),l=require(`../../../hooks/use-click-outside-element.cjs`),u=require(`../../shared/navigation-link.cjs`),d=require(`../../../ui/divider.cjs`),f=require(`../../../icons/u-circuit.cjs`),p=require(`../../../icons/settings.cjs`);let m=require(`react`);m=e.__toESM(m,1);let h=require(`react/jsx-runtime`);var g=r.cn(r.cn(`w-full flex flex-col gap-0.5 p-2 rounded`,`text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap`),`h-auto items-stretch`),_=r.cn(`group w-full flex items-center p-2 rounded`,o.dropdownMenuRowGapClassName,`text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap`);function v({profiles:e,activeProfileName:v,onSelect:y,onClose:b}){let{t:x}=t.useTranslation(`openhands`),S=l.useClickOutsideElement(b);m.default.useEffect(()=>{let e=e=>{e.key===`Escape`&&b()};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[b]);let C=(e,t)=>{e.preventDefault(),e.stopPropagation(),y(t),b()};return(0,h.jsxs)(s.ContextMenu,{ref:S,testId:`switch-profile-context-menu`,position:`top`,alignment:`left`,className:`z-[60] left-0 mb-2 bottom-full min-w-[280px] pt-0`,children:[(0,h.jsx)(`div`,{className:`px-2 pb-0.5`,children:(0,h.jsx)(a.Typography.Text,{className:`text-[11px] font-medium text-[var(--oh-text-dim)] uppercase tracking-wide leading-4`,children:x(n.I18nKey.SETTINGS$AVAILABLE_PROFILES)})}),(0,h.jsx)(`div`,{"data-testid":`switch-profile-options-list`,className:o.switchProfileMenuListScrollClassName,children:e.map(e=>{let t=e.name===v;return(0,h.jsxs)(c.ContextMenuListItem,{testId:`switch-profile-option-${e.name}`,onClick:t=>C(t,e.name),className:r.cn(g,t&&`bg-[var(--oh-interactive-hover)]`),children:[(0,h.jsxs)(`span`,{className:r.cn(`flex items-center min-w-0`,o.dropdownMenuRowGapClassName),title:e.model??void 0,children:[(0,h.jsx)(`span`,{className:o.dropdownMenuRowIconWrapperClassName,"aria-hidden":!0,children:(0,h.jsx)(f.default,{width:16,height:16})}),(0,h.jsx)(`span`,{className:`flex-1 truncate text-sm leading-5`,children:e.name}),t&&(0,h.jsx)(i.default,{width:14,height:14,className:`shrink-0`,"aria-hidden":!0})]}),e.model&&(0,h.jsx)(`span`,{className:`block truncate text-xs leading-4 text-[var(--oh-muted)] pl-6`,children:e.model})]},e.name)})}),(0,h.jsx)(d.Divider,{}),(0,h.jsxs)(u.NavigationLink,{to:`/settings`,onClick:b,"data-testid":`switch-profile-open-settings`,className:_,children:[(0,h.jsx)(`span`,{className:o.dropdownMenuRowIconWrapperClassName,"aria-hidden":!0,children:(0,h.jsx)(p.default,{width:16,height:16})}),(0,h.jsx)(`span`,{className:`text-sm leading-5`,children:x(n.I18nKey.MODEL$OPEN_SETTINGS)})]})]})}exports.SwitchProfileContextMenu=v;
 //# sourceMappingURL=switch-profile-context-menu.cjs.map

package/dist/components/features/chat/switch-profile-context-menu.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"switch-profile-context-menu.cjs","names":[],"sources":["../../../../src/components/features/chat/switch-profile-context-menu.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { Divider } from \"#/ui/divider\";\nimport { Typography } from \"#/ui/typography\";\nimport { NavigationLink } from \"#/components/shared/navigation-link\";\nimport { ContextMenuListItem } from \"../context-menu/context-menu-list-item\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport CircuitIcon from \"#/icons/u-circuit.svg?react\";\nimport SettingsIcon from \"#/icons/settings.svg?react\";\nimport CheckIcon from \"#/icons/checkmark.svg?react\";\nimport { cn } from \"#/utils/utils\";\nimport type { ProfileInfo } from \"#/api/profiles-service/profiles-service.api\";\n\nconst rowBaseClassName = cn(\n \"w-full flex flex-col gap-0.5 p-2 rounded\",\n \"text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap\",\n);\nconst profileRowClassName = cn(rowBaseClassName, \"h-auto\");\nconst linkRowClassName = cn(\n \"w-full flex items-center ~~gap-2~~ p-2 rounded\",\n \"text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap\",\n);\n\ninterface SwitchProfileContextMenuProps {\n profiles: ProfileInfo[];\n activeProfileName: string \| null;\n onSelect: (profileName: string) => void;\n onClose: () => void;\n}\n\nexport function SwitchProfileContextMenu({\n profiles,\n activeProfileName,\n onSelect,\n onClose,\n}: SwitchProfileContextMenuProps) {\n const { t } = useTranslation(\"openhands\");\n const ref = useClickOutsideElement<HTMLUListElement>(onClose);\n\n React.useEffect(() => {\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") onClose();\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, [onClose]);\n\n const handleSelect = (\n event: React.MouseEvent<HTMLButtonElement>,\n name: string,\n ) => {\n event.preventDefault();\n event.stopPropagation();\n onSelect(name);\n onClose();\n };\n\n return (\n <ContextMenu\n ref={ref}\n testId=\"switch-profile-context-menu\"\n position=\"top\"\n alignment=\"left\"\n className=\"z-[60] left-0 mb-2 bottom-full min-w-[280px] ~~max~~-~~h-[60vh] overflow-y-auto~~\"\n >\n <div className=\"px-2 ~~pt-1~~ pb-0.5\">\n <Typography.Text className=\"text-[11px] font-medium text-[var(--oh-text-dim)] uppercase tracking-wide leading-4\">\n {t(I18nKey.SETTINGS$AVAILABLE_PROFILES)}\n </Typography.Text>\n </div>\n {profiles.map((profile) => {\n const isActive = profile.name === activeProfileName;\n return (\n <ContextMenuListItem\n key={profile.name}\n testId={`switch-profile-option-${profile.name}`}\n onClick={(event) => handleSelect(event, profile.name)}\n className={cn(\n profileRowClassName,\n isActive && \"bg-[var(--oh-interactive-hover)]\",\n )}\n >\n <span\n className=\"flex items-center ~~gap-2~~ min-w-0\"\n title={profile.model ?? undefined}\n >\n <~~CircuitIcon~~\n width={16}\n height={16}\n ~~className=\"shrink-0\"\~~n ~~aria-hidden\n />\n~~ <span className=\"flex-1 truncate text-sm leading-5\">\n {profile.name}\n </span>\n {isActive && (\n <CheckIcon\n width={14}\n height={14}\n className=\"shrink-0\"\n aria-hidden\n />\n )}\n </span>\n {profile.model && (\n <span className=\"block truncate text-xs leading-4 text-[var(--oh-muted)] pl-6\">\n {profile.model}\n </span>\n )}\n </ContextMenuListItem>\n );\n })}\n <Divider />\n <NavigationLink\n to=\"/settings\"\n onClick={onClose}\n data-testid=\"switch-profile-open-settings\"\n className={linkRowClassName}\n >\n <SettingsIcon width={16} height={16} ~~className=\"shrink-0\"~~ />\n <span className=\"text-sm leading-5\">\n {t(I18nKey.MODEL$OPEN_SETTINGS)}\n </span>\n </NavigationLink>\n </ContextMenu>\n );\n}\n"],"mappings":"~~urBAmBA~~,IAAM,EAAsB,EAAA,GAJH,EAAA,GACvB,2CACA,+EAE6B,CAAkB,~~SAAS~~,~~CACpD~~,EAAmB,EAAA,GACvB,6CACA,+EACD,CASD,SAAgB,EAAyB,CACvC,WACA,oBACA,WACA,WACgC,CAChC,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,EAAM,EAAA,uBAAyC,EAAQ,CAE7D,EAAA,QAAM,cAAgB,CACpB,IAAM,EAAS,GAAqB,CAC9B,EAAE,MAAQ,UAAU,GAAS,EAGnC,OADA,SAAS,iBAAiB,UAAW,EAAM,KAC9B,SAAS,oBAAoB,UAAW,EAAM,EAC1D,CAAC,EAAQ,CAAC,CAEb,IAAM,GACJ,EACA,IACG,CACH,EAAM,gBAAgB,CACtB,EAAM,iBAAiB,CACvB,EAAS,EAAK,CACd,GAAS,EAGX,OACE,EAAA,EAAA,MAAC,EAAA,YAAD,CACO,MACL,OAAO,8BACP,SAAS,MACT,UAAU,OACV,UAAU,~~qFALZ~~,EAOE,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,~~6BACb~~,EAAA,EAAA,KAAC,EAAA,WAAW,KAAZ,CAAiB,UAAU,+FACxB,EAAE,EAAA,QAAQ,4BAA4B,CACvB,CAAA,CACd,CAAA,~~CACL~~,EAAS,IAAK,GAAY,CACzB,IAAM,EAAW,EAAQ,OAAS,EAClC,OACE,EAAA,EAAA,MAAC,EAAA,oBAAD,CAEE,OAAQ,yBAAyB,EAAQ,OACzC,QAAU,GAAU,EAAa,EAAO,EAAQ,KAAK,CACrD,UAAW,EAAA,GACT,EACA,GAAY,mCACb,UAPH,EASE,EAAA,EAAA,MAAC,OAAD,CACE,~~UAAU~~,~~kCACV~~,MAAO,EAAQ,OAAS,IAAA,~~YAF1B~~,~~EAIE~~,EAAA,EAAA,KAAC,EAAA,QAAD,~~CACE~~,MAAO,~~GACP~~,OAAQ,~~GACR~~,~~UAAU~~,~~WACV~~,~~cAAA,GACA,~~CAAA,~~EACF~~,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,6CACb,EAAQ,KACJ,CAAA,CACN,IACC,EAAA,EAAA,KAAC,EAAA,QAAD,CACE,MAAO,GACP,OAAQ,GACR,UAAU,WACV,cAAA,GACA,CAAA,CAEC,GACN,EAAQ,QACP,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,wEACb,EAAQ,MACJ,CAAA,CAEW,~~EAnCf~~,EAAQ,~~KAmCO~~,EAExB,~~EACF~~,EAAA,EAAA,KAAC,EAAA,QAAD,EAAW,CAAA,EACX,EAAA,EAAA,MAAC,EAAA,eAAD,CACE,GAAG,YACH,QAAS,EACT,cAAY,+BACZ,UAAW,WAJb,EAME,EAAA,EAAA,KAAC,EAAA,QAAD,CAAc,MAAO,GAAI,OAAQ,~~GAAI~~,~~UAAU~~,~~WAAa~~,CAAA,~~EAC5D~~,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,6BACb,EAAE,EAAA,QAAQ,oBAAoB,CAC1B,CAAA,CACQ,GACL"}
1	+ {"version":3,"file":"switch-profile-context-menu.cjs","names":[],"sources":["../../../../src/components/features/chat/switch-profile-context-menu.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { Divider } from \"#/ui/divider\";\nimport { Typography } from \"#/ui/typography\";\nimport { NavigationLink } from \"#/components/shared/navigation-link\";\nimport { ContextMenuListItem } from \"../context-menu/context-menu-list-item\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport CircuitIcon from \"#/icons/u-circuit.svg?react\";\nimport SettingsIcon from \"#/icons/settings.svg?react\";\nimport CheckIcon from \"#/icons/checkmark.svg?react\";\nimport { cn } from \"#/utils/utils\";\nimport type { ProfileInfo } from \"#/api/profiles-service/profiles-service.api\";\nimport {\n dropdownMenuRowGapClassName,\n dropdownMenuRowIconWrapperClassName,\n switchProfileMenuListScrollClassName,\n} from \"#/utils/dropdown-classes\";\n\nconst rowBaseClassName = cn(\n \"w-full flex flex-col gap-0.5 p-2 rounded\",\n \"text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap\",\n);\nconst profileRowClassName = cn(rowBaseClassName, \"h-auto items-stretch\");\nconst linkRowClassName = cn(\n \"group w-full flex items-center p-2 rounded\",\n dropdownMenuRowGapClassName,\n \"text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap\",\n);\n\ninterface SwitchProfileContextMenuProps {\n profiles: ProfileInfo[];\n activeProfileName: string \| null;\n onSelect: (profileName: string) => void;\n onClose: () => void;\n}\n\nexport function SwitchProfileContextMenu({\n profiles,\n activeProfileName,\n onSelect,\n onClose,\n}: SwitchProfileContextMenuProps) {\n const { t } = useTranslation(\"openhands\");\n const ref = useClickOutsideElement<HTMLUListElement>(onClose);\n\n React.useEffect(() => {\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") onClose();\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, [onClose]);\n\n const handleSelect = (\n event: React.MouseEvent<HTMLButtonElement>,\n name: string,\n ) => {\n event.preventDefault();\n event.stopPropagation();\n onSelect(name);\n onClose();\n };\n\n return (\n <ContextMenu\n ref={ref}\n testId=\"switch-profile-context-menu\"\n position=\"top\"\n alignment=\"left\"\n className=\"z-[60] left-0 mb-2 bottom-full min-w-[280px] pt-0\"\n >\n <div className=\"px-2 pb-0.5\">\n <Typography.Text className=\"text-[11px] font-medium text-[var(--oh-text-dim)] uppercase tracking-wide leading-4\">\n {t(I18nKey.SETTINGS$AVAILABLE_PROFILES)}\n </Typography.Text>\n </div>\n <div\n data-testid=\"switch-profile-options-list\"\n className={switchProfileMenuListScrollClassName}\n >\n {profiles.map((profile) => {\n const isActive = profile.name === activeProfileName;\n return (\n <ContextMenuListItem\n key={profile.name}\n testId={`switch-profile-option-${profile.name}`}\n onClick={(event) => handleSelect(event, profile.name)}\n className={cn(\n profileRowClassName,\n isActive && \"bg-[var(--oh-interactive-hover)]\",\n )}\n >\n <span\n className={cn(\n \"flex items-center min-w-0\",\n dropdownMenuRowGapClassName,\n )}\n title={profile.model ?? undefined}\n >\n <span\n className={dropdownMenuRowIconWrapperClassName}\n aria-hidden\n >\n <CircuitIcon width={16} height={16} />\n </span>\n <span className=\"flex-1 truncate text-sm leading-5\">\n {profile.name}\n </span>\n {isActive && (\n <CheckIcon\n width={14}\n height={14}\n className=\"shrink-0\"\n aria-hidden\n />\n )}\n </span>\n {profile.model && (\n <span className=\"block truncate text-xs leading-4 text-[var(--oh-muted)] pl-6\">\n {profile.model}\n </span>\n )}\n </ContextMenuListItem>\n );\n })}\n </div>\n <Divider />\n <NavigationLink\n to=\"/settings\"\n onClick={onClose}\n data-testid=\"switch-profile-open-settings\"\n className={linkRowClassName}\n >\n <span className={dropdownMenuRowIconWrapperClassName} aria-hidden>\n <SettingsIcon width={16} height={16} />\n </span>\n <span className=\"text-sm leading-5\">\n {t(I18nKey.MODEL$OPEN_SETTINGS)}\n </span>\n </NavigationLink>\n </ContextMenu>\n );\n}\n"],"mappings":"wuBAwBA,IAAM,EAAsB,EAAA,GAJH,EAAA,GACvB,2CACA,+EAE6B,CAAkB,uBAAuB,CAClE,EAAmB,EAAA,GACvB,6CACA,EAAA,4BACA,+EACD,CASD,SAAgB,EAAyB,CACvC,WACA,oBACA,WACA,WACgC,CAChC,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,EAAM,EAAA,uBAAyC,EAAQ,CAE7D,EAAA,QAAM,cAAgB,CACpB,IAAM,EAAS,GAAqB,CAC9B,EAAE,MAAQ,UAAU,GAAS,EAGnC,OADA,SAAS,iBAAiB,UAAW,EAAM,KAC9B,SAAS,oBAAoB,UAAW,EAAM,EAC1D,CAAC,EAAQ,CAAC,CAEb,IAAM,GACJ,EACA,IACG,CACH,EAAM,gBAAgB,CACtB,EAAM,iBAAiB,CACvB,EAAS,EAAK,CACd,GAAS,EAGX,OACE,EAAA,EAAA,MAAC,EAAA,YAAD,CACO,MACL,OAAO,8BACP,SAAS,MACT,UAAU,OACV,UAAU,6DALZ,EAOE,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,wBACb,EAAA,EAAA,KAAC,EAAA,WAAW,KAAZ,CAAiB,UAAU,+FACxB,EAAE,EAAA,QAAQ,4BAA4B,CACvB,CAAA,CACd,CAAA,EACN,EAAA,EAAA,KAAC,MAAD,CACE,cAAY,8BACZ,UAAW,EAAA,8CAEV,EAAS,IAAK,GAAY,CACzB,IAAM,EAAW,EAAQ,OAAS,EAClC,OACE,EAAA,EAAA,MAAC,EAAA,oBAAD,CAEE,OAAQ,yBAAyB,EAAQ,OACzC,QAAU,GAAU,EAAa,EAAO,EAAQ,KAAK,CACrD,UAAW,EAAA,GACT,EACA,GAAY,mCACb,UAPH,EASE,EAAA,EAAA,MAAC,OAAD,CACE,UAAW,EAAA,GACT,4BACA,EAAA,4BACD,CACD,MAAO,EAAQ,OAAS,IAAA,YAL1B,EAOE,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,EAAA,oCACX,cAAA,aAEA,EAAA,EAAA,KAAC,EAAA,QAAD,CAAa,MAAO,GAAI,OAAQ,GAAM,CAAA,CACjC,CAAA,EACP,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,6CACb,EAAQ,KACJ,CAAA,CACN,IACC,EAAA,EAAA,KAAC,EAAA,QAAD,CACE,MAAO,GACP,OAAQ,GACR,UAAU,WACV,cAAA,GACA,CAAA,CAEC,GACN,EAAQ,QACP,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,wEACb,EAAQ,MACJ,CAAA,CAEW,EAtCf,EAAQ,KAsCO,EAExB,CACE,CAAA,EACN,EAAA,EAAA,KAAC,EAAA,QAAD,EAAW,CAAA,EACX,EAAA,EAAA,MAAC,EAAA,eAAD,CACE,GAAG,YACH,QAAS,EACT,cAAY,+BACZ,UAAW,WAJb,EAME,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,oCAAqC,cAAA,aACpD,EAAA,EAAA,KAAC,EAAA,QAAD,CAAc,MAAO,GAAI,OAAQ,GAAM,CAAA,CAClC,CAAA,EACP,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,6BACb,EAAE,EAAA,QAAQ,oBAAoB,CAC1B,CAAA,CACQ,GACL"}

package/dist/components/features/chat/switch-profile-context-menu.js CHANGED Viewed

@@ -3,94 +3,104 @@ import { I18nKey as t } from "../../../i18n/declaration.js";
 import { cn as n } from "../../../utils/utils.js";
 import r from "../../../icons/checkmark.js";
 import { Typography as i } from "../../../ui/typography.js";
-import { ContextMenu as a } from "../../../ui/context-menu.js";
-import { ContextMenuListItem as o } from "../context-menu/context-menu-list-item.js";
-import { useClickOutsideElement as s } from "../../../hooks/use-click-outside-element.js";
-import { NavigationLink as c } from "../../shared/navigation-link.js";
-import { Divider as l } from "../../../ui/divider.js";
-import u from "../../../icons/u-circuit.js";
-import d from "../../../icons/settings.js";
-import f from "react";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { dropdownMenuRowGapClassName as a, dropdownMenuRowIconWrapperClassName as o, switchProfileMenuListScrollClassName as s } from "../../../utils/dropdown-classes.js";
+import { ContextMenu as c } from "../../../ui/context-menu.js";
+import { ContextMenuListItem as l } from "../context-menu/context-menu-list-item.js";
+import { useClickOutsideElement as u } from "../../../hooks/use-click-outside-element.js";
+import { NavigationLink as d } from "../../shared/navigation-link.js";
+import { Divider as f } from "../../../ui/divider.js";
+import p from "../../../icons/u-circuit.js";
+import m from "../../../icons/settings.js";
+import h from "react";
+import { jsx as g, jsxs as _ } from "react/jsx-runtime";
 //#region src/components/features/chat/switch-profile-context-menu.tsx
-var h = n(n("w-full flex flex-col gap-0.5 p-2 rounded", "text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap"), "h-auto"), g = n("w-full flex items-center gap-2 p-2 rounded", "text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap");
-function _({ profiles: _, activeProfileName: v, onSelect: y, onClose: b }) {
-	let { t: x } = e("openhands"), S = s(b);
-	f.useEffect(() => {
+var v = n(n("w-full flex flex-col gap-0.5 p-2 rounded", "text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap"), "h-auto items-stretch"), y = n("group w-full flex items-center p-2 rounded", a, "text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap");
+function b({ profiles: b, activeProfileName: x, onSelect: S, onClose: C }) {
+	let { t: w } = e("openhands"), T = u(C);
+	h.useEffect(() => {
 		let e = (e) => {
-			e.key === "Escape" && b();
+			e.key === "Escape" && C();
 		};
 		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
-	}, [b]);
-	let C = (e, t) => {
-		e.preventDefault(), e.stopPropagation(), y(t), b();
+	}, [C]);
+	let E = (e, t) => {
+		e.preventDefault(), e.stopPropagation(), S(t), C();
 	};
-	return /* @__PURE__ */ m(a, {
-		ref: S,
+	return /* @__PURE__ */ _(c, {
+		ref: T,
 		testId: "switch-profile-context-menu",
 		position: "top",
 		alignment: "left",
-		className: "z-[60] left-0 mb-2 bottom-full min-w-[280px] max-h-[60vh] overflow-y-auto",
+		className: "z-[60] left-0 mb-2 bottom-full min-w-[280px] pt-0",
 		children: [
-			/* @__PURE__ */ p("div", {
-				className: "px-2 pt-1 pb-0.5",
-				children: /* @__PURE__ */ p(i.Text, {
+			/* @__PURE__ */ g("div", {
+				className: "px-2 pb-0.5",
+				children: /* @__PURE__ */ g(i.Text, {
 					className: "text-[11px] font-medium text-[var(--oh-text-dim)] uppercase tracking-wide leading-4",
-					children: x(t.SETTINGS$AVAILABLE_PROFILES)
+					children: w(t.SETTINGS$AVAILABLE_PROFILES)
 				})
 			}),
-			_.map((e) => {
-				let t = e.name === v;
-				return /* @__PURE__ */ m(o, {
-					testId: `switch-profile-option-${e.name}`,
-					onClick: (t) => C(t, e.name),
-					className: n(h, t && "bg-[var(--oh-interactive-hover)]"),
-					children: [/* @__PURE__ */ m("span", {
-						className: "flex items-center gap-2 min-w-0",
-						title: e.model ?? void 0,
-						children: [
-							/* @__PURE__ */ p(u, {
-								width: 16,
-								height: 16,
-								className: "shrink-0",
-								"aria-hidden": !0
-							}),
-							/* @__PURE__ */ p("span", {
-								className: "flex-1 truncate text-sm leading-5",
-								children: e.name
-							}),
-							t && /* @__PURE__ */ p(r, {
-								width: 14,
-								height: 14,
-								className: "shrink-0",
-								"aria-hidden": !0
-							})
-						]
-					}), e.model && /* @__PURE__ */ p("span", {
-						className: "block truncate text-xs leading-4 text-[var(--oh-muted)] pl-6",
-						children: e.model
-					})]
-				}, e.name);
+			/* @__PURE__ */ g("div", {
+				"data-testid": "switch-profile-options-list",
+				className: s,
+				children: b.map((e) => {
+					let t = e.name === x;
+					return /* @__PURE__ */ _(l, {
+						testId: `switch-profile-option-${e.name}`,
+						onClick: (t) => E(t, e.name),
+						className: n(v, t && "bg-[var(--oh-interactive-hover)]"),
+						children: [/* @__PURE__ */ _("span", {
+							className: n("flex items-center min-w-0", a),
+							title: e.model ?? void 0,
+							children: [
+								/* @__PURE__ */ g("span", {
+									className: o,
+									"aria-hidden": !0,
+									children: /* @__PURE__ */ g(p, {
+										width: 16,
+										height: 16
+									})
+								}),
+								/* @__PURE__ */ g("span", {
+									className: "flex-1 truncate text-sm leading-5",
+									children: e.name
+								}),
+								t && /* @__PURE__ */ g(r, {
+									width: 14,
+									height: 14,
+									className: "shrink-0",
+									"aria-hidden": !0
+								})
+							]
+						}), e.model && /* @__PURE__ */ g("span", {
+							className: "block truncate text-xs leading-4 text-[var(--oh-muted)] pl-6",
+							children: e.model
+						})]
+					}, e.name);
+				})
 			}),
-			/* @__PURE__ */ p(l, {}),
-			/* @__PURE__ */ m(c, {
+			/* @__PURE__ */ g(f, {}),
+			/* @__PURE__ */ _(d, {
 				to: "/settings",
-				onClick: b,
+				onClick: C,
 				"data-testid": "switch-profile-open-settings",
-				className: g,
-				children: [/* @__PURE__ */ p(d, {
-					width: 16,
-					height: 16,
-					className: "shrink-0"
-				}), /* @__PURE__ */ p("span", {
+				className: y,
+				children: [/* @__PURE__ */ g("span", {
+					className: o,
+					"aria-hidden": !0,
+					children: /* @__PURE__ */ g(m, {
+						width: 16,
+						height: 16
+					})
+				}), /* @__PURE__ */ g("span", {
 					className: "text-sm leading-5",
-					children: x(t.MODEL$OPEN_SETTINGS)
+					children: w(t.MODEL$OPEN_SETTINGS)
 				})]
 			})
 		]
 	});
 }
 //#endregion
-export { _ as SwitchProfileContextMenu };
+export { b as SwitchProfileContextMenu };
 //# sourceMappingURL=switch-profile-context-menu.js.map

package/dist/components/features/chat/switch-profile-context-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"switch-profile-context-menu.js","names":[],"sources":["../../../../src/components/features/chat/switch-profile-context-menu.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { Divider } from \"#/ui/divider\";\nimport { Typography } from \"#/ui/typography\";\nimport { NavigationLink } from \"#/components/shared/navigation-link\";\nimport { ContextMenuListItem } from \"../context-menu/context-menu-list-item\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport CircuitIcon from \"#/icons/u-circuit.svg?react\";\nimport SettingsIcon from \"#/icons/settings.svg?react\";\nimport CheckIcon from \"#/icons/checkmark.svg?react\";\nimport { cn } from \"#/utils/utils\";\nimport type { ProfileInfo } from \"#/api/profiles-service/profiles-service.api\";\n\nconst rowBaseClassName = cn(\n \"w-full flex flex-col gap-0.5 p-2 rounded\",\n \"text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap\",\n);\nconst profileRowClassName = cn(rowBaseClassName, \"h-auto\");\nconst linkRowClassName = cn(\n \"w-full flex items-center ~~gap-2~~ p-2 rounded\",\n \"text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap\",\n);\n\ninterface SwitchProfileContextMenuProps {\n profiles: ProfileInfo[];\n activeProfileName: string \| null;\n onSelect: (profileName: string) => void;\n onClose: () => void;\n}\n\nexport function SwitchProfileContextMenu({\n profiles,\n activeProfileName,\n onSelect,\n onClose,\n}: SwitchProfileContextMenuProps) {\n const { t } = useTranslation(\"openhands\");\n const ref = useClickOutsideElement<HTMLUListElement>(onClose);\n\n React.useEffect(() => {\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") onClose();\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, [onClose]);\n\n const handleSelect = (\n event: React.MouseEvent<HTMLButtonElement>,\n name: string,\n ) => {\n event.preventDefault();\n event.stopPropagation();\n onSelect(name);\n onClose();\n };\n\n return (\n <ContextMenu\n ref={ref}\n testId=\"switch-profile-context-menu\"\n position=\"top\"\n alignment=\"left\"\n className=\"z-[60] left-0 mb-2 bottom-full min-w-[280px] ~~max~~-~~h-[60vh] overflow-y-auto~~\"\n >\n <div className=\"px-2 ~~pt-1~~ pb-0.5\">\n <Typography.Text className=\"text-[11px] font-medium text-[var(--oh-text-dim)] uppercase tracking-wide leading-4\">\n {t(I18nKey.SETTINGS$AVAILABLE_PROFILES)}\n </Typography.Text>\n </div>\n {profiles.map((profile) => {\n const isActive = profile.name === activeProfileName;\n return (\n <ContextMenuListItem\n key={profile.name}\n testId={`switch-profile-option-${profile.name}`}\n onClick={(event) => handleSelect(event, profile.name)}\n className={cn(\n profileRowClassName,\n isActive && \"bg-[var(--oh-interactive-hover)]\",\n )}\n >\n <span\n className=\"flex items-center ~~gap-2~~ min-w-0\"\n title={profile.model ?? undefined}\n >\n <~~CircuitIcon~~\n width={16}\n height={16}\n ~~className=\"shrink-0\"\~~n ~~aria-hidden\n />\n~~ <span className=\"flex-1 truncate text-sm leading-5\">\n {profile.name}\n </span>\n {isActive && (\n <CheckIcon\n width={14}\n height={14}\n className=\"shrink-0\"\n aria-hidden\n />\n )}\n </span>\n {profile.model && (\n <span className=\"block truncate text-xs leading-4 text-[var(--oh-muted)] pl-6\">\n {profile.model}\n </span>\n )}\n </ContextMenuListItem>\n );\n })}\n <Divider />\n <NavigationLink\n to=\"/settings\"\n onClick={onClose}\n data-testid=\"switch-profile-open-settings\"\n className={linkRowClassName}\n >\n <SettingsIcon width={16} height={16} ~~className=\"shrink-0\"~~ />\n <span className=\"text-sm leading-5\">\n {t(I18nKey.MODEL$OPEN_SETTINGS)}\n </span>\n </NavigationLink>\n </ContextMenu>\n );\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;AAmBA~~,IAAM,IAAsB,EAJH,EACvB,4CACA,+EAE6B,EAAkB,~~SAAS~~,~~EACpD~~,IAAmB,EACvB,8CACA,+EACD;AASD,SAAgB,EAAyB,EACvC,aACA,sBACA,aACA,cACgC;CAChC,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAM,EAAyC,EAAQ;AAE7D,GAAM,gBAAgB;EACpB,IAAM,KAAS,MAAqB;AAClC,GAAI,EAAE,QAAQ,YAAU,GAAS;;AAGnC,SADA,SAAS,iBAAiB,WAAW,EAAM,QAC9B,SAAS,oBAAoB,WAAW,EAAM;IAC1D,CAAC,EAAQ,CAAC;CAEb,IAAM,KACJ,GACA,MACG;AAIH,EAHA,EAAM,gBAAgB,EACtB,EAAM,iBAAiB,EACvB,EAAS,EAAK,EACd,GAAS;;AAGX,QACE,kBAAC,GAAD;EACO;EACL,QAAO;EACP,UAAS;EACT,WAAU;EACV,WAAU;YALZ;GAOE,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,EAAW,MAAZ;KAAiB,WAAU;eACxB,EAAE,EAAQ,4BAA4B;KACvB,CAAA;IACd,CAAA;~~GACL~~,EAAS,KAAK,MAAY;~~IACzB~~,IAAM,IAAW,EAAQ,SAAS;AAClC,~~WACE~~,kBAAC,GAAD;~~KAEE~~,QAAQ,yBAAyB,EAAQ;~~KACzC~~,UAAU,MAAU,EAAa,GAAO,EAAQ,KAAK;~~KACrD~~,WAAW,EACT,GACA,KAAY,mCACb;~~eAPH~~,CASE,kBAAC,QAAD;~~MACE~~,~~WAAU~~;~~MACV~~,OAAO,EAAQ,SAAS,KAAA;~~gBAF1B~~;~~OAIE~~,kBAAC,GAAD;~~QACE~~,OAAO;~~QACP~~,QAAQ;~~QACR~~,~~WAAU~~;~~QACV~~,~~eAAA;QACA,~~CAAA;~~OACF~~,kBAAC,QAAD;~~QAAM~~,WAAU;~~kBACb~~,EAAQ;~~QACJ~~,CAAA;~~OACN~~,KACC,kBAAC,GAAD;~~QACE~~,OAAO;~~QACP~~,QAAQ;~~QACR~~,WAAU;~~QACV~~,eAAA;~~QACA~~,CAAA;~~OAEC~~;~~SACN~~,EAAQ,SACP,kBAAC,QAAD;~~MAAM~~,WAAU;~~gBACb~~,EAAQ;~~MACJ~~,CAAA,CAEW;~~OAnCf~~,EAAQ,~~KAmCO~~;~~KAExB~~;~~GACF~~,kBAAC,GAAD,EAAW,CAAA;GACX,kBAAC,GAAD;IACE,IAAG;IACH,SAAS;IACT,eAAY;IACZ,WAAW;cAJb,CAME,kBAAC,GAAD;~~KAAc~~,OAAO;~~KAAI~~,QAAQ;~~KAAI~~,~~WAAU~~;~~KAAa~~,CAAA,~~EAC5D~~,kBAAC,QAAD;KAAM,WAAU;eACb,EAAE,EAAQ,oBAAoB;KAC1B,CAAA,CACQ;;GACL"}
1	+ {"version":3,"file":"switch-profile-context-menu.js","names":[],"sources":["../../../../src/components/features/chat/switch-profile-context-menu.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { Divider } from \"#/ui/divider\";\nimport { Typography } from \"#/ui/typography\";\nimport { NavigationLink } from \"#/components/shared/navigation-link\";\nimport { ContextMenuListItem } from \"../context-menu/context-menu-list-item\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport CircuitIcon from \"#/icons/u-circuit.svg?react\";\nimport SettingsIcon from \"#/icons/settings.svg?react\";\nimport CheckIcon from \"#/icons/checkmark.svg?react\";\nimport { cn } from \"#/utils/utils\";\nimport type { ProfileInfo } from \"#/api/profiles-service/profiles-service.api\";\nimport {\n dropdownMenuRowGapClassName,\n dropdownMenuRowIconWrapperClassName,\n switchProfileMenuListScrollClassName,\n} from \"#/utils/dropdown-classes\";\n\nconst rowBaseClassName = cn(\n \"w-full flex flex-col gap-0.5 p-2 rounded\",\n \"text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap\",\n);\nconst profileRowClassName = cn(rowBaseClassName, \"h-auto items-stretch\");\nconst linkRowClassName = cn(\n \"group w-full flex items-center p-2 rounded\",\n dropdownMenuRowGapClassName,\n \"text-start hover:bg-[var(--oh-interactive-hover)] cursor-pointer text-nowrap\",\n);\n\ninterface SwitchProfileContextMenuProps {\n profiles: ProfileInfo[];\n activeProfileName: string \| null;\n onSelect: (profileName: string) => void;\n onClose: () => void;\n}\n\nexport function SwitchProfileContextMenu({\n profiles,\n activeProfileName,\n onSelect,\n onClose,\n}: SwitchProfileContextMenuProps) {\n const { t } = useTranslation(\"openhands\");\n const ref = useClickOutsideElement<HTMLUListElement>(onClose);\n\n React.useEffect(() => {\n const onKey = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") onClose();\n };\n document.addEventListener(\"keydown\", onKey);\n return () => document.removeEventListener(\"keydown\", onKey);\n }, [onClose]);\n\n const handleSelect = (\n event: React.MouseEvent<HTMLButtonElement>,\n name: string,\n ) => {\n event.preventDefault();\n event.stopPropagation();\n onSelect(name);\n onClose();\n };\n\n return (\n <ContextMenu\n ref={ref}\n testId=\"switch-profile-context-menu\"\n position=\"top\"\n alignment=\"left\"\n className=\"z-[60] left-0 mb-2 bottom-full min-w-[280px] pt-0\"\n >\n <div className=\"px-2 pb-0.5\">\n <Typography.Text className=\"text-[11px] font-medium text-[var(--oh-text-dim)] uppercase tracking-wide leading-4\">\n {t(I18nKey.SETTINGS$AVAILABLE_PROFILES)}\n </Typography.Text>\n </div>\n <div\n data-testid=\"switch-profile-options-list\"\n className={switchProfileMenuListScrollClassName}\n >\n {profiles.map((profile) => {\n const isActive = profile.name === activeProfileName;\n return (\n <ContextMenuListItem\n key={profile.name}\n testId={`switch-profile-option-${profile.name}`}\n onClick={(event) => handleSelect(event, profile.name)}\n className={cn(\n profileRowClassName,\n isActive && \"bg-[var(--oh-interactive-hover)]\",\n )}\n >\n <span\n className={cn(\n \"flex items-center min-w-0\",\n dropdownMenuRowGapClassName,\n )}\n title={profile.model ?? undefined}\n >\n <span\n className={dropdownMenuRowIconWrapperClassName}\n aria-hidden\n >\n <CircuitIcon width={16} height={16} />\n </span>\n <span className=\"flex-1 truncate text-sm leading-5\">\n {profile.name}\n </span>\n {isActive && (\n <CheckIcon\n width={14}\n height={14}\n className=\"shrink-0\"\n aria-hidden\n />\n )}\n </span>\n {profile.model && (\n <span className=\"block truncate text-xs leading-4 text-[var(--oh-muted)] pl-6\">\n {profile.model}\n </span>\n )}\n </ContextMenuListItem>\n );\n })}\n </div>\n <Divider />\n <NavigationLink\n to=\"/settings\"\n onClick={onClose}\n data-testid=\"switch-profile-open-settings\"\n className={linkRowClassName}\n >\n <span className={dropdownMenuRowIconWrapperClassName} aria-hidden>\n <SettingsIcon width={16} height={16} />\n </span>\n <span className=\"text-sm leading-5\">\n {t(I18nKey.MODEL$OPEN_SETTINGS)}\n </span>\n </NavigationLink>\n </ContextMenu>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAwBA,IAAM,IAAsB,EAJH,EACvB,4CACA,+EAE6B,EAAkB,uBAAuB,EAClE,IAAmB,EACvB,8CACA,GACA,+EACD;AASD,SAAgB,EAAyB,EACvC,aACA,sBACA,aACA,cACgC;CAChC,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAM,EAAyC,EAAQ;AAE7D,GAAM,gBAAgB;EACpB,IAAM,KAAS,MAAqB;AAClC,GAAI,EAAE,QAAQ,YAAU,GAAS;;AAGnC,SADA,SAAS,iBAAiB,WAAW,EAAM,QAC9B,SAAS,oBAAoB,WAAW,EAAM;IAC1D,CAAC,EAAQ,CAAC;CAEb,IAAM,KACJ,GACA,MACG;AAIH,EAHA,EAAM,gBAAgB,EACtB,EAAM,iBAAiB,EACvB,EAAS,EAAK,EACd,GAAS;;AAGX,QACE,kBAAC,GAAD;EACO;EACL,QAAO;EACP,UAAS;EACT,WAAU;EACV,WAAU;YALZ;GAOE,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,EAAW,MAAZ;KAAiB,WAAU;eACxB,EAAE,EAAQ,4BAA4B;KACvB,CAAA;IACd,CAAA;GACN,kBAAC,OAAD;IACE,eAAY;IACZ,WAAW;cAEV,EAAS,KAAK,MAAY;KACzB,IAAM,IAAW,EAAQ,SAAS;AAClC,YACE,kBAAC,GAAD;MAEE,QAAQ,yBAAyB,EAAQ;MACzC,UAAU,MAAU,EAAa,GAAO,EAAQ,KAAK;MACrD,WAAW,EACT,GACA,KAAY,mCACb;gBAPH,CASE,kBAAC,QAAD;OACE,WAAW,EACT,6BACA,EACD;OACD,OAAO,EAAQ,SAAS,KAAA;iBAL1B;QAOE,kBAAC,QAAD;SACE,WAAW;SACX,eAAA;mBAEA,kBAAC,GAAD;UAAa,OAAO;UAAI,QAAQ;UAAM,CAAA;SACjC,CAAA;QACP,kBAAC,QAAD;SAAM,WAAU;mBACb,EAAQ;SACJ,CAAA;QACN,KACC,kBAAC,GAAD;SACE,OAAO;SACP,QAAQ;SACR,WAAU;SACV,eAAA;SACA,CAAA;QAEC;UACN,EAAQ,SACP,kBAAC,QAAD;OAAM,WAAU;iBACb,EAAQ;OACJ,CAAA,CAEW;QAtCf,EAAQ,KAsCO;MAExB;IACE,CAAA;GACN,kBAAC,GAAD,EAAW,CAAA;GACX,kBAAC,GAAD;IACE,IAAG;IACH,SAAS;IACT,eAAY;IACZ,WAAW;cAJb,CAME,kBAAC,QAAD;KAAM,WAAW;KAAqC,eAAA;eACpD,kBAAC,GAAD;MAAc,OAAO;MAAI,QAAQ;MAAM,CAAA;KAClC,CAAA,EACP,kBAAC,QAAD;KAAM,WAAU;eACb,EAAE,EAAQ,oBAAoB;KAC1B,CAAA,CACQ;;GACL"}

package/dist/components/features/context-menu/context-menu-icon-text-with-description.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../utils/utils.cjs`),n=require(`../../../ui/typography.cjs`),r=require(`./context-menu-icon-text.cjs`);let i=require(`react`);i=e.__toESM(i,1);let a=require(`react/jsx-runtime`);function o({icon:e,title:i,description:o,className:s,iconClassName:c}){return(0,a.jsxs)(`div`,{className:t.cn(`flex min-w-0 w-full flex-col justify-center gap-1`,s),children:[(0,a.jsx)(r.ContextMenuIconText,{icon:e,text:i,className:`px-0`,iconClassName:c}),(0,a.jsx)(n.Typography.Text,{className:`text-[var(--oh-muted)] text-[10px] font-normal whitespace-pre-wrap break-words`,children:o})]})}exports.ContextMenuIconTextWithDescription=o;
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../utils/utils.cjs`),n=require(`../../../ui/typography.cjs`),r=require(`./context-menu-icon-text.cjs`);let i=require(`react`);i=e.__toESM(i,1);let a=require(`react/jsx-runtime`);function o({icon:e,title:i,description:o,className:s,iconClassName:c,isActive:l=!1}){return(0,a.jsxs)(`div`,{className:t.cn(`flex min-w-0 w-full flex-col justify-center gap-1`,s),children:[(0,a.jsx)(r.ContextMenuIconText,{icon:e,text:i,className:`px-0`,iconClassName:c,isActive:l}),(0,a.jsx)(n.Typography.Text,{className:`text-[var(--oh-muted)] text-[10px] font-normal whitespace-pre-wrap break-words`,children:o})]})}exports.ContextMenuIconTextWithDescription=o;
 //# sourceMappingURL=context-menu-icon-text-with-description.cjs.map

package/dist/components/features/context-menu/context-menu-icon-text-with-description.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context-menu-icon-text-with-description.cjs","names":[],"sources":["../../../../src/components/features/context-menu/context-menu-icon-text-with-description.tsx"],"sourcesContent":["import React from \"react\";\nimport { ContextMenuIconText } from \"./context-menu-icon-text\";\nimport { Typography } from \"#/ui/typography\";\nimport { cn } from \"#/utils/utils\";\n\ninterface ContextMenuIconTextWithDescriptionProps {\n icon: React.ComponentType<{ className?: string }>;\n title: string;\n description: string;\n className?: string;\n iconClassName?: string;\n}\n\nexport function ContextMenuIconTextWithDescription({\n icon,\n title,\n description,\n className,\n iconClassName,\n}: ContextMenuIconTextWithDescriptionProps) {\n return (\n <div\n className={cn(\n \"flex min-w-0 w-full flex-col justify-center gap-1\",\n className,\n )}\n >\n <ContextMenuIconText\n icon={icon}\n text={title}\n className=\"px-0\"\n iconClassName={iconClassName}\n />\n <Typography.Text className=\"text-[var(--oh-muted)] text-[10px] font-normal whitespace-pre-wrap break-words\">\n {description}\n </Typography.Text>\n </div>\n );\n}\n"],"mappings":"~~8PAaA~~,SAAgB,EAAmC,CACjD,OACA,QACA,cACA,YACA,~~iBAC0C~~,CAC1C,OACE,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,EAAA,GACT,oDACA,EACD,UAJH,EAME,EAAA,EAAA,KAAC,EAAA,oBAAD,CACQ,OACN,KAAM,EACN,UAAU,OACK,~~gBACf~~,CAAA,EACF,EAAA,EAAA,KAAC,EAAA,WAAW,KAAZ,CAAiB,UAAU,0FACxB,EACe,CAAA,CACd"}
1	+ {"version":3,"file":"context-menu-icon-text-with-description.cjs","names":[],"sources":["../../../../src/components/features/context-menu/context-menu-icon-text-with-description.tsx"],"sourcesContent":["import React from \"react\";\nimport { ContextMenuIconText } from \"./context-menu-icon-text\";\nimport { Typography } from \"#/ui/typography\";\nimport { cn } from \"#/utils/utils\";\n\ninterface ContextMenuIconTextWithDescriptionProps {\n icon: React.ComponentType<{ className?: string }>;\n title: string;\n description: string;\n className?: string;\n iconClassName?: string;\n isActive?: boolean;\n}\n\nexport function ContextMenuIconTextWithDescription({\n icon,\n title,\n description,\n className,\n iconClassName,\n isActive = false,\n}: ContextMenuIconTextWithDescriptionProps) {\n return (\n <div\n className={cn(\n \"flex min-w-0 w-full flex-col justify-center gap-1\",\n className,\n )}\n >\n <ContextMenuIconText\n icon={icon}\n text={title}\n className=\"px-0\"\n iconClassName={iconClassName}\n isActive={isActive}\n />\n <Typography.Text className=\"text-[var(--oh-muted)] text-[10px] font-normal whitespace-pre-wrap break-words\">\n {description}\n </Typography.Text>\n </div>\n );\n}\n"],"mappings":"8PAcA,SAAgB,EAAmC,CACjD,OACA,QACA,cACA,YACA,gBACA,WAAW,IAC+B,CAC1C,OACE,EAAA,EAAA,MAAC,MAAD,CACE,UAAW,EAAA,GACT,oDACA,EACD,UAJH,EAME,EAAA,EAAA,KAAC,EAAA,oBAAD,CACQ,OACN,KAAM,EACN,UAAU,OACK,gBACL,WACV,CAAA,EACF,EAAA,EAAA,KAAC,EAAA,WAAW,KAAZ,CAAiB,UAAU,0FACxB,EACe,CAAA,CACd"}