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

package/dist/components/features/chat/components/chat-input-model.js

@@ -1,80 +1,115 @@
-import { cn as e } from "../../../../utils/utils.js";
-import { getAcpProvider as t, labelForAcpModel as n, resolveEffectiveAcpModel as r } from "../../../../constants/acp-providers.js";
-import { useActiveConversation as i } from "../../../../hooks/query/use-active-conversation.js";
-import { useSettings as a } from "../../../../hooks/query/use-settings.js";
-import { ComboboxCaretInline as o } from "../../../../ui/combobox-caret.js";
-import { ContextMenu as s } from "../../../../ui/context-menu.js";
+import { useTranslation as e } from "../../../../node_modules/react-i18next/dist/es/useTranslation.js";
+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 { ComboboxCaretInline as a } from "../../../../ui/combobox-caret.js";
+import { ContextMenu as o } from "../../../../ui/context-menu.js";
+import { ContextMenuListItem as s } from "../../context-menu/context-menu-list-item.js";
 import { useClickOutsideElement as c } from "../../../../hooks/use-click-outside-element.js";
-import { useAcpModelContext as l } from "../../../../hooks/use-acp-model-context.js";
-import u from "../../../../icons/settings-gear.js";
-import { NavigationLink as d } from "../../../shared/navigation-link.js";
-import { Divider as f } from "../../../../ui/divider.js";
-import p from "react";
-import { jsx as m, jsxs as h } from "react/jsx-runtime";
+import { useChatInputModelState as l } from "../../../../hooks/use-chat-input-model-state.js";
+import { useSwitchAcpModel as u } from "../../../../hooks/mutation/use-switch-acp-model.js";
+import d from "../../../../icons/settings-gear.js";
+import { NavigationLink as f } from "../../../shared/navigation-link.js";
+import { Divider as p } from "../../../../ui/divider.js";
+import m from "react";
+import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
 //#region src/components/features/chat/components/chat-input-model.tsx
-var g = 10, _ = 22;
-function v(e, t = g) {
+var v = 10, y = 22;
+function b(e, t = v) {
 	return e.length <= t ? e : `${e.slice(0, t)}…`;
 }
-function y() {
-	let { data: y } = i(), { data: b } = a(), { isActiveAcpConversation: x, isHomeAcp: S, isAcpContext: C, destinationPath: w, destinationLabel: T } = l(), E = x ? y?.acp_server : S && typeof b?.agent_settings?.acp_server == "string" ? b.agent_settings.acp_server : null, D = S ? t(E) : void 0, O;
-	O = x ? y?.llm_model : S ? r({
-		configured: typeof b?.agent_settings?.acp_model == "string" ? b.agent_settings.acp_model : null,
-		providerDefault: D?.default_model
-	}) : y?.llm_model ?? b?.llm_model;
-	let [k, A] = p.useState(!1), j = c(() => {
-		A(!1);
-	});
-	if (!O) return null;
-	let M = C ? n(E, O) ?? O : O, N = v(M, C ? _ : g);
-	return /* @__PURE__ */ h("div", {
+function x({ model: a, onClose: o, dividerInset: c, settingsLinkClassName: l, settingsIconClassName: m }) {
+	let { t: v } = e("openhands"), y = u(), b = a.showAcpPicker || !!a.displayModel, x = (e) => {
+		e !== a.currentModelId && y.mutate({
+			conversationId: a.switchConversationId,
+			model: e
+		}), o();
+	};
+	return /* @__PURE__ */ _(h, { children: [
+		a.showAcpPicker ? /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ g("li", {
+			role: "presentation",
+			className: "px-2 pt-1 pb-0.5",
+			children: /* @__PURE__ */ g(i.Text, {
+				className: "text-[11px] font-medium text-[var(--oh-text-dim)] uppercase tracking-wide leading-4",
+				children: v(t.MODEL$AVAILABLE_MODELS)
+			})
+		}), a.availableAcpModels.map((e) => {
+			let t = e.id === a.currentModelId;
+			return /* @__PURE__ */ _(s, {
+				testId: `chat-input-acp-model-option-${e.id}`,
+				onClick: (t) => {
+					t.preventDefault(), t.stopPropagation(), x(e.id);
+				},
+				className: n("flex items-center gap-2", t && "bg-[var(--oh-interactive-hover)]"),
+				children: [/* @__PURE__ */ g("span", {
+					className: "flex-1 truncate text-sm leading-5",
+					title: e.label,
+					children: e.label
+				}), t && /* @__PURE__ */ g(r, {
+					width: 14,
+					height: 14,
+					className: "shrink-0",
+					"aria-hidden": !0
+				})]
+			}, e.id);
+		})] }) : a.displayModel ? /* @__PURE__ */ g("li", {
+			className: "text-sm",
+			children: /* @__PURE__ */ g("div", {
+				className: "p-2 leading-5 text-[var(--oh-foreground)] break-all",
+				children: a.displayModel
+			})
+		}) : null,
+		b && /* @__PURE__ */ g(p, { inset: c }),
+		/* @__PURE__ */ g("li", {
+			className: "text-sm",
+			children: /* @__PURE__ */ _(f, {
+				to: a.destinationPath,
+				onClick: o,
+				className: n("flex h-[30px] items-center gap-2 rounded p-2 leading-5 text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)] transition-colors", l),
+				children: [/* @__PURE__ */ g(d, {
+					width: 16,
+					height: 16,
+					className: n("shrink-0", m),
+					"aria-hidden": !0
+				}), /* @__PURE__ */ g("span", { children: a.destinationLabel })]
+			})
+		})
+	] });
+}
+function S() {
+	let e = l(), [t, r] = m.useState(!1), i = m.useRef(null), s = c(() => r(!1), i);
+	if (!e.displayModel) return null;
+	let u = b(e.displayModel, e.isAcpContext ? y : v);
+	return /* @__PURE__ */ _("div", {
 		className: "relative min-w-0",
-		children: [/* @__PURE__ */ h("button", {
+		children: [/* @__PURE__ */ _("button", {
+			ref: i,
 			type: "button",
-			className: e("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", "hover:text-white hover:bg-white/10 cursor-pointer"),
-			title: M,
+			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", "hover:text-white hover:bg-white/10 cursor-pointer"),
+			title: e.displayModel,
 			"data-testid": "chat-input-llm-model",
-			"aria-expanded": k,
+			"aria-expanded": t,
 			"aria-haspopup": "dialog",
 			onClick: (e) => {
-				e.preventDefault(), e.stopPropagation(), A((e) => !e);
+				e.preventDefault(), e.stopPropagation(), r((e) => !e);
 			},
-			children: [/* @__PURE__ */ m("span", { children: N }), /* @__PURE__ */ m(o, { isOpen: k })]
-		}), k && /* @__PURE__ */ h(s, {
-			ref: j,
+			children: [/* @__PURE__ */ g("span", { children: u }), /* @__PURE__ */ g(a, { isOpen: t })]
+		}), t && /* @__PURE__ */ g(o, {
+			ref: s,
 			testId: "chat-input-llm-model-popover",
 			position: "top",
 			alignment: "left",
 			spacing: "none",
-			className: "z-[60] mb-2 min-w-[200px] max-w-[320px]",
-			children: [
-				/* @__PURE__ */ m("li", {
-					className: "text-sm",
-					children: /* @__PURE__ */ m("div", {
-						className: "p-2 leading-5 text-white break-all",
-						children: M
-					})
-				}),
-				/* @__PURE__ */ m(f, {}),
-				/* @__PURE__ */ m("li", {
-					className: "text-sm",
-					children: /* @__PURE__ */ h(d, {
-						to: w,
-						onClick: () => A(!1),
-						className: "flex h-[30px] items-center gap-2 rounded p-2 leading-5 text-white hover:bg-[var(--oh-interactive-hover)] transition-colors",
-						children: [/* @__PURE__ */ m(u, {
-							width: 16,
-							height: 16,
-							className: "shrink-0",
-							"aria-hidden": !0
-						}), /* @__PURE__ */ m("span", { children: T })]
-					})
-				})
-			]
+			className: "z-[60] mb-2 min-w-[200px] max-w-[320px] max-h-[60vh] overflow-y-auto",
+			children: /* @__PURE__ */ g(x, {
+				model: e,
+				onClose: () => r(!1)
+			})
 		})]
 	});
 }
 //#endregion
-export { y as ChatInputModel };
+export { S as ChatInputModel, x as ChatInputModelMenuContent };
 
 //# sourceMappingURL=chat-input-model.js.map

package/dist/components/features/chat/components/chat-input-model.js.map

@@ -1 +1 @@
-{"version":3,"file":"chat-input-model.js","names":[],"sources":["../../../../../src/components/features/chat/components/chat-input-model.tsx"],"sourcesContent":["import { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useSettings } from \"#/hooks/query/use-settings\";\nimport { useAcpModelContext } from \"#/hooks/use-acp-model-context\";\nimport { ComboboxCaretInline } from \"#/ui/combobox-caret\";\nimport SettingsGearIcon from \"#/icons/settings-gear.svg?react\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { NavigationLink } from \"#/components/shared/navigation-link\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { Divider } from \"#/ui/divider\";\nimport {\n  getAcpProvider,\n  labelForAcpModel,\n  resolveEffectiveAcpModel,\n} from \"#/constants/acp-providers\";\nimport { cn } from \"#/utils/utils\";\nimport React from \"react\";\n\nconst MODEL_LABEL_MAX_CHARS = 10;\n// ACP surfaces show the provider's human label (e.g. \"Claude Opus 4.7\"),\n// which is longer than a raw model id, so the inline button gets a wider cap\n// before truncating. The full string still shows in the title + popover.\nconst ACP_MODEL_LABEL_MAX_CHARS = 22;\n\nfunction truncateModelLabel(\n  model: string,\n  maxChars: number = MODEL_LABEL_MAX_CHARS,\n): string {\n  if (model.length <= maxChars) {\n    return model;\n  }\n  return `${model.slice(0, maxChars)}…`;\n}\n\nexport function ChatInputModel() {\n  const { data: conversation } = useActiveConversation();\n  // Home page has no active conversation; fall back to the user's default\n  // model so the switcher renders consistently across both surfaces.\n  const { data: settings } = useSettings();\n  const {\n    isActiveAcpConversation,\n    isHomeAcp,\n    isAcpContext,\n    destinationPath,\n    destinationLabel,\n  } = useAcpModelContext();\n  // ACP conversations do not use the OpenHands LLM profile. Resolve the model\n  // label through the shared helper so the displayed value matches what the\n  // conversation-creation path will actually send to the agent-server (the\n  // helper applies provider defaults + filters out the SDK ``\"default\"``\n  // placeholders + the ``\"acp-managed\"`` sentinel).\n  //\n  // The ACP server key whose registry owns the model label comes off the\n  // active conversation when there is one, else the saved agent settings the\n  // next home-page conversation will inherit.\n  const acpServerKey = isActiveAcpConversation\n    ? conversation?.acp_server\n    : isHomeAcp\n      ? typeof settings?.agent_settings?.acp_server === \"string\"\n        ? settings.agent_settings.acp_server\n        : null\n      : null;\n  const acpProvider = isHomeAcp ? getAcpProvider(acpServerKey) : undefined;\n  let llmModel: string | null | undefined;\n  if (isActiveAcpConversation) {\n    llmModel = conversation?.llm_model;\n  } else if (isHomeAcp) {\n    llmModel = resolveEffectiveAcpModel({\n      configured:\n        typeof settings?.agent_settings?.acp_model === \"string\"\n          ? settings.agent_settings.acp_model\n          : null,\n      providerDefault: acpProvider?.default_model,\n    });\n  } else {\n    llmModel = conversation?.llm_model ?? settings?.llm_model;\n  }\n  const [isPopoverOpen, setIsPopoverOpen] = React.useState(false);\n\n  const popoverRef = useClickOutsideElement<HTMLUListElement>(() => {\n    setIsPopoverOpen(false);\n  });\n\n  if (!llmModel) {\n    return null;\n  }\n  // For ACP, surface the provider's human label (matching the conversation\n  // list chip) instead of the raw ``acp_model`` id; falls back to the raw\n  // value for custom / unknown ids. OpenHands keeps the raw model string.\n  const displayModel = isAcpContext\n    ? (labelForAcpModel(acpServerKey, llmModel) ?? llmModel)\n    : llmModel;\n  const truncatedModelLabel = truncateModelLabel(\n    displayModel,\n    isAcpContext ? ACP_MODEL_LABEL_MAX_CHARS : MODEL_LABEL_MAX_CHARS,\n  );\n\n  return (\n    <div className=\"relative min-w-0\">\n      <button\n        type=\"button\"\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\",\n          \"hover:text-white hover:bg-white/10 cursor-pointer\",\n        )}\n        title={displayModel}\n        data-testid=\"chat-input-llm-model\"\n        aria-expanded={isPopoverOpen}\n        aria-haspopup=\"dialog\"\n        onClick={(event) => {\n          event.preventDefault();\n          event.stopPropagation();\n          setIsPopoverOpen((open) => !open);\n        }}\n      >\n        <span>{truncatedModelLabel}</span>\n        <ComboboxCaretInline isOpen={isPopoverOpen} />\n      </button>\n\n      {isPopoverOpen && (\n        <ContextMenu\n          ref={popoverRef}\n          testId=\"chat-input-llm-model-popover\"\n          position=\"top\"\n          alignment=\"left\"\n          spacing=\"none\"\n          className=\"z-[60] mb-2 min-w-[200px] max-w-[320px]\"\n        >\n          <li className=\"text-sm\">\n            <div className=\"p-2 leading-5 text-white break-all\">\n              {displayModel}\n            </div>\n          </li>\n          <Divider />\n          <li className=\"text-sm\">\n            <NavigationLink\n              to={destinationPath}\n              onClick={() => setIsPopoverOpen(false)}\n              className=\"flex h-[30px] items-center gap-2 rounded p-2 leading-5 text-white hover:bg-[var(--oh-interactive-hover)] transition-colors\"\n            >\n              <SettingsGearIcon\n                width={16}\n                height={16}\n                className=\"shrink-0\"\n                aria-hidden\n              />\n              <span>{destinationLabel}</span>\n            </NavigationLink>\n          </li>\n        </ContextMenu>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAiBA,IAAM,IAAwB,IAIxB,IAA4B;AAElC,SAAS,EACP,GACA,IAAmB,GACX;AAIR,QAHI,EAAM,UAAU,IACX,IAEF,GAAG,EAAM,MAAM,GAAG,EAAS,CAAC;;AAGrC,SAAgB,IAAiB;CAC/B,IAAM,EAAE,MAAM,MAAiB,GAAuB,EAGhD,EAAE,MAAM,MAAa,GAAa,EAClC,EACJ,4BACA,cACA,iBACA,oBACA,wBACE,GAAoB,EAUlB,IAAe,IACjB,GAAc,aACd,KACE,OAAO,GAAU,gBAAgB,cAAe,WAC9C,EAAS,eAAe,aACxB,MAEF,IAAc,IAAY,EAAe,EAAa,GAAG,KAAA,GAC3D;AACJ,CAWE,IAXE,IACS,GAAc,YAChB,IACE,EAAyB;EAClC,YACE,OAAO,GAAU,gBAAgB,aAAc,WAC3C,EAAS,eAAe,YACxB;EACN,iBAAiB,GAAa;EAC/B,CAAC,GAES,GAAc,aAAa,GAAU;CAElD,IAAM,CAAC,GAAe,KAAoB,EAAM,SAAS,GAAM,EAEzD,IAAa,QAA+C;AAChE,IAAiB,GAAM;GACvB;AAEF,KAAI,CAAC,EACH,QAAO;CAKT,IAAM,IAAe,IAChB,EAAiB,GAAc,EAAS,IAAI,IAC7C,GACE,IAAsB,EAC1B,GACA,IAAe,IAA4B,EAC5C;AAED,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,UAAD;GACE,MAAK;GACL,WAAW,EACT,2QACA,oDACD;GACD,OAAO;GACP,eAAY;GACZ,iBAAe;GACf,iBAAc;GACd,UAAU,MAAU;AAGlB,IAFA,EAAM,gBAAgB,EACtB,EAAM,iBAAiB,EACvB,GAAkB,MAAS,CAAC,EAAK;;aAbrC,CAgBE,kBAAC,QAAD,EAAA,UAAO,GAA2B,CAAA,EAClC,kBAAC,GAAD,EAAqB,QAAQ,GAAiB,CAAA,CACvC;MAER,KACC,kBAAC,GAAD;GACE,KAAK;GACL,QAAO;GACP,UAAS;GACT,WAAU;GACV,SAAQ;GACR,WAAU;aANZ;IAQE,kBAAC,MAAD;KAAI,WAAU;eACZ,kBAAC,OAAD;MAAK,WAAU;gBACZ;MACG,CAAA;KACH,CAAA;IACL,kBAAC,GAAD,EAAW,CAAA;IACX,kBAAC,MAAD;KAAI,WAAU;eACZ,kBAAC,GAAD;MACE,IAAI;MACJ,eAAe,EAAiB,GAAM;MACtC,WAAU;gBAHZ,CAKE,kBAAC,GAAD;OACE,OAAO;OACP,QAAQ;OACR,WAAU;OACV,eAAA;OACA,CAAA,EACF,kBAAC,QAAD,EAAA,UAAO,GAAwB,CAAA,CAChB;;KACd,CAAA;IACO;KAEZ"}
+{"version":3,"file":"chat-input-model.js","names":[],"sources":["../../../../../src/components/features/chat/components/chat-input-model.tsx"],"sourcesContent":["import { useTranslation } from \"react-i18next\";\nimport {\n  useChatInputModelState,\n  type ChatInputModelState,\n} from \"#/hooks/use-chat-input-model-state\";\nimport { useSwitchAcpModel } from \"#/hooks/mutation/use-switch-acp-model\";\nimport { ComboboxCaretInline } from \"#/ui/combobox-caret\";\nimport SettingsGearIcon from \"#/icons/settings-gear.svg?react\";\nimport CheckIcon from \"#/icons/checkmark.svg?react\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { NavigationLink } from \"#/components/shared/navigation-link\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { ContextMenuListItem } from \"#/components/features/context-menu/context-menu-list-item\";\nimport { Divider } from \"#/ui/divider\";\nimport { Typography } from \"#/ui/typography\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { cn } from \"#/utils/utils\";\nimport React from \"react\";\n\nconst MODEL_LABEL_MAX_CHARS = 10;\n// ACP surfaces show the provider's human label (e.g. \"Claude Opus 4.7\"),\n// which is longer than a raw model id, so the inline button gets a wider cap\n// before truncating. The full string still shows in the title + popover.\nconst ACP_MODEL_LABEL_MAX_CHARS = 22;\n\nfunction truncateModelLabel(\n  model: string,\n  maxChars: number = MODEL_LABEL_MAX_CHARS,\n): string {\n  if (model.length <= maxChars) {\n    return model;\n  }\n  return `${model.slice(0, maxChars)}…`;\n}\n\ninterface ChatInputModelMenuContentProps {\n  model: ChatInputModelState;\n  onClose: () => void;\n  dividerInset?: \"menu\";\n  settingsLinkClassName?: string;\n  settingsIconClassName?: string;\n}\n\nexport function ChatInputModelMenuContent({\n  model,\n  onClose,\n  dividerInset,\n  settingsLinkClassName,\n  settingsIconClassName,\n}: ChatInputModelMenuContentProps) {\n  const { t } = useTranslation(\"openhands\");\n  const switchAcpModel = useSwitchAcpModel();\n  const hasModelRows = model.showAcpPicker || Boolean(model.displayModel);\n\n  const handleSelectAcpModel = (modelId: string) => {\n    if (modelId !== model.currentModelId) {\n      switchAcpModel.mutate({\n        conversationId: model.switchConversationId,\n        model: modelId,\n      });\n    }\n    onClose();\n  };\n\n  return (\n    <>\n      {model.showAcpPicker ? (\n        <>\n          {/* role=\"presentation\" keeps this a valid <li> child of the\n              ContextMenu <ul> without exposing the section label as a\n              selectable menu item (the label text is still announced). */}\n          <li role=\"presentation\" 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.MODEL$AVAILABLE_MODELS)}\n            </Typography.Text>\n          </li>\n          {model.availableAcpModels.map((option) => {\n            const isSelected = option.id === model.currentModelId;\n            return (\n              <ContextMenuListItem\n                key={option.id}\n                testId={`chat-input-acp-model-option-${option.id}`}\n                onClick={(event) => {\n                  event.preventDefault();\n                  event.stopPropagation();\n                  handleSelectAcpModel(option.id);\n                }}\n                className={cn(\n                  \"flex items-center gap-2\",\n                  isSelected && \"bg-[var(--oh-interactive-hover)]\",\n                )}\n              >\n                <span\n                  className=\"flex-1 truncate text-sm leading-5\"\n                  title={option.label}\n                >\n                  {option.label}\n                </span>\n                {isSelected && (\n                  <CheckIcon\n                    width={14}\n                    height={14}\n                    className=\"shrink-0\"\n                    aria-hidden\n                  />\n                )}\n              </ContextMenuListItem>\n            );\n          })}\n        </>\n      ) : model.displayModel ? (\n        <li className=\"text-sm\">\n          <div className=\"p-2 leading-5 text-[var(--oh-foreground)] break-all\">\n            {model.displayModel}\n          </div>\n        </li>\n      ) : null}\n      {hasModelRows && <Divider inset={dividerInset} />}\n      <li className=\"text-sm\">\n        <NavigationLink\n          to={model.destinationPath}\n          onClick={onClose}\n          className={cn(\n            \"flex h-[30px] items-center gap-2 rounded p-2 leading-5 text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)] transition-colors\",\n            settingsLinkClassName,\n          )}\n        >\n          <SettingsGearIcon\n            width={16}\n            height={16}\n            className={cn(\"shrink-0\", settingsIconClassName)}\n            aria-hidden\n          />\n          <span>{model.destinationLabel}</span>\n        </NavigationLink>\n      </li>\n    </>\n  );\n}\n\nexport function ChatInputModel() {\n  const model = useChatInputModelState();\n  const [isPopoverOpen, setIsPopoverOpen] = React.useState(false);\n  const triggerRef = React.useRef<HTMLButtonElement>(null);\n  const popoverRef = useClickOutsideElement<HTMLUListElement>(\n    () => setIsPopoverOpen(false),\n    triggerRef,\n  );\n\n  if (!model.displayModel) {\n    return null;\n  }\n\n  const truncatedModelLabel = truncateModelLabel(\n    model.displayModel,\n    model.isAcpContext ? ACP_MODEL_LABEL_MAX_CHARS : MODEL_LABEL_MAX_CHARS,\n  );\n\n  return (\n    <div className=\"relative min-w-0\">\n      <button\n        ref={triggerRef}\n        type=\"button\"\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\",\n          \"hover:text-white hover:bg-white/10 cursor-pointer\",\n        )}\n        title={model.displayModel}\n        data-testid=\"chat-input-llm-model\"\n        aria-expanded={isPopoverOpen}\n        aria-haspopup=\"dialog\"\n        onClick={(event) => {\n          event.preventDefault();\n          event.stopPropagation();\n          setIsPopoverOpen((open) => !open);\n        }}\n      >\n        <span>{truncatedModelLabel}</span>\n        <ComboboxCaretInline isOpen={isPopoverOpen} />\n      </button>\n\n      {isPopoverOpen && (\n        <ContextMenu\n          ref={popoverRef}\n          testId=\"chat-input-llm-model-popover\"\n          position=\"top\"\n          alignment=\"left\"\n          spacing=\"none\"\n          className=\"z-[60] mb-2 min-w-[200px] max-w-[320px] max-h-[60vh] overflow-y-auto\"\n        >\n          <ChatInputModelMenuContent\n            model={model}\n            onClose={() => setIsPopoverOpen(false)}\n          />\n        </ContextMenu>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/features/chat/components/slash-command-menu.cjs

@@ -1,3 +1,3 @@
 const e=require(`../../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../../utils/utils.cjs`),r=require(`../../../../ui/typography.cjs`);let i=require(`react`);i=e.__toESM(i,1);let a=require(`react/jsx-runtime`);function o(e){return e.replace(/!\[([^\]]*)\]\([^)]*\)/g,`$1`).replace(/\[([^\]]*)\]\([^)]*\)/g,`$1`).replace(/\*{3}(.+?)\*{3}/g,`$1`).replace(/\*{2}(.+?)\*{2}/g,`$1`).replace(/\*(.+?)\*/g,`$1`).replace(/_{3}(.+?)_{3}/g,`$1`).replace(/_{2}(.+?)_{2}/g,`$1`).replace(/_(.+?)_/g,`$1`).replace(/`(.+?)`/g,`$1`).replace(/~~(.+?)~~/g,`$1`)}function s(e){let t=e,n=e.match(/^---\s*\n([\s\S]*?)\n---/);if(n){let r=n[1].match(/^description:\s*(.+)$/m);if(r){let e=r[1].trim();return(e.startsWith(`"`)&&e.endsWith(`"`)||e.startsWith(`'`)&&e.endsWith(`'`))&&(e=e.slice(1,-1)),o(e)}t=e.slice(n[0].length)}let r=t.split(`
-`).map(e=>e.trim()).find(e=>e.length>0&&!e.startsWith(`#`)&&e!==`---`);if(!r)return null;let i=o(r);return i.match(/^[^.!?\n]*[.!?]/)?.[0]||i}function c({item:e,isSelected:t,onSelect:c,ref:l}){let u=(0,i.useMemo)(()=>`content`in e.skill&&e.skill.content?s(e.skill.content):`description`in e.skill&&e.skill.description?o(e.skill.description):null,[e.skill]);return(0,a.jsxs)(`button`,{role:`option`,"aria-selected":t,ref:l,type:`button`,className:n.cn(`w-full px-3 py-2.5 text-left transition-colors`,t?`bg-tertiary`:`hover:bg-[var(--oh-surface-raised)]`),onMouseDown:t=>{t.preventDefault(),c(e)},children:[(0,a.jsx)(r.Text,{className:`font-normal`,children:e.command}),u&&(0,a.jsx)(r.Text,{className:`text-xs text-[var(--oh-muted)] mt-0.5 truncate block`,children:u})]})}function l({items:e,selectedIndex:n,onSelect:r}){let{t:o}=t.useTranslation(`openhands`),s=(0,i.useRef)([]);return(0,i.useEffect)(()=>{s.current=s.current.slice(0,e.length)},[e.length]),(0,i.useEffect)(()=>{let e=s.current[n];e&&e.scrollIntoView({block:`nearest`})},[n]),e.length===0?null:(0,a.jsxs)(`div`,{role:`listbox`,"aria-label":o(`CHAT_INTERFACE$COMMANDS`),className:`absolute bottom-full left-0 w-full mb-1 bg-[var(--oh-surface)] border border-[var(--oh-border-subtle)] rounded-lg shadow-lg max-h-[300px] overflow-y-auto custom-scrollbar z-50`,"data-testid":`slash-command-menu`,children:[(0,a.jsx)(`div`,{className:`px-3 py-2 text-xs text-[var(--oh-muted)] border-b border-[var(--oh-border-subtle)]`,children:o(`CHAT_INTERFACE$COMMANDS`)}),e.map((e,t)=>(0,a.jsx)(c,{item:e,isSelected:t===n,onSelect:r,ref:e=>{s.current[t]=e}},e.command))]})}exports.SlashCommandMenu=l;
+`).map(e=>e.trim()).find(e=>e.length>0&&!e.startsWith(`#`)&&e!==`---`);if(!r)return null;let i=o(r);return i.match(/^[^.!?\n]*[.!?]/)?.[0]||i}function c({item:e,isSelected:t,onSelect:c,ref:l}){let u=(0,i.useMemo)(()=>`description`in e.skill&&e.skill.description?o(e.skill.description):`content`in e.skill&&e.skill.content?s(e.skill.content):null,[e.skill]);return(0,a.jsxs)(`button`,{role:`option`,"aria-selected":t,ref:l,type:`button`,className:n.cn(`w-full px-3 py-2.5 text-left transition-colors`,t?`bg-tertiary`:`hover:bg-[var(--oh-surface-raised)]`),onMouseDown:t=>{t.preventDefault(),c(e)},children:[(0,a.jsx)(r.Text,{className:`font-normal`,children:e.command}),u&&(0,a.jsx)(r.Text,{className:`text-xs text-[var(--oh-muted)] mt-0.5 truncate block`,children:u})]})}function l({items:e,selectedIndex:n,onSelect:r}){let{t:o}=t.useTranslation(`openhands`),s=(0,i.useRef)([]);return(0,i.useEffect)(()=>{s.current=s.current.slice(0,e.length)},[e.length]),(0,i.useEffect)(()=>{let e=s.current[n];e&&e.scrollIntoView({block:`nearest`})},[n]),e.length===0?null:(0,a.jsxs)(`div`,{role:`listbox`,"aria-label":o(`CHAT_INTERFACE$COMMANDS`),className:`absolute bottom-full left-0 w-full mb-1 bg-[var(--oh-surface)] border border-[var(--oh-border-subtle)] rounded-lg shadow-lg max-h-[300px] overflow-y-auto custom-scrollbar z-50`,"data-testid":`slash-command-menu`,children:[(0,a.jsx)(`div`,{className:`px-3 py-2 text-xs text-[var(--oh-muted)] border-b border-[var(--oh-border-subtle)]`,children:o(`CHAT_INTERFACE$COMMANDS`)}),e.map((e,t)=>(0,a.jsx)(c,{item:e,isSelected:t===n,onSelect:r,ref:e=>{s.current[t]=e}},e.command))]})}exports.SlashCommandMenu=l;
 //# sourceMappingURL=slash-command-menu.cjs.map

package/dist/components/features/chat/components/slash-command-menu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"slash-command-menu.cjs","names":[],"sources":["../../../../../src/components/features/chat/components/slash-command-menu.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"#/utils/utils\";\nimport { Text } from \"#/ui/typography\";\nimport { SlashCommandItem } from \"#/hooks/chat/use-slash-command\";\n\n/**\n * Strip common inline Markdown syntax so descriptions render as plain text.\n * Handles: bold, italic, inline code, links, and images.\n */\nexport function stripMarkdown(text: string): string {\n  return (\n    text\n      // Images: ![alt](url) → alt\n      .replace(/!\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n      // Links: [text](url) → text\n      .replace(/\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n      // Bold/italic: ***text***, **text**, *text*, ___text___, __text__, _text_\n      .replace(/\\*{3}(.+?)\\*{3}/g, \"$1\")\n      .replace(/\\*{2}(.+?)\\*{2}/g, \"$1\")\n      .replace(/\\*(.+?)\\*/g, \"$1\")\n      .replace(/_{3}(.+?)_{3}/g, \"$1\")\n      .replace(/_{2}(.+?)_{2}/g, \"$1\")\n      .replace(/_(.+?)_/g, \"$1\")\n      // Inline code: `text` → text\n      .replace(/`(.+?)`/g, \"$1\")\n      // Strikethrough: ~~text~~ → text\n      .replace(/~~(.+?)~~/g, \"$1\")\n  );\n}\n\n/**\n * Extract a short description from skill content.\n * Tries YAML frontmatter \"description:\" first, then falls back\n * to the first meaningful line after headers and frontmatter.\n * Returns plain text with Markdown formatting stripped.\n */\nexport function getSkillDescription(content: string): string | null {\n  let body = content;\n\n  // Try to extract description from YAML frontmatter\n  const frontmatterMatch = content.match(/^---\\s*\\n([\\s\\S]*?)\\n---/);\n  if (frontmatterMatch) {\n    const descMatch = frontmatterMatch[1].match(/^description:\\s*(.+)$/m);\n    if (descMatch) {\n      let desc = descMatch[1].trim();\n      // Strip surrounding quotes from YAML values\n      if (\n        (desc.startsWith('\"') && desc.endsWith('\"')) ||\n        (desc.startsWith(\"'\") && desc.endsWith(\"'\"))\n      ) {\n        desc = desc.slice(1, -1);\n      }\n      return stripMarkdown(desc);\n    }\n    // Skip frontmatter for body parsing\n    body = content.slice(frontmatterMatch[0].length);\n  }\n\n  // Fall back to first meaningful line (skip headers, empty lines, frontmatter delimiters)\n  const meaningful = body\n    .split(\"\\n\")\n    .map((line) => line.trim())\n    .find((line) => line.length > 0 && !line.startsWith(\"#\") && line !== \"---\");\n\n  if (!meaningful) return null;\n\n  // Strip Markdown first so URLs inside links don't confuse sentence detection\n  const stripped = stripMarkdown(meaningful);\n  const sentence = stripped.match(/^[^.!?\\n]*[.!?]/);\n  return sentence?.[0] || stripped;\n}\n\ninterface SlashCommandMenuItemProps {\n  item: SlashCommandItem;\n  isSelected: boolean;\n  onSelect: (item: SlashCommandItem) => void;\n  ref?: React.Ref<HTMLButtonElement>;\n}\n\nfunction SlashCommandMenuItem({\n  item,\n  isSelected,\n  onSelect,\n  ref,\n}: SlashCommandMenuItemProps) {\n  const description = useMemo(() => {\n    if (\"content\" in item.skill && item.skill.content) {\n      return getSkillDescription(item.skill.content);\n    }\n    if (\"description\" in item.skill && item.skill.description) {\n      return stripMarkdown(item.skill.description);\n    }\n    return null;\n  }, [item.skill]);\n\n  return (\n    <button\n      role=\"option\"\n      aria-selected={isSelected}\n      ref={ref}\n      type=\"button\"\n      className={cn(\n        \"w-full px-3 py-2.5 text-left transition-colors\",\n        isSelected ? \"bg-tertiary\" : \"hover:bg-[var(--oh-surface-raised)]\",\n      )}\n      onMouseDown={(e) => {\n        // Use mouseDown instead of click to fire before input blur\n        e.preventDefault();\n        onSelect(item);\n      }}\n    >\n      <Text className=\"font-normal\">{item.command}</Text>\n      {description && (\n        <Text className=\"text-xs text-[var(--oh-muted)] mt-0.5 truncate block\">\n          {description}\n        </Text>\n      )}\n    </button>\n  );\n}\n\ninterface SlashCommandMenuProps {\n  items: SlashCommandItem[];\n  selectedIndex: number;\n  onSelect: (item: SlashCommandItem) => void;\n}\n\nexport function SlashCommandMenu({\n  items,\n  selectedIndex,\n  onSelect,\n}: SlashCommandMenuProps) {\n  const { t } = useTranslation(\"openhands\");\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n\n  // Keep refs array in sync with items length\n  useEffect(() => {\n    itemRefs.current = itemRefs.current.slice(0, items.length);\n  }, [items.length]);\n\n  // Scroll selected item into view\n  useEffect(() => {\n    const selectedItem = itemRefs.current[selectedIndex];\n    if (selectedItem) {\n      selectedItem.scrollIntoView({ block: \"nearest\" });\n    }\n  }, [selectedIndex]);\n\n  if (items.length === 0) return null;\n\n  return (\n    <div\n      role=\"listbox\"\n      aria-label={t(\"CHAT_INTERFACE$COMMANDS\")}\n      className=\"absolute bottom-full left-0 w-full mb-1 bg-[var(--oh-surface)] border border-[var(--oh-border-subtle)] rounded-lg shadow-lg max-h-[300px] overflow-y-auto custom-scrollbar z-50\"\n      data-testid=\"slash-command-menu\"\n    >\n      <div className=\"px-3 py-2 text-xs text-[var(--oh-muted)] border-b border-[var(--oh-border-subtle)]\">\n        {t(\"CHAT_INTERFACE$COMMANDS\")}\n      </div>\n      {items.map((item, index) => (\n        <SlashCommandMenuItem\n          key={item.command}\n          item={item}\n          isSelected={index === selectedIndex}\n          onSelect={onSelect}\n          ref={(el) => {\n            itemRefs.current[index] = el;\n          }}\n        />\n      ))}\n    </div>\n  );\n}\n"],"mappings":"4SAUA,SAAgB,EAAc,EAAsB,CAClD,OACE,EAEG,QAAQ,0BAA2B,KAAK,CAExC,QAAQ,yBAA0B,KAAK,CAEvC,QAAQ,mBAAoB,KAAK,CACjC,QAAQ,mBAAoB,KAAK,CACjC,QAAQ,aAAc,KAAK,CAC3B,QAAQ,iBAAkB,KAAK,CAC/B,QAAQ,iBAAkB,KAAK,CAC/B,QAAQ,WAAY,KAAK,CAEzB,QAAQ,WAAY,KAAK,CAEzB,QAAQ,aAAc,KAAK,CAUlC,SAAgB,EAAoB,EAAgC,CAClE,IAAI,EAAO,EAGL,EAAmB,EAAQ,MAAM,2BAA2B,CAClE,GAAI,EAAkB,CACpB,IAAM,EAAY,EAAiB,GAAG,MAAM,yBAAyB,CACrE,GAAI,EAAW,CACb,IAAI,EAAO,EAAU,GAAG,MAAM,CAQ9B,OALG,EAAK,WAAW,IAAI,EAAI,EAAK,SAAS,IAAI,EAC1C,EAAK,WAAW,IAAI,EAAI,EAAK,SAAS,IAAI,IAE3C,EAAO,EAAK,MAAM,EAAG,GAAG,EAEnB,EAAc,EAAK,CAG5B,EAAO,EAAQ,MAAM,EAAiB,GAAG,OAAO,CAIlD,IAAM,EAAa,EAChB,MAAM;EAAK,CACX,IAAK,GAAS,EAAK,MAAM,CAAC,CAC1B,KAAM,GAAS,EAAK,OAAS,GAAK,CAAC,EAAK,WAAW,IAAI,EAAI,IAAS,MAAM,CAE7E,GAAI,CAAC,EAAY,OAAO,KAGxB,IAAM,EAAW,EAAc,EAAW,CAE1C,OADiB,EAAS,MAAM,kBACzB,GAAW,IAAM,EAU1B,SAAS,EAAqB,CAC5B,OACA,aACA,WACA,OAC4B,CAC5B,IAAM,GAAA,EAAA,EAAA,aACA,YAAa,EAAK,OAAS,EAAK,MAAM,QACjC,EAAoB,EAAK,MAAM,QAAQ,CAE5C,gBAAiB,EAAK,OAAS,EAAK,MAAM,YACrC,EAAc,EAAK,MAAM,YAAY,CAEvC,KACN,CAAC,EAAK,MAAM,CAAC,CAEhB,OACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,gBAAe,EACV,MACL,KAAK,SACL,UAAW,EAAA,GACT,iDACA,EAAa,cAAgB,sCAC9B,CACD,YAAc,GAAM,CAElB,EAAE,gBAAgB,CAClB,EAAS,EAAK,WAZlB,EAeE,EAAA,EAAA,KAAC,EAAA,KAAD,CAAM,UAAU,uBAAe,EAAK,QAAe,CAAA,CAClD,IACC,EAAA,EAAA,KAAC,EAAA,KAAD,CAAM,UAAU,gEACb,EACI,CAAA,CAEF,GAUb,SAAgB,EAAiB,CAC/B,QACA,gBACA,YACwB,CACxB,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,GAAA,EAAA,EAAA,QAAgD,EAAE,CAAC,CAiBzD,OAdA,EAAA,EAAA,eAAgB,CACd,EAAS,QAAU,EAAS,QAAQ,MAAM,EAAG,EAAM,OAAO,EACzD,CAAC,EAAM,OAAO,CAAC,EAGlB,EAAA,EAAA,eAAgB,CACd,IAAM,EAAe,EAAS,QAAQ,GAClC,GACF,EAAa,eAAe,CAAE,MAAO,UAAW,CAAC,EAElD,CAAC,EAAc,CAAC,CAEf,EAAM,SAAW,EAAU,MAG7B,EAAA,EAAA,MAAC,MAAD,CACE,KAAK,UACL,aAAY,EAAE,0BAA0B,CACxC,UAAU,kLACV,cAAY,8BAJd,EAME,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,8FACZ,EAAE,0BAA0B,CACzB,CAAA,CACL,EAAM,KAAK,EAAM,KAChB,EAAA,EAAA,KAAC,EAAD,CAEQ,OACN,WAAY,IAAU,EACZ,WACV,IAAM,GAAO,CACX,EAAS,QAAQ,GAAS,GAE5B,CAPK,EAAK,QAOV,CACF,CACE"}
+{"version":3,"file":"slash-command-menu.cjs","names":[],"sources":["../../../../../src/components/features/chat/components/slash-command-menu.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"#/utils/utils\";\nimport { Text } from \"#/ui/typography\";\nimport { SlashCommandItem } from \"#/hooks/chat/use-slash-command\";\n\n/**\n * Strip common inline Markdown syntax so descriptions render as plain text.\n * Handles: bold, italic, inline code, links, and images.\n */\nexport function stripMarkdown(text: string): string {\n  return (\n    text\n      // Images: ![alt](url) → alt\n      .replace(/!\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n      // Links: [text](url) → text\n      .replace(/\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n      // Bold/italic: ***text***, **text**, *text*, ___text___, __text__, _text_\n      .replace(/\\*{3}(.+?)\\*{3}/g, \"$1\")\n      .replace(/\\*{2}(.+?)\\*{2}/g, \"$1\")\n      .replace(/\\*(.+?)\\*/g, \"$1\")\n      .replace(/_{3}(.+?)_{3}/g, \"$1\")\n      .replace(/_{2}(.+?)_{2}/g, \"$1\")\n      .replace(/_(.+?)_/g, \"$1\")\n      // Inline code: `text` → text\n      .replace(/`(.+?)`/g, \"$1\")\n      // Strikethrough: ~~text~~ → text\n      .replace(/~~(.+?)~~/g, \"$1\")\n  );\n}\n\n/**\n * Extract a short description from skill content.\n * Tries YAML frontmatter \"description:\" first, then falls back\n * to the first meaningful line after headers and frontmatter.\n * Returns plain text with Markdown formatting stripped.\n */\nexport function getSkillDescription(content: string): string | null {\n  let body = content;\n\n  // Try to extract description from YAML frontmatter\n  const frontmatterMatch = content.match(/^---\\s*\\n([\\s\\S]*?)\\n---/);\n  if (frontmatterMatch) {\n    const descMatch = frontmatterMatch[1].match(/^description:\\s*(.+)$/m);\n    if (descMatch) {\n      let desc = descMatch[1].trim();\n      // Strip surrounding quotes from YAML values\n      if (\n        (desc.startsWith('\"') && desc.endsWith('\"')) ||\n        (desc.startsWith(\"'\") && desc.endsWith(\"'\"))\n      ) {\n        desc = desc.slice(1, -1);\n      }\n      return stripMarkdown(desc);\n    }\n    // Skip frontmatter for body parsing\n    body = content.slice(frontmatterMatch[0].length);\n  }\n\n  // Fall back to first meaningful line (skip headers, empty lines, frontmatter delimiters)\n  const meaningful = body\n    .split(\"\\n\")\n    .map((line) => line.trim())\n    .find((line) => line.length > 0 && !line.startsWith(\"#\") && line !== \"---\");\n\n  if (!meaningful) return null;\n\n  // Strip Markdown first so URLs inside links don't confuse sentence detection\n  const stripped = stripMarkdown(meaningful);\n  const sentence = stripped.match(/^[^.!?\\n]*[.!?]/);\n  return sentence?.[0] || stripped;\n}\n\ninterface SlashCommandMenuItemProps {\n  item: SlashCommandItem;\n  isSelected: boolean;\n  onSelect: (item: SlashCommandItem) => void;\n  ref?: React.Ref<HTMLButtonElement>;\n}\n\nfunction SlashCommandMenuItem({\n  item,\n  isSelected,\n  onSelect,\n  ref,\n}: SlashCommandMenuItemProps) {\n  const description = useMemo(() => {\n    if (\"description\" in item.skill && item.skill.description) {\n      return stripMarkdown(item.skill.description);\n    }\n    if (\"content\" in item.skill && item.skill.content) {\n      return getSkillDescription(item.skill.content);\n    }\n    return null;\n  }, [item.skill]);\n\n  return (\n    <button\n      role=\"option\"\n      aria-selected={isSelected}\n      ref={ref}\n      type=\"button\"\n      className={cn(\n        \"w-full px-3 py-2.5 text-left transition-colors\",\n        isSelected ? \"bg-tertiary\" : \"hover:bg-[var(--oh-surface-raised)]\",\n      )}\n      onMouseDown={(e) => {\n        // Use mouseDown instead of click to fire before input blur\n        e.preventDefault();\n        onSelect(item);\n      }}\n    >\n      <Text className=\"font-normal\">{item.command}</Text>\n      {description && (\n        <Text className=\"text-xs text-[var(--oh-muted)] mt-0.5 truncate block\">\n          {description}\n        </Text>\n      )}\n    </button>\n  );\n}\n\ninterface SlashCommandMenuProps {\n  items: SlashCommandItem[];\n  selectedIndex: number;\n  onSelect: (item: SlashCommandItem) => void;\n}\n\nexport function SlashCommandMenu({\n  items,\n  selectedIndex,\n  onSelect,\n}: SlashCommandMenuProps) {\n  const { t } = useTranslation(\"openhands\");\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n\n  // Keep refs array in sync with items length\n  useEffect(() => {\n    itemRefs.current = itemRefs.current.slice(0, items.length);\n  }, [items.length]);\n\n  // Scroll selected item into view\n  useEffect(() => {\n    const selectedItem = itemRefs.current[selectedIndex];\n    if (selectedItem) {\n      selectedItem.scrollIntoView({ block: \"nearest\" });\n    }\n  }, [selectedIndex]);\n\n  if (items.length === 0) return null;\n\n  return (\n    <div\n      role=\"listbox\"\n      aria-label={t(\"CHAT_INTERFACE$COMMANDS\")}\n      className=\"absolute bottom-full left-0 w-full mb-1 bg-[var(--oh-surface)] border border-[var(--oh-border-subtle)] rounded-lg shadow-lg max-h-[300px] overflow-y-auto custom-scrollbar z-50\"\n      data-testid=\"slash-command-menu\"\n    >\n      <div className=\"px-3 py-2 text-xs text-[var(--oh-muted)] border-b border-[var(--oh-border-subtle)]\">\n        {t(\"CHAT_INTERFACE$COMMANDS\")}\n      </div>\n      {items.map((item, index) => (\n        <SlashCommandMenuItem\n          key={item.command}\n          item={item}\n          isSelected={index === selectedIndex}\n          onSelect={onSelect}\n          ref={(el) => {\n            itemRefs.current[index] = el;\n          }}\n        />\n      ))}\n    </div>\n  );\n}\n"],"mappings":"4SAUA,SAAgB,EAAc,EAAsB,CAClD,OACE,EAEG,QAAQ,0BAA2B,KAAK,CAExC,QAAQ,yBAA0B,KAAK,CAEvC,QAAQ,mBAAoB,KAAK,CACjC,QAAQ,mBAAoB,KAAK,CACjC,QAAQ,aAAc,KAAK,CAC3B,QAAQ,iBAAkB,KAAK,CAC/B,QAAQ,iBAAkB,KAAK,CAC/B,QAAQ,WAAY,KAAK,CAEzB,QAAQ,WAAY,KAAK,CAEzB,QAAQ,aAAc,KAAK,CAUlC,SAAgB,EAAoB,EAAgC,CAClE,IAAI,EAAO,EAGL,EAAmB,EAAQ,MAAM,2BAA2B,CAClE,GAAI,EAAkB,CACpB,IAAM,EAAY,EAAiB,GAAG,MAAM,yBAAyB,CACrE,GAAI,EAAW,CACb,IAAI,EAAO,EAAU,GAAG,MAAM,CAQ9B,OALG,EAAK,WAAW,IAAI,EAAI,EAAK,SAAS,IAAI,EAC1C,EAAK,WAAW,IAAI,EAAI,EAAK,SAAS,IAAI,IAE3C,EAAO,EAAK,MAAM,EAAG,GAAG,EAEnB,EAAc,EAAK,CAG5B,EAAO,EAAQ,MAAM,EAAiB,GAAG,OAAO,CAIlD,IAAM,EAAa,EAChB,MAAM;EAAK,CACX,IAAK,GAAS,EAAK,MAAM,CAAC,CAC1B,KAAM,GAAS,EAAK,OAAS,GAAK,CAAC,EAAK,WAAW,IAAI,EAAI,IAAS,MAAM,CAE7E,GAAI,CAAC,EAAY,OAAO,KAGxB,IAAM,EAAW,EAAc,EAAW,CAE1C,OADiB,EAAS,MAAM,kBACzB,GAAW,IAAM,EAU1B,SAAS,EAAqB,CAC5B,OACA,aACA,WACA,OAC4B,CAC5B,IAAM,GAAA,EAAA,EAAA,aACA,gBAAiB,EAAK,OAAS,EAAK,MAAM,YACrC,EAAc,EAAK,MAAM,YAAY,CAE1C,YAAa,EAAK,OAAS,EAAK,MAAM,QACjC,EAAoB,EAAK,MAAM,QAAQ,CAEzC,KACN,CAAC,EAAK,MAAM,CAAC,CAEhB,OACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,gBAAe,EACV,MACL,KAAK,SACL,UAAW,EAAA,GACT,iDACA,EAAa,cAAgB,sCAC9B,CACD,YAAc,GAAM,CAElB,EAAE,gBAAgB,CAClB,EAAS,EAAK,WAZlB,EAeE,EAAA,EAAA,KAAC,EAAA,KAAD,CAAM,UAAU,uBAAe,EAAK,QAAe,CAAA,CAClD,IACC,EAAA,EAAA,KAAC,EAAA,KAAD,CAAM,UAAU,gEACb,EACI,CAAA,CAEF,GAUb,SAAgB,EAAiB,CAC/B,QACA,gBACA,YACwB,CACxB,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,GAAA,EAAA,EAAA,QAAgD,EAAE,CAAC,CAiBzD,OAdA,EAAA,EAAA,eAAgB,CACd,EAAS,QAAU,EAAS,QAAQ,MAAM,EAAG,EAAM,OAAO,EACzD,CAAC,EAAM,OAAO,CAAC,EAGlB,EAAA,EAAA,eAAgB,CACd,IAAM,EAAe,EAAS,QAAQ,GAClC,GACF,EAAa,eAAe,CAAE,MAAO,UAAW,CAAC,EAElD,CAAC,EAAc,CAAC,CAEf,EAAM,SAAW,EAAU,MAG7B,EAAA,EAAA,MAAC,MAAD,CACE,KAAK,UACL,aAAY,EAAE,0BAA0B,CACxC,UAAU,kLACV,cAAY,8BAJd,EAME,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,8FACZ,EAAE,0BAA0B,CACzB,CAAA,CACL,EAAM,KAAK,EAAM,KAChB,EAAA,EAAA,KAAC,EAAD,CAEQ,OACN,WAAY,IAAU,EACZ,WACV,IAAM,GAAO,CACX,EAAS,QAAQ,GAAS,GAE5B,CAPK,EAAK,QAOV,CACF,CACE"}

package/dist/components/features/chat/components/slash-command-menu.js

@@ -23,7 +23,7 @@ function l(e) {
 	return i.match(/^[^.!?\n]*[.!?]/)?.[0] || i;
 }
 function u({ item: e, isSelected: r, onSelect: a, ref: u }) {
-	let d = i(() => "content" in e.skill && e.skill.content ? l(e.skill.content) : "description" in e.skill && e.skill.description ? c(e.skill.description) : null, [e.skill]);
+	let d = i(() => "description" in e.skill && e.skill.description ? c(e.skill.description) : "content" in e.skill && e.skill.content ? l(e.skill.content) : null, [e.skill]);
 	return /* @__PURE__ */ s("button", {
 		role: "option",
 		"aria-selected": r,

package/dist/components/features/chat/components/slash-command-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"slash-command-menu.js","names":[],"sources":["../../../../../src/components/features/chat/components/slash-command-menu.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"#/utils/utils\";\nimport { Text } from \"#/ui/typography\";\nimport { SlashCommandItem } from \"#/hooks/chat/use-slash-command\";\n\n/**\n * Strip common inline Markdown syntax so descriptions render as plain text.\n * Handles: bold, italic, inline code, links, and images.\n */\nexport function stripMarkdown(text: string): string {\n  return (\n    text\n      // Images: ![alt](url) → alt\n      .replace(/!\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n      // Links: [text](url) → text\n      .replace(/\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n      // Bold/italic: ***text***, **text**, *text*, ___text___, __text__, _text_\n      .replace(/\\*{3}(.+?)\\*{3}/g, \"$1\")\n      .replace(/\\*{2}(.+?)\\*{2}/g, \"$1\")\n      .replace(/\\*(.+?)\\*/g, \"$1\")\n      .replace(/_{3}(.+?)_{3}/g, \"$1\")\n      .replace(/_{2}(.+?)_{2}/g, \"$1\")\n      .replace(/_(.+?)_/g, \"$1\")\n      // Inline code: `text` → text\n      .replace(/`(.+?)`/g, \"$1\")\n      // Strikethrough: ~~text~~ → text\n      .replace(/~~(.+?)~~/g, \"$1\")\n  );\n}\n\n/**\n * Extract a short description from skill content.\n * Tries YAML frontmatter \"description:\" first, then falls back\n * to the first meaningful line after headers and frontmatter.\n * Returns plain text with Markdown formatting stripped.\n */\nexport function getSkillDescription(content: string): string | null {\n  let body = content;\n\n  // Try to extract description from YAML frontmatter\n  const frontmatterMatch = content.match(/^---\\s*\\n([\\s\\S]*?)\\n---/);\n  if (frontmatterMatch) {\n    const descMatch = frontmatterMatch[1].match(/^description:\\s*(.+)$/m);\n    if (descMatch) {\n      let desc = descMatch[1].trim();\n      // Strip surrounding quotes from YAML values\n      if (\n        (desc.startsWith('\"') && desc.endsWith('\"')) ||\n        (desc.startsWith(\"'\") && desc.endsWith(\"'\"))\n      ) {\n        desc = desc.slice(1, -1);\n      }\n      return stripMarkdown(desc);\n    }\n    // Skip frontmatter for body parsing\n    body = content.slice(frontmatterMatch[0].length);\n  }\n\n  // Fall back to first meaningful line (skip headers, empty lines, frontmatter delimiters)\n  const meaningful = body\n    .split(\"\\n\")\n    .map((line) => line.trim())\n    .find((line) => line.length > 0 && !line.startsWith(\"#\") && line !== \"---\");\n\n  if (!meaningful) return null;\n\n  // Strip Markdown first so URLs inside links don't confuse sentence detection\n  const stripped = stripMarkdown(meaningful);\n  const sentence = stripped.match(/^[^.!?\\n]*[.!?]/);\n  return sentence?.[0] || stripped;\n}\n\ninterface SlashCommandMenuItemProps {\n  item: SlashCommandItem;\n  isSelected: boolean;\n  onSelect: (item: SlashCommandItem) => void;\n  ref?: React.Ref<HTMLButtonElement>;\n}\n\nfunction SlashCommandMenuItem({\n  item,\n  isSelected,\n  onSelect,\n  ref,\n}: SlashCommandMenuItemProps) {\n  const description = useMemo(() => {\n    if (\"content\" in item.skill && item.skill.content) {\n      return getSkillDescription(item.skill.content);\n    }\n    if (\"description\" in item.skill && item.skill.description) {\n      return stripMarkdown(item.skill.description);\n    }\n    return null;\n  }, [item.skill]);\n\n  return (\n    <button\n      role=\"option\"\n      aria-selected={isSelected}\n      ref={ref}\n      type=\"button\"\n      className={cn(\n        \"w-full px-3 py-2.5 text-left transition-colors\",\n        isSelected ? \"bg-tertiary\" : \"hover:bg-[var(--oh-surface-raised)]\",\n      )}\n      onMouseDown={(e) => {\n        // Use mouseDown instead of click to fire before input blur\n        e.preventDefault();\n        onSelect(item);\n      }}\n    >\n      <Text className=\"font-normal\">{item.command}</Text>\n      {description && (\n        <Text className=\"text-xs text-[var(--oh-muted)] mt-0.5 truncate block\">\n          {description}\n        </Text>\n      )}\n    </button>\n  );\n}\n\ninterface SlashCommandMenuProps {\n  items: SlashCommandItem[];\n  selectedIndex: number;\n  onSelect: (item: SlashCommandItem) => void;\n}\n\nexport function SlashCommandMenu({\n  items,\n  selectedIndex,\n  onSelect,\n}: SlashCommandMenuProps) {\n  const { t } = useTranslation(\"openhands\");\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n\n  // Keep refs array in sync with items length\n  useEffect(() => {\n    itemRefs.current = itemRefs.current.slice(0, items.length);\n  }, [items.length]);\n\n  // Scroll selected item into view\n  useEffect(() => {\n    const selectedItem = itemRefs.current[selectedIndex];\n    if (selectedItem) {\n      selectedItem.scrollIntoView({ block: \"nearest\" });\n    }\n  }, [selectedIndex]);\n\n  if (items.length === 0) return null;\n\n  return (\n    <div\n      role=\"listbox\"\n      aria-label={t(\"CHAT_INTERFACE$COMMANDS\")}\n      className=\"absolute bottom-full left-0 w-full mb-1 bg-[var(--oh-surface)] border border-[var(--oh-border-subtle)] rounded-lg shadow-lg max-h-[300px] overflow-y-auto custom-scrollbar z-50\"\n      data-testid=\"slash-command-menu\"\n    >\n      <div className=\"px-3 py-2 text-xs text-[var(--oh-muted)] border-b border-[var(--oh-border-subtle)]\">\n        {t(\"CHAT_INTERFACE$COMMANDS\")}\n      </div>\n      {items.map((item, index) => (\n        <SlashCommandMenuItem\n          key={item.command}\n          item={item}\n          isSelected={index === selectedIndex}\n          onSelect={onSelect}\n          ref={(el) => {\n            itemRefs.current[index] = el;\n          }}\n        />\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAUA,SAAgB,EAAc,GAAsB;AAClD,QACE,EAEG,QAAQ,2BAA2B,KAAK,CAExC,QAAQ,0BAA0B,KAAK,CAEvC,QAAQ,oBAAoB,KAAK,CACjC,QAAQ,oBAAoB,KAAK,CACjC,QAAQ,cAAc,KAAK,CAC3B,QAAQ,kBAAkB,KAAK,CAC/B,QAAQ,kBAAkB,KAAK,CAC/B,QAAQ,YAAY,KAAK,CAEzB,QAAQ,YAAY,KAAK,CAEzB,QAAQ,cAAc,KAAK;;AAUlC,SAAgB,EAAoB,GAAgC;CAClE,IAAI,IAAO,GAGL,IAAmB,EAAQ,MAAM,2BAA2B;AAClE,KAAI,GAAkB;EACpB,IAAM,IAAY,EAAiB,GAAG,MAAM,yBAAyB;AACrE,MAAI,GAAW;GACb,IAAI,IAAO,EAAU,GAAG,MAAM;AAQ9B,WALG,EAAK,WAAW,KAAI,IAAI,EAAK,SAAS,KAAI,IAC1C,EAAK,WAAW,IAAI,IAAI,EAAK,SAAS,IAAI,MAE3C,IAAO,EAAK,MAAM,GAAG,GAAG,GAEnB,EAAc,EAAK;;AAG5B,MAAO,EAAQ,MAAM,EAAiB,GAAG,OAAO;;CAIlD,IAAM,IAAa,EAChB,MAAM,KAAK,CACX,KAAK,MAAS,EAAK,MAAM,CAAC,CAC1B,MAAM,MAAS,EAAK,SAAS,KAAK,CAAC,EAAK,WAAW,IAAI,IAAI,MAAS,MAAM;AAE7E,KAAI,CAAC,EAAY,QAAO;CAGxB,IAAM,IAAW,EAAc,EAAW;AAE1C,QADiB,EAAS,MAAM,kBACzB,GAAW,MAAM;;AAU1B,SAAS,EAAqB,EAC5B,SACA,eACA,aACA,UAC4B;CAC5B,IAAM,IAAc,QACd,aAAa,EAAK,SAAS,EAAK,MAAM,UACjC,EAAoB,EAAK,MAAM,QAAQ,GAE5C,iBAAiB,EAAK,SAAS,EAAK,MAAM,cACrC,EAAc,EAAK,MAAM,YAAY,GAEvC,MACN,CAAC,EAAK,MAAM,CAAC;AAEhB,QACE,kBAAC,UAAD;EACE,MAAK;EACL,iBAAe;EACV;EACL,MAAK;EACL,WAAW,EACT,kDACA,IAAa,gBAAgB,sCAC9B;EACD,cAAc,MAAM;AAGlB,GADA,EAAE,gBAAgB,EAClB,EAAS,EAAK;;YAZlB,CAeE,kBAAC,GAAD;GAAM,WAAU;aAAe,EAAK;GAAe,CAAA,EAClD,KACC,kBAAC,GAAD;GAAM,WAAU;aACb;GACI,CAAA,CAEF;;;AAUb,SAAgB,EAAiB,EAC/B,UACA,kBACA,eACwB;CACxB,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAW,EAAqC,EAAE,CAAC;AAiBzD,QAdA,QAAgB;AACd,IAAS,UAAU,EAAS,QAAQ,MAAM,GAAG,EAAM,OAAO;IACzD,CAAC,EAAM,OAAO,CAAC,EAGlB,QAAgB;EACd,IAAM,IAAe,EAAS,QAAQ;AACtC,EAAI,KACF,EAAa,eAAe,EAAE,OAAO,WAAW,CAAC;IAElD,CAAC,EAAc,CAAC,EAEf,EAAM,WAAW,IAAU,OAG7B,kBAAC,OAAD;EACE,MAAK;EACL,cAAY,EAAE,0BAA0B;EACxC,WAAU;EACV,eAAY;YAJd,CAME,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAE,0BAA0B;GACzB,CAAA,EACL,EAAM,KAAK,GAAM,MAChB,kBAAC,GAAD;GAEQ;GACN,YAAY,MAAU;GACZ;GACV,MAAM,MAAO;AACX,MAAS,QAAQ,KAAS;;GAE5B,EAPK,EAAK,QAOV,CACF,CACE"}
+{"version":3,"file":"slash-command-menu.js","names":[],"sources":["../../../../../src/components/features/chat/components/slash-command-menu.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"#/utils/utils\";\nimport { Text } from \"#/ui/typography\";\nimport { SlashCommandItem } from \"#/hooks/chat/use-slash-command\";\n\n/**\n * Strip common inline Markdown syntax so descriptions render as plain text.\n * Handles: bold, italic, inline code, links, and images.\n */\nexport function stripMarkdown(text: string): string {\n  return (\n    text\n      // Images: ![alt](url) → alt\n      .replace(/!\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n      // Links: [text](url) → text\n      .replace(/\\[([^\\]]*)\\]\\([^)]*\\)/g, \"$1\")\n      // Bold/italic: ***text***, **text**, *text*, ___text___, __text__, _text_\n      .replace(/\\*{3}(.+?)\\*{3}/g, \"$1\")\n      .replace(/\\*{2}(.+?)\\*{2}/g, \"$1\")\n      .replace(/\\*(.+?)\\*/g, \"$1\")\n      .replace(/_{3}(.+?)_{3}/g, \"$1\")\n      .replace(/_{2}(.+?)_{2}/g, \"$1\")\n      .replace(/_(.+?)_/g, \"$1\")\n      // Inline code: `text` → text\n      .replace(/`(.+?)`/g, \"$1\")\n      // Strikethrough: ~~text~~ → text\n      .replace(/~~(.+?)~~/g, \"$1\")\n  );\n}\n\n/**\n * Extract a short description from skill content.\n * Tries YAML frontmatter \"description:\" first, then falls back\n * to the first meaningful line after headers and frontmatter.\n * Returns plain text with Markdown formatting stripped.\n */\nexport function getSkillDescription(content: string): string | null {\n  let body = content;\n\n  // Try to extract description from YAML frontmatter\n  const frontmatterMatch = content.match(/^---\\s*\\n([\\s\\S]*?)\\n---/);\n  if (frontmatterMatch) {\n    const descMatch = frontmatterMatch[1].match(/^description:\\s*(.+)$/m);\n    if (descMatch) {\n      let desc = descMatch[1].trim();\n      // Strip surrounding quotes from YAML values\n      if (\n        (desc.startsWith('\"') && desc.endsWith('\"')) ||\n        (desc.startsWith(\"'\") && desc.endsWith(\"'\"))\n      ) {\n        desc = desc.slice(1, -1);\n      }\n      return stripMarkdown(desc);\n    }\n    // Skip frontmatter for body parsing\n    body = content.slice(frontmatterMatch[0].length);\n  }\n\n  // Fall back to first meaningful line (skip headers, empty lines, frontmatter delimiters)\n  const meaningful = body\n    .split(\"\\n\")\n    .map((line) => line.trim())\n    .find((line) => line.length > 0 && !line.startsWith(\"#\") && line !== \"---\");\n\n  if (!meaningful) return null;\n\n  // Strip Markdown first so URLs inside links don't confuse sentence detection\n  const stripped = stripMarkdown(meaningful);\n  const sentence = stripped.match(/^[^.!?\\n]*[.!?]/);\n  return sentence?.[0] || stripped;\n}\n\ninterface SlashCommandMenuItemProps {\n  item: SlashCommandItem;\n  isSelected: boolean;\n  onSelect: (item: SlashCommandItem) => void;\n  ref?: React.Ref<HTMLButtonElement>;\n}\n\nfunction SlashCommandMenuItem({\n  item,\n  isSelected,\n  onSelect,\n  ref,\n}: SlashCommandMenuItemProps) {\n  const description = useMemo(() => {\n    if (\"description\" in item.skill && item.skill.description) {\n      return stripMarkdown(item.skill.description);\n    }\n    if (\"content\" in item.skill && item.skill.content) {\n      return getSkillDescription(item.skill.content);\n    }\n    return null;\n  }, [item.skill]);\n\n  return (\n    <button\n      role=\"option\"\n      aria-selected={isSelected}\n      ref={ref}\n      type=\"button\"\n      className={cn(\n        \"w-full px-3 py-2.5 text-left transition-colors\",\n        isSelected ? \"bg-tertiary\" : \"hover:bg-[var(--oh-surface-raised)]\",\n      )}\n      onMouseDown={(e) => {\n        // Use mouseDown instead of click to fire before input blur\n        e.preventDefault();\n        onSelect(item);\n      }}\n    >\n      <Text className=\"font-normal\">{item.command}</Text>\n      {description && (\n        <Text className=\"text-xs text-[var(--oh-muted)] mt-0.5 truncate block\">\n          {description}\n        </Text>\n      )}\n    </button>\n  );\n}\n\ninterface SlashCommandMenuProps {\n  items: SlashCommandItem[];\n  selectedIndex: number;\n  onSelect: (item: SlashCommandItem) => void;\n}\n\nexport function SlashCommandMenu({\n  items,\n  selectedIndex,\n  onSelect,\n}: SlashCommandMenuProps) {\n  const { t } = useTranslation(\"openhands\");\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n\n  // Keep refs array in sync with items length\n  useEffect(() => {\n    itemRefs.current = itemRefs.current.slice(0, items.length);\n  }, [items.length]);\n\n  // Scroll selected item into view\n  useEffect(() => {\n    const selectedItem = itemRefs.current[selectedIndex];\n    if (selectedItem) {\n      selectedItem.scrollIntoView({ block: \"nearest\" });\n    }\n  }, [selectedIndex]);\n\n  if (items.length === 0) return null;\n\n  return (\n    <div\n      role=\"listbox\"\n      aria-label={t(\"CHAT_INTERFACE$COMMANDS\")}\n      className=\"absolute bottom-full left-0 w-full mb-1 bg-[var(--oh-surface)] border border-[var(--oh-border-subtle)] rounded-lg shadow-lg max-h-[300px] overflow-y-auto custom-scrollbar z-50\"\n      data-testid=\"slash-command-menu\"\n    >\n      <div className=\"px-3 py-2 text-xs text-[var(--oh-muted)] border-b border-[var(--oh-border-subtle)]\">\n        {t(\"CHAT_INTERFACE$COMMANDS\")}\n      </div>\n      {items.map((item, index) => (\n        <SlashCommandMenuItem\n          key={item.command}\n          item={item}\n          isSelected={index === selectedIndex}\n          onSelect={onSelect}\n          ref={(el) => {\n            itemRefs.current[index] = el;\n          }}\n        />\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAUA,SAAgB,EAAc,GAAsB;AAClD,QACE,EAEG,QAAQ,2BAA2B,KAAK,CAExC,QAAQ,0BAA0B,KAAK,CAEvC,QAAQ,oBAAoB,KAAK,CACjC,QAAQ,oBAAoB,KAAK,CACjC,QAAQ,cAAc,KAAK,CAC3B,QAAQ,kBAAkB,KAAK,CAC/B,QAAQ,kBAAkB,KAAK,CAC/B,QAAQ,YAAY,KAAK,CAEzB,QAAQ,YAAY,KAAK,CAEzB,QAAQ,cAAc,KAAK;;AAUlC,SAAgB,EAAoB,GAAgC;CAClE,IAAI,IAAO,GAGL,IAAmB,EAAQ,MAAM,2BAA2B;AAClE,KAAI,GAAkB;EACpB,IAAM,IAAY,EAAiB,GAAG,MAAM,yBAAyB;AACrE,MAAI,GAAW;GACb,IAAI,IAAO,EAAU,GAAG,MAAM;AAQ9B,WALG,EAAK,WAAW,KAAI,IAAI,EAAK,SAAS,KAAI,IAC1C,EAAK,WAAW,IAAI,IAAI,EAAK,SAAS,IAAI,MAE3C,IAAO,EAAK,MAAM,GAAG,GAAG,GAEnB,EAAc,EAAK;;AAG5B,MAAO,EAAQ,MAAM,EAAiB,GAAG,OAAO;;CAIlD,IAAM,IAAa,EAChB,MAAM,KAAK,CACX,KAAK,MAAS,EAAK,MAAM,CAAC,CAC1B,MAAM,MAAS,EAAK,SAAS,KAAK,CAAC,EAAK,WAAW,IAAI,IAAI,MAAS,MAAM;AAE7E,KAAI,CAAC,EAAY,QAAO;CAGxB,IAAM,IAAW,EAAc,EAAW;AAE1C,QADiB,EAAS,MAAM,kBACzB,GAAW,MAAM;;AAU1B,SAAS,EAAqB,EAC5B,SACA,eACA,aACA,UAC4B;CAC5B,IAAM,IAAc,QACd,iBAAiB,EAAK,SAAS,EAAK,MAAM,cACrC,EAAc,EAAK,MAAM,YAAY,GAE1C,aAAa,EAAK,SAAS,EAAK,MAAM,UACjC,EAAoB,EAAK,MAAM,QAAQ,GAEzC,MACN,CAAC,EAAK,MAAM,CAAC;AAEhB,QACE,kBAAC,UAAD;EACE,MAAK;EACL,iBAAe;EACV;EACL,MAAK;EACL,WAAW,EACT,kDACA,IAAa,gBAAgB,sCAC9B;EACD,cAAc,MAAM;AAGlB,GADA,EAAE,gBAAgB,EAClB,EAAS,EAAK;;YAZlB,CAeE,kBAAC,GAAD;GAAM,WAAU;aAAe,EAAK;GAAe,CAAA,EAClD,KACC,kBAAC,GAAD;GAAM,WAAU;aACb;GACI,CAAA,CAEF;;;AAUb,SAAgB,EAAiB,EAC/B,UACA,kBACA,eACwB;CACxB,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAW,EAAqC,EAAE,CAAC;AAiBzD,QAdA,QAAgB;AACd,IAAS,UAAU,EAAS,QAAQ,MAAM,GAAG,EAAM,OAAO;IACzD,CAAC,EAAM,OAAO,CAAC,EAGlB,QAAgB;EACd,IAAM,IAAe,EAAS,QAAQ;AACtC,EAAI,KACF,EAAa,eAAe,EAAE,OAAO,WAAW,CAAC;IAElD,CAAC,EAAc,CAAC,EAEf,EAAM,WAAW,IAAU,OAG7B,kBAAC,OAAD;EACE,MAAK;EACL,cAAY,EAAE,0BAA0B;EACxC,WAAU;EACV,eAAY;YAJd,CAME,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAE,0BAA0B;GACzB,CAAA,EACL,EAAM,KAAK,GAAM,MAChB,kBAAC,GAAD;GAEQ;GACN,YAAY,MAAU;GACZ;GACV,MAAM,MAAO;AACX,MAAS,QAAQ,KAAS;;GAE5B,EAPK,EAAK,QAOV,CACF,CACE"}

package/dist/components/features/chat/git-control-bar.cjs

@@ -1,2 +1,2 @@
-require(`../../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),t=require(`../../../i18n/declaration.cjs`),n=require(`../../../hooks/use-conversation-id.cjs`),r=require(`../../../contexts/active-backend-context.cjs`),i=require(`../../../utils/custom-toast-handlers.cjs`),a=require(`../../../stores/optimistic-user-message-store.cjs`),o=require(`../../../api/conversation-metadata-store.cjs`),s=require(`../../../hooks/use-send-message.cjs`),c=require(`../../../hooks/query/use-active-conversation.cjs`),l=require(`../../../hooks/query/use-task-polling.cjs`),u=require(`../../../hooks/use-unified-websocket-status.cjs`),d=require(`../../../hooks/mutation/use-create-conversation.cjs`),f=require(`../../../hooks/use-user-providers.cjs`),ee=require(`./git-control-bar-repo-button.cjs`),te=require(`./git-control-bar-branch-button.cjs`),ne=require(`./git-control-bar-pull-button.cjs`),re=require(`./git-control-bar-push-button.cjs`),p=require(`./git-control-bar-pr-button.cjs`),m=require(`../../../hooks/query/use-local-git-info.cjs`),h=require(`../../../hooks/mutation/use-update-conversation-repository.cjs`),g=require(`./git-control-bar-tooltip-wrapper.cjs`),_=require(`../../../stores/home-store.cjs`),v=require(`./open-repository-modal.cjs`);let y=require(`react`),b=require(`react/jsx-runtime`);function x({onSuggestionsClick:x}){let{t:S}=e.useTranslation(`openhands`),{conversationId:C}=n.useConversationId(),[w,T]=(0,y.useState)(!1),[E,D]=(0,y.useState)(!1),O=(0,y.useRef)(null),{addRecentRepository:ie}=_.useHomeStore(),k=a.useOptimisticUserMessageStore(e=>e.enqueuePendingMessage),A=a.useOptimisticUserMessageStore(e=>e.markPendingMessageError),{backend:j}=r.useActiveBackend(),M=j.kind===`local`,{providers:N}=f.useUserProviders(),P=M||N.length>0,{data:F}=c.useActiveConversation(),{repositoryInfo:I}=l.useTaskPolling(),{data:L}=m.useLocalGitInfo(),R=u.useUnifiedWebSocketStatus(),z=(0,y.useRef)(R);(0,y.useEffect)(()=>{z.current=R},[R]);let{send:B}=s.useSendMessage(),V=(0,y.useRef)(B);(0,y.useEffect)(()=>{V.current=B},[B]);let{mutate:H}=h.useUpdateConversationRepository(),{mutate:ae,isPending:oe}=d.useCreateConversation(),U=F?.selected_repository||I?.selectedRepository,W=F?.git_provider||I?.gitProvider,G=F?.selected_branch||I?.selectedBranch,K=U||L?.repository||void 0,q=W||L?.provider,J=G||L?.branch||void 0,Y=(F?.id?o.getStoredConversationMetadata(F.id):null)?.selected_workspace??null,X=Y&&Y.replace(/\/+$/,``).split(`/`).pop()||null,Z=!!K&&!!q,Q=!!F&&R===`OPEN`;(0,y.useEffect)(()=>{if(!E)return;let e=e=>{O.current&&!O.current.contains(e.target)&&D(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[E]),(0,y.useEffect)(()=>{if(!E)return;let e=e=>{e.key===`Escape`&&D(!1)};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[E]);let se=(e,n)=>{C&&(ie(e),H({conversationId:C,repository:e.full_name,branch:n.name,gitProvider:e.git_provider},{onSuccess:()=>{if(z.current!==`OPEN`){i.displayErrorToast(S(t.I18nKey.CONVERSATION$CLONE_COMMAND_FAILED_DISCONNECTED));return}let r=e.git_provider.charAt(0).toUpperCase()+e.git_provider.slice(1),a=`Clone ${e.full_name} from ${r} and checkout branch ${n.name}.`,o=C?k({conversationId:C,text:a}):null;Promise.resolve(V.current({action:`message`,args:{content:a,timestamp:new Date().toISOString()}})).catch(e=>{o&&A(o,e instanceof Error?e.message:`Failed to send message`)})}}))},$=!M||!!K||!!X,ce=M&&!Z;return $||J||Z?(0,b.jsxs)(`div`,{className:`flex flex-row items-center`,children:[(0,b.jsxs)(`div`,{className:`flex flex-row gap-2.5 items-center overflow-x-auto flex-nowrap relative scrollbar-hide`,children:[$?(0,b.jsx)(ee.GitControlBarRepoButton,{selectedRepository:K,gitProvider:q,workspaceName:X,onClick:()=>T(!0),disabled:!Q||ce}):null,J?(0,b.jsx)(te.GitControlBarBranchButton,{selectedBranch:J,selectedRepository:K,gitProvider:q}):null,Z?(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(g.GitControlBarTooltipWrapper,{tooltipMessage:S(t.I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT),testId:`git-control-bar-pull-button-tooltip`,shouldShowTooltip:!Z,children:(0,b.jsx)(ne.GitControlBarPullButton,{onSuggestionsClick:x,hasRepository:Z,providerTokensReady:P,isConversationReady:Q})}),(0,b.jsx)(g.GitControlBarTooltipWrapper,{tooltipMessage:S(t.I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT),testId:`git-control-bar-push-button-tooltip`,shouldShowTooltip:!Z,children:(0,b.jsx)(re.GitControlBarPushButton,{onSuggestionsClick:x,hasRepository:Z,providerTokensReady:P,currentGitProvider:q,isConversationReady:Q})}),(0,b.jsx)(g.GitControlBarTooltipWrapper,{tooltipMessage:S(t.I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT),testId:`git-control-bar-pr-button-tooltip`,shouldShowTooltip:!Z,children:(0,b.jsx)(p.GitControlBarPrButton,{onSuggestionsClick:x,hasRepository:Z,providerTokensReady:P,currentGitProvider:q,isConversationReady:Q})})]}):null]}),(0,b.jsx)(v.OpenRepositoryModal,{isOpen:w,onClose:()=>T(!1),onLaunch:se,defaultProvider:q})]}):null}exports.GitControlBar=x;
+require(`../../../_virtual/_rolldown/runtime.cjs`);const e=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),t=require(`../../../i18n/declaration.cjs`),n=require(`../../../hooks/use-conversation-id.cjs`),r=require(`../../../contexts/active-backend-context.cjs`),i=require(`../../../utils/custom-toast-handlers.cjs`),a=require(`../../../stores/optimistic-user-message-store.cjs`),o=require(`../../../api/conversation-metadata-store.cjs`),s=require(`../../../hooks/use-send-message.cjs`),c=require(`../../../hooks/query/use-active-conversation.cjs`),l=require(`../../../hooks/query/use-task-polling.cjs`),ee=require(`../../../hooks/use-unified-websocket-status.cjs`),te=require(`../../../hooks/mutation/use-create-conversation.cjs`),ne=require(`../../../hooks/use-user-providers.cjs`),re=require(`./git-control-bar-repo-button.cjs`),ie=require(`./git-control-bar-branch-button.cjs`),ae=require(`./git-control-bar-pull-button.cjs`),u=require(`./git-control-bar-push-button.cjs`),d=require(`./git-control-bar-pr-button.cjs`),f=require(`../../../hooks/query/use-local-git-info.cjs`),p=require(`../../../hooks/mutation/use-update-conversation-repository.cjs`),m=require(`./git-control-bar-tooltip-wrapper.cjs`),h=require(`../../../stores/home-store.cjs`),g=require(`./open-repository-modal.cjs`),_=require(`../../../context/scroll-context.cjs`);let v=require(`react`),y=require(`react/jsx-runtime`);function b({onSuggestionsClick:b}){let{t:x}=e.useTranslation(`openhands`),{conversationId:S}=n.useConversationId(),[oe,C]=(0,v.useState)(!1),[w,T]=(0,v.useState)(!1),E=(0,v.useRef)(null),{addRecentRepository:D}=h.useHomeStore(),O=a.useOptimisticUserMessageStore(e=>e.enqueuePendingMessage),k=a.useOptimisticUserMessageStore(e=>e.markPendingMessageError),{backend:A}=r.useActiveBackend(),j=A.kind===`local`,{providers:M}=ne.useUserProviders(),N=j||M.length>0,{data:P}=c.useActiveConversation(),{repositoryInfo:F}=l.useTaskPolling(),{data:I}=f.useLocalGitInfo(),L=ee.useUnifiedWebSocketStatus(),R=(0,v.useRef)(L);(0,v.useEffect)(()=>{R.current=L},[L]);let{send:z}=s.useSendMessage(),B=(0,v.useRef)(z);(0,v.useEffect)(()=>{B.current=z},[z]);let V=_.useOptionalScrollContext(),{mutate:H}=p.useUpdateConversationRepository(),{mutate:se,isPending:ce}=te.useCreateConversation(),U=P?.selected_repository||F?.selectedRepository,W=P?.git_provider||F?.gitProvider,G=P?.selected_branch||F?.selectedBranch,K=U||I?.repository||void 0,q=W||I?.provider,J=G||I?.branch||void 0,Y=(P?.id?o.getStoredConversationMetadata(P.id):null)?.selected_workspace??null,X=Y&&Y.replace(/\/+$/,``).split(`/`).pop()||null,Z=!!K&&!!q,Q=!!P&&L===`OPEN`;(0,v.useEffect)(()=>{if(!w)return;let e=e=>{E.current&&!E.current.contains(e.target)&&T(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[w]),(0,v.useEffect)(()=>{if(!w)return;let e=e=>{e.key===`Escape`&&T(!1)};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[w]);let le=(e,n)=>{S&&(D(e),H({conversationId:S,repository:e.full_name,branch:n.name,gitProvider:e.git_provider},{onSuccess:()=>{if(R.current!==`OPEN`){i.displayErrorToast(x(t.I18nKey.CONVERSATION$CLONE_COMMAND_FAILED_DISCONNECTED));return}let r=e.git_provider.charAt(0).toUpperCase()+e.git_provider.slice(1),a=`Clone ${e.full_name} from ${r} and checkout branch ${n.name}.`,o=S?O({conversationId:S,text:a}):null;V?.scrollDomToBottom(),Promise.resolve(B.current({action:`message`,args:{content:a,timestamp:new Date().toISOString()}})).catch(e=>{o&&k(o,e instanceof Error?e.message:`Failed to send message`)})}}))},$=!j||!!K||!!X,ue=j&&!Z;return $||J||Z?(0,y.jsxs)(`div`,{className:`flex flex-row items-center`,children:[(0,y.jsxs)(`div`,{className:`flex flex-row gap-2.5 items-center overflow-x-auto flex-nowrap relative scrollbar-hide`,children:[$?(0,y.jsx)(re.GitControlBarRepoButton,{selectedRepository:K,gitProvider:q,workspaceName:X,onClick:()=>C(!0),disabled:!Q||ue}):null,J?(0,y.jsx)(ie.GitControlBarBranchButton,{selectedBranch:J,selectedRepository:K,gitProvider:q}):null,Z?(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(m.GitControlBarTooltipWrapper,{tooltipMessage:x(t.I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT),testId:`git-control-bar-pull-button-tooltip`,shouldShowTooltip:!Z,children:(0,y.jsx)(ae.GitControlBarPullButton,{onSuggestionsClick:b,hasRepository:Z,providerTokensReady:N,isConversationReady:Q})}),(0,y.jsx)(m.GitControlBarTooltipWrapper,{tooltipMessage:x(t.I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT),testId:`git-control-bar-push-button-tooltip`,shouldShowTooltip:!Z,children:(0,y.jsx)(u.GitControlBarPushButton,{onSuggestionsClick:b,hasRepository:Z,providerTokensReady:N,currentGitProvider:q,isConversationReady:Q})}),(0,y.jsx)(m.GitControlBarTooltipWrapper,{tooltipMessage:x(t.I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT),testId:`git-control-bar-pr-button-tooltip`,shouldShowTooltip:!Z,children:(0,y.jsx)(d.GitControlBarPrButton,{onSuggestionsClick:b,hasRepository:Z,providerTokensReady:N,currentGitProvider:q,isConversationReady:Q})})]}):null]}),(0,y.jsx)(g.OpenRepositoryModal,{isOpen:oe,onClose:()=>C(!1),onLaunch:le,defaultProvider:q})]}):null}exports.GitControlBar=b;
 //# sourceMappingURL=git-control-bar.cjs.map

package/dist/components/features/chat/git-control-bar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"git-control-bar.cjs","names":[],"sources":["../../../../src/components/features/chat/git-control-bar.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { GitControlBarRepoButton } from \"./git-control-bar-repo-button\";\nimport { GitControlBarBranchButton } from \"./git-control-bar-branch-button\";\nimport { GitControlBarPullButton } from \"./git-control-bar-pull-button\";\nimport { GitControlBarPushButton } from \"./git-control-bar-push-button\";\nimport { GitControlBarPrButton } from \"./git-control-bar-pr-button\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useLocalGitInfo } from \"#/hooks/query/use-local-git-info\";\nimport { useTaskPolling } from \"#/hooks/query/use-task-polling\";\nimport { useUnifiedWebSocketStatus } from \"#/hooks/use-unified-websocket-status\";\nimport { useSendMessage } from \"#/hooks/use-send-message\";\nimport { useUpdateConversationRepository } from \"#/hooks/mutation/use-update-conversation-repository\";\nimport { useCreateConversation } from \"#/hooks/mutation/use-create-conversation\";\nimport { Provider } from \"#/types/settings\";\nimport { Branch, GitRepository } from \"#/types/git\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { GitControlBarTooltipWrapper } from \"./git-control-bar-tooltip-wrapper\";\nimport { OpenRepositoryModal } from \"./open-repository-modal\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\nimport { displayErrorToast } from \"#/utils/custom-toast-handlers\";\nimport { useHomeStore } from \"#/stores/home-store\";\nimport { useOptimisticUserMessageStore } from \"#/stores/optimistic-user-message-store\";\nimport { getStoredConversationMetadata } from \"#/api/conversation-metadata-store\";\nimport { useActiveBackend } from \"#/contexts/active-backend-context\";\nimport { useUserProviders } from \"#/hooks/use-user-providers\";\n\ninterface GitControlBarProps {\n  onSuggestionsClick: (value: string) => void;\n}\n\nexport function GitControlBar({ onSuggestionsClick }: GitControlBarProps) {\n  const { t } = useTranslation(\"openhands\");\n  const { conversationId } = useConversationId();\n  const [isOpenRepoModalOpen, setIsOpenRepoModalOpen] = useState(false);\n  const [isWorkspaceMenuOpen, setIsWorkspaceMenuOpen] = useState(false);\n  const workspaceMenuContainerRef = useRef<HTMLDivElement>(null);\n  const { addRecentRepository } = useHomeStore();\n  const enqueuePendingMessage = useOptimisticUserMessageStore(\n    (state) => state.enqueuePendingMessage,\n  );\n  const markPendingMessageError = useOptimisticUserMessageStore(\n    (state) => state.markPendingMessageError,\n  );\n  const { backend } = useActiveBackend();\n  const isLocalBackend = backend.kind === \"local\";\n  const { providers } = useUserProviders();\n  const providerTokensReady = isLocalBackend || providers.length > 0;\n\n  const { data: conversation } = useActiveConversation();\n  const { repositoryInfo } = useTaskPolling();\n  const { data: localGitInfo } = useLocalGitInfo();\n  const webSocketStatus = useUnifiedWebSocketStatus();\n  const webSocketStatusRef = useRef(webSocketStatus);\n  useEffect(() => {\n    webSocketStatusRef.current = webSocketStatus;\n  }, [webSocketStatus]);\n  const { send } = useSendMessage();\n  const sendRef = useRef(send);\n  useEffect(() => {\n    sendRef.current = send;\n  }, [send]);\n  const { mutate: updateRepository } = useUpdateConversationRepository();\n  const { mutate: _createConversation, isPending: _isCreatingConversation } =\n    useCreateConversation();\n\n  // Priority: conversation data > task data > locally-detected git info.\n  // The local fallback runs `git remote get-url origin` / `git rev-parse --abbrev-ref HEAD`\n  // in the conversation's working dir so local-workspace conversations can\n  // still display a repo and branch in the control bar.\n  const conversationRepository =\n    conversation?.selected_repository || repositoryInfo?.selectedRepository;\n  const conversationProvider = (conversation?.git_provider ||\n    repositoryInfo?.gitProvider) as Provider | undefined;\n  const conversationBranch =\n    conversation?.selected_branch || repositoryInfo?.selectedBranch;\n\n  const selectedRepository =\n    conversationRepository || localGitInfo?.repository || undefined;\n  const gitProvider = (conversationProvider ||\n    localGitInfo?.provider) as Provider;\n  const selectedBranch =\n    conversationBranch || localGitInfo?.branch || undefined;\n\n  // For folder-only conversations (no remote repo), surface the basename of\n  // the originally attached workspace path so the button reads e.g. \"test\"\n  // rather than \"No Repo Connected\". `selected_workspace` is recorded at\n  // conversation creation; we prefer it over `workspace.working_dir` because\n  // the latter may point at a worktree subdir.\n  const storedMetadata = conversation?.id\n    ? getStoredConversationMetadata(conversation.id)\n    : null;\n  const workspacePath = storedMetadata?.selected_workspace ?? null;\n  const workspaceName = workspacePath\n    ? workspacePath.replace(/\\/+$/, \"\").split(\"/\").pop() || null\n    : null;\n\n  // Enable git actions whenever a repository and provider are known, including\n  // local conversations where repo metadata is inferred from git remotes.\n  const hasRepository = !!selectedRepository && !!gitProvider;\n\n  // Enable buttons only when conversation exists and WS is connected\n  const isConversationReady = !!conversation && webSocketStatus === \"OPEN\";\n\n  useEffect(() => {\n    if (!isWorkspaceMenuOpen) return undefined;\n    const onMouseDown = (event: MouseEvent) => {\n      if (\n        workspaceMenuContainerRef.current &&\n        !workspaceMenuContainerRef.current.contains(event.target as Node)\n      ) {\n        setIsWorkspaceMenuOpen(false);\n      }\n    };\n    document.addEventListener(\"mousedown\", onMouseDown);\n    return () => document.removeEventListener(\"mousedown\", onMouseDown);\n  }, [isWorkspaceMenuOpen]);\n\n  useEffect(() => {\n    if (!isWorkspaceMenuOpen) return undefined;\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        setIsWorkspaceMenuOpen(false);\n      }\n    };\n    window.addEventListener(\"keydown\", onKeyDown);\n    return () => window.removeEventListener(\"keydown\", onKeyDown);\n  }, [isWorkspaceMenuOpen]);\n\n  const handleLaunchRepository = (\n    repository: GitRepository,\n    branch: Branch,\n  ) => {\n    if (!conversationId) return;\n\n    // Persist to recent repositories list (matches home page behavior)\n    addRecentRepository(repository);\n\n    // Note: We update repository metadata first, then send clone command.\n    // The clone command is sent to the agent via WebSocket (fire-and-forget).\n    // If cloning fails, the agent will report the error in the chat,\n    // and the user can retry or change the repository.\n    // This is a trade-off: immediate UI feedback vs. strict atomicity.\n    updateRepository(\n      {\n        conversationId,\n        repository: repository.full_name,\n        branch: branch.name,\n        gitProvider: repository.git_provider,\n      },\n      {\n        onSuccess: () => {\n          // Use ref to read the latest WebSocket status (avoids stale closure)\n          if (webSocketStatusRef.current !== \"OPEN\") {\n            displayErrorToast(\n              t(I18nKey.CONVERSATION$CLONE_COMMAND_FAILED_DISCONNECTED),\n            );\n            return;\n          }\n\n          // Send clone command to agent after metadata is updated\n          // Use ref to always call the latest send function (avoids stale closure\n          // where V1 sendMessage holds a reference to a now-closed WebSocket)\n          // Include git provider in prompt so agent clones from correct source\n          const providerName =\n            repository.git_provider.charAt(0).toUpperCase() +\n            repository.git_provider.slice(1);\n          const clonePrompt = `Clone ${repository.full_name} from ${providerName} and checkout branch ${branch.name}.`;\n          const pendingId = conversationId\n            ? enqueuePendingMessage({ conversationId, text: clonePrompt })\n            : null;\n          // `send` returns a Promise; surface a failed send by flipping the\n          // matching pending entry to \"error\" so the user gets the retry link\n          // rather than a perpetual \"Sending…\" bubble.\n          Promise.resolve(\n            sendRef.current({\n              action: \"message\",\n              args: {\n                content: clonePrompt,\n                timestamp: new Date().toISOString(),\n              },\n            }),\n          ).catch((error) => {\n            if (!pendingId) return;\n            const errorMessage =\n              error instanceof Error ? error.message : \"Failed to send message\";\n            markPendingMessageError(pendingId, errorMessage);\n          });\n        },\n      },\n    );\n  };\n\n  // Local backends never use the remote-repo \"Connect Repo\" CTA, so suppress the\n  // empty-state button there. A repo or workspace label inferred from local git\n  // metadata is still informational and stays visible.\n  const showRepoButton =\n    !isLocalBackend || !!selectedRepository || !!workspaceName;\n  // On a local backend the informational pill (e.g. workspace name, or a repo\n  // detected without a recognized provider) should not open the remote-repo\n  // modal — that flow is cloud-only. Disable the button in that case so the\n  // click is a no-op. Linkable repos render as <a> and ignore `disabled`.\n  const isRepoButtonInert = isLocalBackend && !hasRepository;\n\n  // True when the bar will render at least one chip (cloud always shows\n  // \"Open Repository\"; local needs a repo or a workspace name; selected\n  // branch or push/pull/PR also count). When false, the bar has nothing to\n  // show — return null so the wrapper above collapses to its natural padding\n  // instead of leaving an empty DOM node below the chat input.\n  const hasAnyContent = showRepoButton || !!selectedBranch || hasRepository;\n  if (!hasAnyContent) return null;\n\n  return (\n    <div className=\"flex flex-row items-center\">\n      <div className=\"flex flex-row gap-2.5 items-center overflow-x-auto flex-nowrap relative scrollbar-hide\">\n        {showRepoButton ? (\n          <GitControlBarRepoButton\n            selectedRepository={selectedRepository}\n            gitProvider={gitProvider}\n            workspaceName={workspaceName}\n            onClick={() => setIsOpenRepoModalOpen(true)}\n            disabled={!isConversationReady || isRepoButtonInert}\n          />\n        ) : null}\n\n        {selectedBranch ? (\n          <GitControlBarBranchButton\n            selectedBranch={selectedBranch}\n            selectedRepository={selectedRepository}\n            gitProvider={gitProvider}\n          />\n        ) : null}\n\n        {hasRepository ? (\n          <>\n            <GitControlBarTooltipWrapper\n              tooltipMessage={t(I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT)}\n              testId=\"git-control-bar-pull-button-tooltip\"\n              shouldShowTooltip={!hasRepository}\n            >\n              <GitControlBarPullButton\n                onSuggestionsClick={onSuggestionsClick}\n                hasRepository={hasRepository}\n                providerTokensReady={providerTokensReady}\n                isConversationReady={isConversationReady}\n              />\n            </GitControlBarTooltipWrapper>\n\n            <GitControlBarTooltipWrapper\n              tooltipMessage={t(I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT)}\n              testId=\"git-control-bar-push-button-tooltip\"\n              shouldShowTooltip={!hasRepository}\n            >\n              <GitControlBarPushButton\n                onSuggestionsClick={onSuggestionsClick}\n                hasRepository={hasRepository}\n                providerTokensReady={providerTokensReady}\n                currentGitProvider={gitProvider}\n                isConversationReady={isConversationReady}\n              />\n            </GitControlBarTooltipWrapper>\n\n            <GitControlBarTooltipWrapper\n              tooltipMessage={t(I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT)}\n              testId=\"git-control-bar-pr-button-tooltip\"\n              shouldShowTooltip={!hasRepository}\n            >\n              <GitControlBarPrButton\n                onSuggestionsClick={onSuggestionsClick}\n                hasRepository={hasRepository}\n                providerTokensReady={providerTokensReady}\n                currentGitProvider={gitProvider}\n                isConversationReady={isConversationReady}\n              />\n            </GitControlBarTooltipWrapper>\n          </>\n        ) : null}\n      </div>\n\n      <OpenRepositoryModal\n        isOpen={isOpenRepoModalOpen}\n        onClose={() => setIsOpenRepoModalOpen(false)}\n        onLaunch={handleLaunchRepository}\n        defaultProvider={gitProvider}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"git-control-bar.cjs","names":[],"sources":["../../../../src/components/features/chat/git-control-bar.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { GitControlBarRepoButton } from \"./git-control-bar-repo-button\";\nimport { GitControlBarBranchButton } from \"./git-control-bar-branch-button\";\nimport { GitControlBarPullButton } from \"./git-control-bar-pull-button\";\nimport { GitControlBarPushButton } from \"./git-control-bar-push-button\";\nimport { GitControlBarPrButton } from \"./git-control-bar-pr-button\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useLocalGitInfo } from \"#/hooks/query/use-local-git-info\";\nimport { useTaskPolling } from \"#/hooks/query/use-task-polling\";\nimport { useUnifiedWebSocketStatus } from \"#/hooks/use-unified-websocket-status\";\nimport { useSendMessage } from \"#/hooks/use-send-message\";\nimport { useUpdateConversationRepository } from \"#/hooks/mutation/use-update-conversation-repository\";\nimport { useCreateConversation } from \"#/hooks/mutation/use-create-conversation\";\nimport { Provider } from \"#/types/settings\";\nimport { Branch, GitRepository } from \"#/types/git\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { GitControlBarTooltipWrapper } from \"./git-control-bar-tooltip-wrapper\";\nimport { OpenRepositoryModal } from \"./open-repository-modal\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\nimport { displayErrorToast } from \"#/utils/custom-toast-handlers\";\nimport { useHomeStore } from \"#/stores/home-store\";\nimport { useOptimisticUserMessageStore } from \"#/stores/optimistic-user-message-store\";\nimport { getStoredConversationMetadata } from \"#/api/conversation-metadata-store\";\nimport { useActiveBackend } from \"#/contexts/active-backend-context\";\nimport { useUserProviders } from \"#/hooks/use-user-providers\";\nimport { useOptionalScrollContext } from \"#/context/scroll-context\";\n\ninterface GitControlBarProps {\n  onSuggestionsClick: (value: string) => void;\n}\n\nexport function GitControlBar({ onSuggestionsClick }: GitControlBarProps) {\n  const { t } = useTranslation(\"openhands\");\n  const { conversationId } = useConversationId();\n  const [isOpenRepoModalOpen, setIsOpenRepoModalOpen] = useState(false);\n  const [isWorkspaceMenuOpen, setIsWorkspaceMenuOpen] = useState(false);\n  const workspaceMenuContainerRef = useRef<HTMLDivElement>(null);\n  const { addRecentRepository } = useHomeStore();\n  const enqueuePendingMessage = useOptimisticUserMessageStore(\n    (state) => state.enqueuePendingMessage,\n  );\n  const markPendingMessageError = useOptimisticUserMessageStore(\n    (state) => state.markPendingMessageError,\n  );\n  const { backend } = useActiveBackend();\n  const isLocalBackend = backend.kind === \"local\";\n  const { providers } = useUserProviders();\n  const providerTokensReady = isLocalBackend || providers.length > 0;\n\n  const { data: conversation } = useActiveConversation();\n  const { repositoryInfo } = useTaskPolling();\n  const { data: localGitInfo } = useLocalGitInfo();\n  const webSocketStatus = useUnifiedWebSocketStatus();\n  const webSocketStatusRef = useRef(webSocketStatus);\n  useEffect(() => {\n    webSocketStatusRef.current = webSocketStatus;\n  }, [webSocketStatus]);\n  const { send } = useSendMessage();\n  const sendRef = useRef(send);\n  useEffect(() => {\n    sendRef.current = send;\n  }, [send]);\n  const scrollContext = useOptionalScrollContext();\n  const { mutate: updateRepository } = useUpdateConversationRepository();\n  const { mutate: _createConversation, isPending: _isCreatingConversation } =\n    useCreateConversation();\n\n  // Priority: conversation data > task data > locally-detected git info.\n  // The local fallback runs `git remote get-url origin` / `git rev-parse --abbrev-ref HEAD`\n  // in the conversation's working dir so local-workspace conversations can\n  // still display a repo and branch in the control bar.\n  const conversationRepository =\n    conversation?.selected_repository || repositoryInfo?.selectedRepository;\n  const conversationProvider = (conversation?.git_provider ||\n    repositoryInfo?.gitProvider) as Provider | undefined;\n  const conversationBranch =\n    conversation?.selected_branch || repositoryInfo?.selectedBranch;\n\n  const selectedRepository =\n    conversationRepository || localGitInfo?.repository || undefined;\n  const gitProvider = (conversationProvider ||\n    localGitInfo?.provider) as Provider;\n  const selectedBranch =\n    conversationBranch || localGitInfo?.branch || undefined;\n\n  // For folder-only conversations (no remote repo), surface the basename of\n  // the originally attached workspace path so the button reads e.g. \"test\"\n  // rather than \"No Repo Connected\". `selected_workspace` is recorded at\n  // conversation creation; we prefer it over `workspace.working_dir` because\n  // the latter may point at a worktree subdir.\n  const storedMetadata = conversation?.id\n    ? getStoredConversationMetadata(conversation.id)\n    : null;\n  const workspacePath = storedMetadata?.selected_workspace ?? null;\n  const workspaceName = workspacePath\n    ? workspacePath.replace(/\\/+$/, \"\").split(\"/\").pop() || null\n    : null;\n\n  // Enable git actions whenever a repository and provider are known, including\n  // local conversations where repo metadata is inferred from git remotes.\n  const hasRepository = !!selectedRepository && !!gitProvider;\n\n  // Enable buttons only when conversation exists and WS is connected\n  const isConversationReady = !!conversation && webSocketStatus === \"OPEN\";\n\n  useEffect(() => {\n    if (!isWorkspaceMenuOpen) return undefined;\n    const onMouseDown = (event: MouseEvent) => {\n      if (\n        workspaceMenuContainerRef.current &&\n        !workspaceMenuContainerRef.current.contains(event.target as Node)\n      ) {\n        setIsWorkspaceMenuOpen(false);\n      }\n    };\n    document.addEventListener(\"mousedown\", onMouseDown);\n    return () => document.removeEventListener(\"mousedown\", onMouseDown);\n  }, [isWorkspaceMenuOpen]);\n\n  useEffect(() => {\n    if (!isWorkspaceMenuOpen) return undefined;\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        setIsWorkspaceMenuOpen(false);\n      }\n    };\n    window.addEventListener(\"keydown\", onKeyDown);\n    return () => window.removeEventListener(\"keydown\", onKeyDown);\n  }, [isWorkspaceMenuOpen]);\n\n  const handleLaunchRepository = (\n    repository: GitRepository,\n    branch: Branch,\n  ) => {\n    if (!conversationId) return;\n\n    // Persist to recent repositories list (matches home page behavior)\n    addRecentRepository(repository);\n\n    // Note: We update repository metadata first, then send clone command.\n    // The clone command is sent to the agent via WebSocket (fire-and-forget).\n    // If cloning fails, the agent will report the error in the chat,\n    // and the user can retry or change the repository.\n    // This is a trade-off: immediate UI feedback vs. strict atomicity.\n    updateRepository(\n      {\n        conversationId,\n        repository: repository.full_name,\n        branch: branch.name,\n        gitProvider: repository.git_provider,\n      },\n      {\n        onSuccess: () => {\n          // Use ref to read the latest WebSocket status (avoids stale closure)\n          if (webSocketStatusRef.current !== \"OPEN\") {\n            displayErrorToast(\n              t(I18nKey.CONVERSATION$CLONE_COMMAND_FAILED_DISCONNECTED),\n            );\n            return;\n          }\n\n          // Send clone command to agent after metadata is updated\n          // Use ref to always call the latest send function (avoids stale closure\n          // where V1 sendMessage holds a reference to a now-closed WebSocket)\n          // Include git provider in prompt so agent clones from correct source\n          const providerName =\n            repository.git_provider.charAt(0).toUpperCase() +\n            repository.git_provider.slice(1);\n          const clonePrompt = `Clone ${repository.full_name} from ${providerName} and checkout branch ${branch.name}.`;\n          const pendingId = conversationId\n            ? enqueuePendingMessage({ conversationId, text: clonePrompt })\n            : null;\n          // Pull chat back to the bottom so the optimistic \"Clone …\" bubble\n          // is visible even if the user had scrolled up.\n          scrollContext?.scrollDomToBottom();\n          // `send` returns a Promise; surface a failed send by flipping the\n          // matching pending entry to \"error\" so the user gets the retry link\n          // rather than a perpetual \"Sending…\" bubble.\n          Promise.resolve(\n            sendRef.current({\n              action: \"message\",\n              args: {\n                content: clonePrompt,\n                timestamp: new Date().toISOString(),\n              },\n            }),\n          ).catch((error) => {\n            if (!pendingId) return;\n            const errorMessage =\n              error instanceof Error ? error.message : \"Failed to send message\";\n            markPendingMessageError(pendingId, errorMessage);\n          });\n        },\n      },\n    );\n  };\n\n  // Local backends never use the remote-repo \"Connect Repo\" CTA, so suppress the\n  // empty-state button there. A repo or workspace label inferred from local git\n  // metadata is still informational and stays visible.\n  const showRepoButton =\n    !isLocalBackend || !!selectedRepository || !!workspaceName;\n  // On a local backend the informational pill (e.g. workspace name, or a repo\n  // detected without a recognized provider) should not open the remote-repo\n  // modal — that flow is cloud-only. Disable the button in that case so the\n  // click is a no-op. Linkable repos render as <a> and ignore `disabled`.\n  const isRepoButtonInert = isLocalBackend && !hasRepository;\n\n  // True when the bar will render at least one chip (cloud always shows\n  // \"Open Repository\"; local needs a repo or a workspace name; selected\n  // branch or push/pull/PR also count). When false, the bar has nothing to\n  // show — return null so the wrapper above collapses to its natural padding\n  // instead of leaving an empty DOM node below the chat input.\n  const hasAnyContent = showRepoButton || !!selectedBranch || hasRepository;\n  if (!hasAnyContent) return null;\n\n  return (\n    <div className=\"flex flex-row items-center\">\n      <div className=\"flex flex-row gap-2.5 items-center overflow-x-auto flex-nowrap relative scrollbar-hide\">\n        {showRepoButton ? (\n          <GitControlBarRepoButton\n            selectedRepository={selectedRepository}\n            gitProvider={gitProvider}\n            workspaceName={workspaceName}\n            onClick={() => setIsOpenRepoModalOpen(true)}\n            disabled={!isConversationReady || isRepoButtonInert}\n          />\n        ) : null}\n\n        {selectedBranch ? (\n          <GitControlBarBranchButton\n            selectedBranch={selectedBranch}\n            selectedRepository={selectedRepository}\n            gitProvider={gitProvider}\n          />\n        ) : null}\n\n        {hasRepository ? (\n          <>\n            <GitControlBarTooltipWrapper\n              tooltipMessage={t(I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT)}\n              testId=\"git-control-bar-pull-button-tooltip\"\n              shouldShowTooltip={!hasRepository}\n            >\n              <GitControlBarPullButton\n                onSuggestionsClick={onSuggestionsClick}\n                hasRepository={hasRepository}\n                providerTokensReady={providerTokensReady}\n                isConversationReady={isConversationReady}\n              />\n            </GitControlBarTooltipWrapper>\n\n            <GitControlBarTooltipWrapper\n              tooltipMessage={t(I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT)}\n              testId=\"git-control-bar-push-button-tooltip\"\n              shouldShowTooltip={!hasRepository}\n            >\n              <GitControlBarPushButton\n                onSuggestionsClick={onSuggestionsClick}\n                hasRepository={hasRepository}\n                providerTokensReady={providerTokensReady}\n                currentGitProvider={gitProvider}\n                isConversationReady={isConversationReady}\n              />\n            </GitControlBarTooltipWrapper>\n\n            <GitControlBarTooltipWrapper\n              tooltipMessage={t(I18nKey.COMMON$GIT_TOOLS_DISABLED_CONTENT)}\n              testId=\"git-control-bar-pr-button-tooltip\"\n              shouldShowTooltip={!hasRepository}\n            >\n              <GitControlBarPrButton\n                onSuggestionsClick={onSuggestionsClick}\n                hasRepository={hasRepository}\n                providerTokensReady={providerTokensReady}\n                currentGitProvider={gitProvider}\n                isConversationReady={isConversationReady}\n              />\n            </GitControlBarTooltipWrapper>\n          </>\n        ) : null}\n      </div>\n\n      <OpenRepositoryModal\n        isOpen={isOpenRepoModalOpen}\n        onClose={() => setIsOpenRepoModalOpen(false)}\n        onLaunch={handleLaunchRepository}\n        defaultProvider={gitProvider}\n      />\n    </div>\n  );\n}\n"],"mappings":"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"}