@openhands/agent-canvas 1.1.0 → 1.2.0

package/dist/components/features/chat/tool-visualizers/primitives/output-pane.js

@@ -1,27 +1,27 @@
 import { useTranslation as e } from "../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
 import { I18nKey as t } from "../../../../../i18n/declaration.js";
-import { CopyableContentWrapper as n } from "../../../../shared/buttons/copyable-content-wrapper.js";
-import { MAX_CONTENT_LENGTH as r } from "../../../../conversation-events/chat/event-content-helpers/shared.js";
+import { CodeBlock as n } from "./code-block.js";
 import "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/features/chat/tool-visualizers/primitives/output-pane.tsx
-function o({ output: o, exitCode: s, copy: c = !0 }) {
-	let { t: l } = e("openhands"), u = (o.length > 1e3 ? `${o.slice(0, r)}…` : o).trim(), d = s != null && s !== 0 && s !== -1, f = /* @__PURE__ */ i("pre", {
-		className: "overflow-auto whitespace-pre-wrap rounded border border-surface-raised bg-surface-raised p-2 text-xs text-foreground",
-		children: u || l(t.OBSERVATION$COMMAND_NO_OUTPUT)
-	});
-	return /* @__PURE__ */ a("div", {
+function a({ output: a, exitCode: o, copy: s = !0 }) {
+	let { t: c } = e("openhands");
+	return /* @__PURE__ */ i("div", {
 		className: "flex flex-col gap-1",
-		children: [d && /* @__PURE__ */ i("span", {
+		children: [o != null && o !== 0 && o !== -1 && /* @__PURE__ */ r("span", {
 			className: "self-start rounded bg-status-fail-bg px-1.5 py-0.5 font-mono text-xs text-status-fail-text",
-			children: l(t.OBSERVATION$EXIT_CODE, { code: s })
-		}), c && u ? /* @__PURE__ */ i(n, {
-			text: o,
-			children: f
-		}) : f]
+			children: c(t.OBSERVATION$EXIT_CODE, { code: o })
+		}), /* @__PURE__ */ r(n, {
+			code: a,
+			language: "bash",
+			copy: s,
+			placeholder: c(t.OBSERVATION$COMMAND_NO_OUTPUT),
+			expandable: !0,
+			wrapLongLines: !0
+		})]
 	});
 }
 //#endregion
-export { o as OutputPane };
+export { a as OutputPane };
 
 //# sourceMappingURL=output-pane.js.map

package/dist/components/features/chat/tool-visualizers/primitives/output-pane.js.map

@@ -1 +1 @@
-{"version":3,"file":"output-pane.js","names":[],"sources":["../../../../../../src/components/features/chat/tool-visualizers/primitives/output-pane.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { CopyableContentWrapper } from \"#/components/shared/buttons/copyable-content-wrapper\";\nimport { MAX_CONTENT_LENGTH } from \"#/components/conversation-events/chat/event-content-helpers/shared\";\n\ninterface OutputPaneProps {\n  output: string;\n  /** Process exit code, when known. `0` and `-1` (timeout) are not badged —\n   *  the card's success indicator already conveys those. */\n  exitCode?: number | null;\n  /** Show a hover copy button that yields the full, untruncated output.\n   *  Defaults to true; suppressed automatically when there is no output. */\n  copy?: boolean;\n}\n\n/**\n * Monospace output block for command results, with a failure exit-code badge\n * and an optional hover copy button. Long content is truncated in the display\n * to the same limit the markdown path uses; the copy button always yields the\n * full, untruncated output.\n */\nexport function OutputPane({ output, exitCode, copy = true }: OutputPaneProps) {\n  const { t } = useTranslation(\"openhands\");\n  const display =\n    output.length > MAX_CONTENT_LENGTH\n      ? `${output.slice(0, MAX_CONTENT_LENGTH)}…`\n      : output;\n  const text = display.trim();\n  const showExitBadge = exitCode != null && exitCode !== 0 && exitCode !== -1;\n\n  const pane = (\n    <pre className=\"overflow-auto whitespace-pre-wrap rounded border border-surface-raised bg-surface-raised p-2 text-xs text-foreground\">\n      {text || t(I18nKey.OBSERVATION$COMMAND_NO_OUTPUT)}\n    </pre>\n  );\n\n  return (\n    <div className=\"flex flex-col gap-1\">\n      {showExitBadge && (\n        <span className=\"self-start rounded bg-status-fail-bg px-1.5 py-0.5 font-mono text-xs text-status-fail-text\">\n          {t(I18nKey.OBSERVATION$EXIT_CODE, { code: exitCode })}\n        </span>\n      )}\n      {copy && text ? (\n        <CopyableContentWrapper text={output}>{pane}</CopyableContentWrapper>\n      ) : (\n        pane\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAsBA,SAAgB,EAAW,EAAE,WAAQ,aAAU,UAAO,MAAyB;CAC7E,IAAM,EAAE,SAAM,EAAe,YAAY,EAKnC,KAHJ,EAAO,SAAA,MACH,GAAG,EAAO,MAAM,GAAG,EAAmB,CAAC,KACvC,GACe,MAAM,EACrB,IAAgB,KAAY,QAAQ,MAAa,KAAK,MAAa,IAEnE,IACJ,kBAAC,OAAD;EAAK,WAAU;YACZ,KAAQ,EAAE,EAAQ,8BAA8B;EAC7C,CAAA;AAGR,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACG,KACC,kBAAC,QAAD;GAAM,WAAU;aACb,EAAE,EAAQ,uBAAuB,EAAE,MAAM,GAAU,CAAC;GAChD,CAAA,EAER,KAAQ,IACP,kBAAC,GAAD;GAAwB,MAAM;aAAS;GAA8B,CAAA,GAErE,EAEE"}
+{"version":3,"file":"output-pane.js","names":[],"sources":["../../../../../../src/components/features/chat/tool-visualizers/primitives/output-pane.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { CodeBlock } from \"./code-block\";\n\ninterface OutputPaneProps {\n  output: string;\n  /** Process exit code, when known. `0` and `-1` (timeout) are not badged —\n   *  the card's success indicator already conveys those. */\n  exitCode?: number | null;\n  /** Show a hover copy button that yields the full, untruncated output.\n   *  Defaults to true; suppressed automatically when there is no output. */\n  copy?: boolean;\n}\n\n/**\n * Monospace output block for command results, with a failure exit-code badge\n * and an optional hover copy button. Long content is truncated in the display\n * to the same limit the markdown path uses, with an inline control to reveal\n * the full output. The copy button always yields the untruncated output.\n */\nexport function OutputPane({ output, exitCode, copy = true }: OutputPaneProps) {\n  const { t } = useTranslation(\"openhands\");\n  const showExitBadge = exitCode != null && exitCode !== 0 && exitCode !== -1;\n\n  return (\n    <div className=\"flex flex-col gap-1\">\n      {showExitBadge && (\n        <span className=\"self-start rounded bg-status-fail-bg px-1.5 py-0.5 font-mono text-xs text-status-fail-text\">\n          {t(I18nKey.OBSERVATION$EXIT_CODE, { code: exitCode })}\n        </span>\n      )}\n      <CodeBlock\n        code={output}\n        language=\"bash\"\n        copy={copy}\n        placeholder={t(I18nKey.OBSERVATION$COMMAND_NO_OUTPUT)}\n        expandable\n        wrapLongLines\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAqBA,SAAgB,EAAW,EAAE,WAAQ,aAAU,UAAO,MAAyB;CAC7E,IAAM,EAAE,SAAM,EAAe,YAAY;AAGzC,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CAHoB,KAAY,QAAQ,MAAa,KAAK,MAAa,MAKnE,kBAAC,QAAD;GAAM,WAAU;aACb,EAAE,EAAQ,uBAAuB,EAAE,MAAM,GAAU,CAAC;GAChD,CAAA,EAET,kBAAC,GAAD;GACE,MAAM;GACN,UAAS;GACH;GACN,aAAa,EAAE,EAAQ,8BAA8B;GACrD,YAAA;GACA,eAAA;GACA,CAAA,CACE"}

package/dist/components/features/chat/user-message-body.cjs

@@ -1,2 +1,2 @@
-const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../utils/utils.cjs`),i=require(`../markdown/markdown-renderer.cjs`);let a=require(`react`);a=e.__toESM(a,1);let o=require(`react/jsx-runtime`);var s=3,c={p:({children:e})=>(0,o.jsx)(`p`,{className:`m-0 leading-6`,children:e})};function l({message:e,isHovering:l,isExpanded:u,onTruncatableChange:d}){let{t:f}=t.useTranslation(`openhands`),p=a.default.useRef(null),[m,h]=a.default.useState(!1);a.default.useEffect(()=>{d(m)},[m,d]),a.default.useLayoutEffect(()=>{let t=p.current;if(!t||u){h(!1);return}let n=()=>{let n=Number.parseFloat(getComputedStyle(t).lineHeight),r=s*(Number.isFinite(n)&&n>0?n:24),i=(e.match(/\n/g)??[]).length;h(t.scrollHeight>r+1||i>=s||e.trim().length>220)};n();let r=new ResizeObserver(n);return r.observe(t),()=>r.disconnect()},[e,u]);let g=m&&!u;return(0,o.jsxs)(`div`,{className:`relative min-w-0`,children:[(0,o.jsx)(`div`,{ref:p,className:r.cn(`text-sm leading-6 whitespace-normal [word-break:break-word]`,g&&`line-clamp-3`),children:(0,o.jsx)(i.MarkdownRenderer,{includeStandard:!0,includeHeadings:!0,allowHtml:!1,components:c,children:e})}),g?(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(`div`,{"aria-hidden":!0,"data-testid":`chat-message-truncation-gradient`,className:`pointer-events-none absolute inset-x-0 bottom-0 h-10 bg-gradient-to-t from-tertiary to-transparent`}),(0,o.jsx)(`span`,{"data-testid":`chat-message-view-more`,className:r.cn(`pointer-events-none absolute bottom-1 left-1/2 z-10 inline-flex -translate-x-1/2 items-center rounded-full border border-[var(--oh-border-subtle)] bg-[var(--oh-surface-raised)] px-2.5 py-0.5 text-xs font-normal text-[var(--oh-foreground)] transition-opacity duration-150`,l?`opacity-100`:`opacity-0`),children:f(n.I18nKey.COMMON$VIEW_MORE)})]}):null]})}exports.UserMessageBody=l,exports.chatBubbleMarkdownComponents=c;
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../utils/utils.cjs`),i=require(`../markdown/markdown-renderer.cjs`);let a=require(`react`);a=e.__toESM(a,1);let o=require(`react/jsx-runtime`);var s=5,c=360,l={p:({children:e})=>(0,o.jsx)(`p`,{className:`m-0 leading-6`,children:e})};function u({message:e,isHovering:u,isExpanded:d,onTruncatableChange:f}){let{t:p}=t.useTranslation(`openhands`),m=a.default.useRef(null),[h,g]=a.default.useState(!1);a.default.useEffect(()=>{f(h)},[h,f]),a.default.useLayoutEffect(()=>{let t=m.current;if(!t||d){g(!1);return}let n=()=>{let n=Number.parseFloat(getComputedStyle(t).lineHeight),r=s*(Number.isFinite(n)&&n>0?n:24),i=(e.match(/\n/g)??[]).length;g(t.scrollHeight>r+1||i>=s||e.trim().length>c)};n();let r=new ResizeObserver(n);return r.observe(t),()=>r.disconnect()},[e,d]);let _=h&&!d;return(0,o.jsxs)(`div`,{className:`relative min-w-0`,children:[(0,o.jsx)(`div`,{ref:m,className:r.cn(`text-sm leading-6 whitespace-normal [word-break:break-word]`,_&&`line-clamp-5`),children:(0,o.jsx)(i.MarkdownRenderer,{includeStandard:!0,includeHeadings:!0,allowHtml:!1,components:l,children:e})}),_?(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(`div`,{"aria-hidden":!0,"data-testid":`chat-message-truncation-gradient`,className:`pointer-events-none absolute inset-x-0 bottom-0 h-10 bg-gradient-to-t from-tertiary to-transparent`}),(0,o.jsx)(`span`,{"data-testid":`chat-message-view-more`,className:r.cn(`pointer-events-none absolute bottom-1 left-1/2 z-10 inline-flex -translate-x-1/2 items-center rounded-full border border-[var(--oh-border-subtle)] bg-[var(--oh-surface-raised)] px-2.5 py-0.5 text-xs font-normal text-[var(--oh-foreground)] transition-opacity duration-150`,u?`opacity-100`:`opacity-0`),children:p(n.I18nKey.COMMON$VIEW_MORE)})]}):null]})}exports.UserMessageBody=u,exports.chatBubbleMarkdownComponents=l;
 //# sourceMappingURL=user-message-body.cjs.map

package/dist/components/features/chat/user-message-body.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"user-message-body.cjs","names":[],"sources":["../../../../src/components/features/chat/user-message-body.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"#/utils/utils\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { MarkdownRenderer } from \"../markdown/markdown-renderer\";\n\nconst USER_MESSAGE_MAX_LINES = 3;\nexport const USER_MESSAGE_LINE_HEIGHT_PX = 24;\n\nexport const chatBubbleMarkdownComponents = {\n  p: ({ children }: React.ComponentProps<\"p\">) => (\n    <p className=\"m-0 leading-6\">{children}</p>\n  ),\n};\n\nexport function UserMessageBody({\n  message,\n  isHovering,\n  isExpanded,\n  onTruncatableChange,\n}: {\n  message: string;\n  isHovering: boolean;\n  isExpanded: boolean;\n  onTruncatableChange: (truncatable: boolean) => void;\n}) {\n  const { t } = useTranslation(\"openhands\");\n  const contentRef = React.useRef<HTMLDivElement>(null);\n  const [isTruncatable, setIsTruncatable] = React.useState(false);\n\n  React.useEffect(() => {\n    onTruncatableChange(isTruncatable);\n  }, [isTruncatable, onTruncatableChange]);\n\n  React.useLayoutEffect(() => {\n    const content = contentRef.current;\n    if (!content || isExpanded) {\n      setIsTruncatable(false);\n      return undefined;\n    }\n\n    const measure = () => {\n      const lineHeight = Number.parseFloat(\n        getComputedStyle(content).lineHeight,\n      );\n      const linePx =\n        Number.isFinite(lineHeight) && lineHeight > 0\n          ? lineHeight\n          : USER_MESSAGE_LINE_HEIGHT_PX;\n      const maxHeight = USER_MESSAGE_MAX_LINES * linePx;\n      const newlineCount = (message.match(/\\n/g) ?? []).length;\n\n      const truncatable =\n        content.scrollHeight > maxHeight + 1 ||\n        newlineCount >= USER_MESSAGE_MAX_LINES ||\n        message.trim().length > 220;\n\n      setIsTruncatable(truncatable);\n    };\n\n    measure();\n\n    const observer = new ResizeObserver(measure);\n    observer.observe(content);\n\n    return () => observer.disconnect();\n  }, [message, isExpanded]);\n\n  const isCollapsed = isTruncatable && !isExpanded;\n\n  return (\n    <div className=\"relative min-w-0\">\n      <div\n        ref={contentRef}\n        className={cn(\n          \"text-sm leading-6 whitespace-normal [word-break:break-word]\",\n          isCollapsed && \"line-clamp-3\",\n        )}\n      >\n        <MarkdownRenderer\n          includeStandard\n          includeHeadings\n          allowHtml={false}\n          components={chatBubbleMarkdownComponents}\n        >\n          {message}\n        </MarkdownRenderer>\n      </div>\n\n      {isCollapsed ? (\n        <>\n          <div\n            aria-hidden\n            data-testid=\"chat-message-truncation-gradient\"\n            className=\"pointer-events-none absolute inset-x-0 bottom-0 h-10 bg-gradient-to-t from-tertiary to-transparent\"\n          />\n          <span\n            data-testid=\"chat-message-view-more\"\n            className={cn(\n              \"pointer-events-none absolute bottom-1 left-1/2 z-10 inline-flex -translate-x-1/2 items-center rounded-full border border-[var(--oh-border-subtle)] bg-[var(--oh-surface-raised)] px-2.5 py-0.5 text-xs font-normal text-[var(--oh-foreground)] transition-opacity duration-150\",\n              isHovering ? \"opacity-100\" : \"opacity-0\",\n            )}\n          >\n            {t(I18nKey.COMMON$VIEW_MORE)}\n          </span>\n        </>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"kVAMA,IAAM,EAAyB,EAGlB,EAA+B,CAC1C,GAAI,CAAE,eACJ,EAAA,EAAA,KAAC,IAAD,CAAG,UAAU,gBAAiB,WAAa,CAAA,CAE9C,CAED,SAAgB,EAAgB,CAC9B,UACA,aACA,aACA,uBAMC,CACD,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,EAAa,EAAA,QAAM,OAAuB,KAAK,CAC/C,CAAC,EAAe,GAAoB,EAAA,QAAM,SAAS,GAAM,CAE/D,EAAA,QAAM,cAAgB,CACpB,EAAoB,EAAc,EACjC,CAAC,EAAe,EAAoB,CAAC,CAExC,EAAA,QAAM,oBAAsB,CAC1B,IAAM,EAAU,EAAW,QAC3B,GAAI,CAAC,GAAW,EAAY,CAC1B,EAAiB,GAAM,CACvB,OAGF,IAAM,MAAgB,CACpB,IAAM,EAAa,OAAO,WACxB,iBAAiB,EAAQ,CAAC,WAC3B,CAKK,EAAY,GAHhB,OAAO,SAAS,EAAW,EAAI,EAAa,EACxC,EAAA,IAGA,GAAgB,EAAQ,MAAM,MAAM,EAAI,EAAE,EAAE,OAOlD,EAJE,EAAQ,aAAe,EAAY,GACnC,GAAgB,GAChB,EAAQ,MAAM,CAAC,OAAS,IAEG,EAG/B,GAAS,CAET,IAAM,EAAW,IAAI,eAAe,EAAQ,CAG5C,OAFA,EAAS,QAAQ,EAAQ,KAEZ,EAAS,YAAY,EACjC,CAAC,EAAS,EAAW,CAAC,CAEzB,IAAM,EAAc,GAAiB,CAAC,EAEtC,OACE,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,4BAAf,EACE,EAAA,EAAA,KAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAA,GACT,8DACA,GAAe,eAChB,WAED,EAAA,EAAA,KAAC,EAAA,iBAAD,CACE,gBAAA,GACA,gBAAA,GACA,UAAW,GACX,WAAY,WAEX,EACgB,CAAA,CACf,CAAA,CAEL,GACC,EAAA,EAAA,MAAA,EAAA,SAAA,CAAA,SAAA,EACE,EAAA,EAAA,KAAC,MAAD,CACE,cAAA,GACA,cAAY,mCACZ,UAAU,qGACV,CAAA,EACF,EAAA,EAAA,KAAC,OAAD,CACE,cAAY,yBACZ,UAAW,EAAA,GACT,iRACA,EAAa,cAAgB,YAC9B,UAEA,EAAE,EAAA,QAAQ,iBAAiB,CACvB,CAAA,CACN,CAAA,CAAA,CACD,KACA"}
+{"version":3,"file":"user-message-body.cjs","names":[],"sources":["../../../../src/components/features/chat/user-message-body.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"#/utils/utils\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { MarkdownRenderer } from \"../markdown/markdown-renderer\";\n\nconst USER_MESSAGE_MAX_LINES = 5;\nconst USER_MESSAGE_LENGTH_THRESHOLD = 360;\nexport const USER_MESSAGE_LINE_HEIGHT_PX = 24;\n\nexport const chatBubbleMarkdownComponents = {\n  p: ({ children }: React.ComponentProps<\"p\">) => (\n    <p className=\"m-0 leading-6\">{children}</p>\n  ),\n};\n\nexport function UserMessageBody({\n  message,\n  isHovering,\n  isExpanded,\n  onTruncatableChange,\n}: {\n  message: string;\n  isHovering: boolean;\n  isExpanded: boolean;\n  onTruncatableChange: (truncatable: boolean) => void;\n}) {\n  const { t } = useTranslation(\"openhands\");\n  const contentRef = React.useRef<HTMLDivElement>(null);\n  const [isTruncatable, setIsTruncatable] = React.useState(false);\n\n  React.useEffect(() => {\n    onTruncatableChange(isTruncatable);\n  }, [isTruncatable, onTruncatableChange]);\n\n  React.useLayoutEffect(() => {\n    const content = contentRef.current;\n    if (!content || isExpanded) {\n      setIsTruncatable(false);\n      return undefined;\n    }\n\n    const measure = () => {\n      const lineHeight = Number.parseFloat(\n        getComputedStyle(content).lineHeight,\n      );\n      const linePx =\n        Number.isFinite(lineHeight) && lineHeight > 0\n          ? lineHeight\n          : USER_MESSAGE_LINE_HEIGHT_PX;\n      const maxHeight = USER_MESSAGE_MAX_LINES * linePx;\n      const newlineCount = (message.match(/\\n/g) ?? []).length;\n\n      const truncatable =\n        content.scrollHeight > maxHeight + 1 ||\n        newlineCount >= USER_MESSAGE_MAX_LINES ||\n        message.trim().length > USER_MESSAGE_LENGTH_THRESHOLD;\n\n      setIsTruncatable(truncatable);\n    };\n\n    measure();\n\n    const observer = new ResizeObserver(measure);\n    observer.observe(content);\n\n    return () => observer.disconnect();\n  }, [message, isExpanded]);\n\n  const isCollapsed = isTruncatable && !isExpanded;\n\n  return (\n    <div className=\"relative min-w-0\">\n      <div\n        ref={contentRef}\n        className={cn(\n          \"text-sm leading-6 whitespace-normal [word-break:break-word]\",\n          isCollapsed && \"line-clamp-5\",\n        )}\n      >\n        <MarkdownRenderer\n          includeStandard\n          includeHeadings\n          allowHtml={false}\n          components={chatBubbleMarkdownComponents}\n        >\n          {message}\n        </MarkdownRenderer>\n      </div>\n\n      {isCollapsed ? (\n        <>\n          <div\n            aria-hidden\n            data-testid=\"chat-message-truncation-gradient\"\n            className=\"pointer-events-none absolute inset-x-0 bottom-0 h-10 bg-gradient-to-t from-tertiary to-transparent\"\n          />\n          <span\n            data-testid=\"chat-message-view-more\"\n            className={cn(\n              \"pointer-events-none absolute bottom-1 left-1/2 z-10 inline-flex -translate-x-1/2 items-center rounded-full border border-[var(--oh-border-subtle)] bg-[var(--oh-surface-raised)] px-2.5 py-0.5 text-xs font-normal text-[var(--oh-foreground)] transition-opacity duration-150\",\n              isHovering ? \"opacity-100\" : \"opacity-0\",\n            )}\n          >\n            {t(I18nKey.COMMON$VIEW_MORE)}\n          </span>\n        </>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"kVAMA,IAAM,EAAyB,EACzB,EAAgC,IAGzB,EAA+B,CAC1C,GAAI,CAAE,eACJ,EAAA,EAAA,KAAC,IAAD,CAAG,UAAU,gBAAiB,WAAa,CAAA,CAE9C,CAED,SAAgB,EAAgB,CAC9B,UACA,aACA,aACA,uBAMC,CACD,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,EAAa,EAAA,QAAM,OAAuB,KAAK,CAC/C,CAAC,EAAe,GAAoB,EAAA,QAAM,SAAS,GAAM,CAE/D,EAAA,QAAM,cAAgB,CACpB,EAAoB,EAAc,EACjC,CAAC,EAAe,EAAoB,CAAC,CAExC,EAAA,QAAM,oBAAsB,CAC1B,IAAM,EAAU,EAAW,QAC3B,GAAI,CAAC,GAAW,EAAY,CAC1B,EAAiB,GAAM,CACvB,OAGF,IAAM,MAAgB,CACpB,IAAM,EAAa,OAAO,WACxB,iBAAiB,EAAQ,CAAC,WAC3B,CAKK,EAAY,GAHhB,OAAO,SAAS,EAAW,EAAI,EAAa,EACxC,EAAA,IAGA,GAAgB,EAAQ,MAAM,MAAM,EAAI,EAAE,EAAE,OAOlD,EAJE,EAAQ,aAAe,EAAY,GACnC,GAAgB,GAChB,EAAQ,MAAM,CAAC,OAAS,EAEG,EAG/B,GAAS,CAET,IAAM,EAAW,IAAI,eAAe,EAAQ,CAG5C,OAFA,EAAS,QAAQ,EAAQ,KAEZ,EAAS,YAAY,EACjC,CAAC,EAAS,EAAW,CAAC,CAEzB,IAAM,EAAc,GAAiB,CAAC,EAEtC,OACE,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,4BAAf,EACE,EAAA,EAAA,KAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAA,GACT,8DACA,GAAe,eAChB,WAED,EAAA,EAAA,KAAC,EAAA,iBAAD,CACE,gBAAA,GACA,gBAAA,GACA,UAAW,GACX,WAAY,WAEX,EACgB,CAAA,CACf,CAAA,CAEL,GACC,EAAA,EAAA,MAAA,EAAA,SAAA,CAAA,SAAA,EACE,EAAA,EAAA,KAAC,MAAD,CACE,cAAA,GACA,cAAY,mCACZ,UAAU,qGACV,CAAA,EACF,EAAA,EAAA,KAAC,OAAD,CACE,cAAY,yBACZ,UAAW,EAAA,GACT,iRACA,EAAa,cAAgB,YAC9B,UAEA,EAAE,EAAA,QAAQ,iBAAiB,CACvB,CAAA,CACN,CAAA,CAAA,CACD,KACA"}

package/dist/components/features/chat/user-message-body.js

@@ -5,53 +5,53 @@ import { MarkdownRenderer as r } from "../markdown/markdown-renderer.js";
 import i from "react";
 import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/components/features/chat/user-message-body.tsx
-var c = 3, l = { p: ({ children: e }) => /* @__PURE__ */ o("p", {
+var c = 5, l = 360, u = { p: ({ children: e }) => /* @__PURE__ */ o("p", {
 	className: "m-0 leading-6",
 	children: e
 }) };
-function u({ message: u, isHovering: d, isExpanded: f, onTruncatableChange: p }) {
-	let { t: m } = e("openhands"), h = i.useRef(null), [g, _] = i.useState(!1);
+function d({ message: d, isHovering: f, isExpanded: p, onTruncatableChange: m }) {
+	let { t: h } = e("openhands"), g = i.useRef(null), [_, v] = i.useState(!1);
 	i.useEffect(() => {
-		p(g);
-	}, [g, p]), i.useLayoutEffect(() => {
-		let e = h.current;
-		if (!e || f) {
-			_(!1);
+		m(_);
+	}, [_, m]), i.useLayoutEffect(() => {
+		let e = g.current;
+		if (!e || p) {
+			v(!1);
 			return;
 		}
 		let t = () => {
-			let t = Number.parseFloat(getComputedStyle(e).lineHeight), n = c * (Number.isFinite(t) && t > 0 ? t : 24), r = (u.match(/\n/g) ?? []).length;
-			_(e.scrollHeight > n + 1 || r >= c || u.trim().length > 220);
+			let t = Number.parseFloat(getComputedStyle(e).lineHeight), n = c * (Number.isFinite(t) && t > 0 ? t : 24), r = (d.match(/\n/g) ?? []).length;
+			v(e.scrollHeight > n + 1 || r >= c || d.trim().length > l);
 		};
 		t();
 		let n = new ResizeObserver(t);
 		return n.observe(e), () => n.disconnect();
-	}, [u, f]);
-	let v = g && !f;
+	}, [d, p]);
+	let y = _ && !p;
 	return /* @__PURE__ */ s("div", {
 		className: "relative min-w-0",
 		children: [/* @__PURE__ */ o("div", {
-			ref: h,
-			className: n("text-sm leading-6 whitespace-normal [word-break:break-word]", v && "line-clamp-3"),
+			ref: g,
+			className: n("text-sm leading-6 whitespace-normal [word-break:break-word]", y && "line-clamp-5"),
 			children: /* @__PURE__ */ o(r, {
 				includeStandard: !0,
 				includeHeadings: !0,
 				allowHtml: !1,
-				components: l,
-				children: u
+				components: u,
+				children: d
 			})
-		}), v ? /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", {
+		}), y ? /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", {
 			"aria-hidden": !0,
 			"data-testid": "chat-message-truncation-gradient",
 			className: "pointer-events-none absolute inset-x-0 bottom-0 h-10 bg-gradient-to-t from-tertiary to-transparent"
 		}), /* @__PURE__ */ o("span", {
 			"data-testid": "chat-message-view-more",
-			className: n("pointer-events-none absolute bottom-1 left-1/2 z-10 inline-flex -translate-x-1/2 items-center rounded-full border border-[var(--oh-border-subtle)] bg-[var(--oh-surface-raised)] px-2.5 py-0.5 text-xs font-normal text-[var(--oh-foreground)] transition-opacity duration-150", d ? "opacity-100" : "opacity-0"),
-			children: m(t.COMMON$VIEW_MORE)
+			className: n("pointer-events-none absolute bottom-1 left-1/2 z-10 inline-flex -translate-x-1/2 items-center rounded-full border border-[var(--oh-border-subtle)] bg-[var(--oh-surface-raised)] px-2.5 py-0.5 text-xs font-normal text-[var(--oh-foreground)] transition-opacity duration-150", f ? "opacity-100" : "opacity-0"),
+			children: h(t.COMMON$VIEW_MORE)
 		})] }) : null]
 	});
 }
 //#endregion
-export { u as UserMessageBody, l as chatBubbleMarkdownComponents };
+export { d as UserMessageBody, u as chatBubbleMarkdownComponents };
 
 //# sourceMappingURL=user-message-body.js.map

package/dist/components/features/chat/user-message-body.js.map

@@ -1 +1 @@
-{"version":3,"file":"user-message-body.js","names":[],"sources":["../../../../src/components/features/chat/user-message-body.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"#/utils/utils\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { MarkdownRenderer } from \"../markdown/markdown-renderer\";\n\nconst USER_MESSAGE_MAX_LINES = 3;\nexport const USER_MESSAGE_LINE_HEIGHT_PX = 24;\n\nexport const chatBubbleMarkdownComponents = {\n  p: ({ children }: React.ComponentProps<\"p\">) => (\n    <p className=\"m-0 leading-6\">{children}</p>\n  ),\n};\n\nexport function UserMessageBody({\n  message,\n  isHovering,\n  isExpanded,\n  onTruncatableChange,\n}: {\n  message: string;\n  isHovering: boolean;\n  isExpanded: boolean;\n  onTruncatableChange: (truncatable: boolean) => void;\n}) {\n  const { t } = useTranslation(\"openhands\");\n  const contentRef = React.useRef<HTMLDivElement>(null);\n  const [isTruncatable, setIsTruncatable] = React.useState(false);\n\n  React.useEffect(() => {\n    onTruncatableChange(isTruncatable);\n  }, [isTruncatable, onTruncatableChange]);\n\n  React.useLayoutEffect(() => {\n    const content = contentRef.current;\n    if (!content || isExpanded) {\n      setIsTruncatable(false);\n      return undefined;\n    }\n\n    const measure = () => {\n      const lineHeight = Number.parseFloat(\n        getComputedStyle(content).lineHeight,\n      );\n      const linePx =\n        Number.isFinite(lineHeight) && lineHeight > 0\n          ? lineHeight\n          : USER_MESSAGE_LINE_HEIGHT_PX;\n      const maxHeight = USER_MESSAGE_MAX_LINES * linePx;\n      const newlineCount = (message.match(/\\n/g) ?? []).length;\n\n      const truncatable =\n        content.scrollHeight > maxHeight + 1 ||\n        newlineCount >= USER_MESSAGE_MAX_LINES ||\n        message.trim().length > 220;\n\n      setIsTruncatable(truncatable);\n    };\n\n    measure();\n\n    const observer = new ResizeObserver(measure);\n    observer.observe(content);\n\n    return () => observer.disconnect();\n  }, [message, isExpanded]);\n\n  const isCollapsed = isTruncatable && !isExpanded;\n\n  return (\n    <div className=\"relative min-w-0\">\n      <div\n        ref={contentRef}\n        className={cn(\n          \"text-sm leading-6 whitespace-normal [word-break:break-word]\",\n          isCollapsed && \"line-clamp-3\",\n        )}\n      >\n        <MarkdownRenderer\n          includeStandard\n          includeHeadings\n          allowHtml={false}\n          components={chatBubbleMarkdownComponents}\n        >\n          {message}\n        </MarkdownRenderer>\n      </div>\n\n      {isCollapsed ? (\n        <>\n          <div\n            aria-hidden\n            data-testid=\"chat-message-truncation-gradient\"\n            className=\"pointer-events-none absolute inset-x-0 bottom-0 h-10 bg-gradient-to-t from-tertiary to-transparent\"\n          />\n          <span\n            data-testid=\"chat-message-view-more\"\n            className={cn(\n              \"pointer-events-none absolute bottom-1 left-1/2 z-10 inline-flex -translate-x-1/2 items-center rounded-full border border-[var(--oh-border-subtle)] bg-[var(--oh-surface-raised)] px-2.5 py-0.5 text-xs font-normal text-[var(--oh-foreground)] transition-opacity duration-150\",\n              isHovering ? \"opacity-100\" : \"opacity-0\",\n            )}\n          >\n            {t(I18nKey.COMMON$VIEW_MORE)}\n          </span>\n        </>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAMA,IAAM,IAAyB,GAGlB,IAA+B,EAC1C,IAAI,EAAE,kBACJ,kBAAC,KAAD;CAAG,WAAU;CAAiB;CAAa,CAAA,EAE9C;AAED,SAAgB,EAAgB,EAC9B,YACA,eACA,eACA,0BAMC;CACD,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAa,EAAM,OAAuB,KAAK,EAC/C,CAAC,GAAe,KAAoB,EAAM,SAAS,GAAM;AAM/D,CAJA,EAAM,gBAAgB;AACpB,IAAoB,EAAc;IACjC,CAAC,GAAe,EAAoB,CAAC,EAExC,EAAM,sBAAsB;EAC1B,IAAM,IAAU,EAAW;AAC3B,MAAI,CAAC,KAAW,GAAY;AAC1B,KAAiB,GAAM;AACvB;;EAGF,IAAM,UAAgB;GACpB,IAAM,IAAa,OAAO,WACxB,iBAAiB,EAAQ,CAAC,WAC3B,EAKK,IAAY,KAHhB,OAAO,SAAS,EAAW,IAAI,IAAa,IACxC,IAAA,KAGA,KAAgB,EAAQ,MAAM,MAAM,IAAI,EAAE,EAAE;AAOlD,KAJE,EAAQ,eAAe,IAAY,KACnC,KAAgB,KAChB,EAAQ,MAAM,CAAC,SAAS,IAEG;;AAG/B,KAAS;EAET,IAAM,IAAW,IAAI,eAAe,EAAQ;AAG5C,SAFA,EAAS,QAAQ,EAAQ,QAEZ,EAAS,YAAY;IACjC,CAAC,GAAS,EAAW,CAAC;CAEzB,IAAM,IAAc,KAAiB,CAAC;AAEtC,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GACE,KAAK;GACL,WAAW,EACT,+DACA,KAAe,eAChB;aAED,kBAAC,GAAD;IACE,iBAAA;IACA,iBAAA;IACA,WAAW;IACX,YAAY;cAEX;IACgB,CAAA;GACf,CAAA,EAEL,IACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD;GACE,eAAA;GACA,eAAY;GACZ,WAAU;GACV,CAAA,EACF,kBAAC,QAAD;GACE,eAAY;GACZ,WAAW,EACT,kRACA,IAAa,gBAAgB,YAC9B;aAEA,EAAE,EAAQ,iBAAiB;GACvB,CAAA,CACN,EAAA,CAAA,GACD,KACA"}
+{"version":3,"file":"user-message-body.js","names":[],"sources":["../../../../src/components/features/chat/user-message-body.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { cn } from \"#/utils/utils\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { MarkdownRenderer } from \"../markdown/markdown-renderer\";\n\nconst USER_MESSAGE_MAX_LINES = 5;\nconst USER_MESSAGE_LENGTH_THRESHOLD = 360;\nexport const USER_MESSAGE_LINE_HEIGHT_PX = 24;\n\nexport const chatBubbleMarkdownComponents = {\n  p: ({ children }: React.ComponentProps<\"p\">) => (\n    <p className=\"m-0 leading-6\">{children}</p>\n  ),\n};\n\nexport function UserMessageBody({\n  message,\n  isHovering,\n  isExpanded,\n  onTruncatableChange,\n}: {\n  message: string;\n  isHovering: boolean;\n  isExpanded: boolean;\n  onTruncatableChange: (truncatable: boolean) => void;\n}) {\n  const { t } = useTranslation(\"openhands\");\n  const contentRef = React.useRef<HTMLDivElement>(null);\n  const [isTruncatable, setIsTruncatable] = React.useState(false);\n\n  React.useEffect(() => {\n    onTruncatableChange(isTruncatable);\n  }, [isTruncatable, onTruncatableChange]);\n\n  React.useLayoutEffect(() => {\n    const content = contentRef.current;\n    if (!content || isExpanded) {\n      setIsTruncatable(false);\n      return undefined;\n    }\n\n    const measure = () => {\n      const lineHeight = Number.parseFloat(\n        getComputedStyle(content).lineHeight,\n      );\n      const linePx =\n        Number.isFinite(lineHeight) && lineHeight > 0\n          ? lineHeight\n          : USER_MESSAGE_LINE_HEIGHT_PX;\n      const maxHeight = USER_MESSAGE_MAX_LINES * linePx;\n      const newlineCount = (message.match(/\\n/g) ?? []).length;\n\n      const truncatable =\n        content.scrollHeight > maxHeight + 1 ||\n        newlineCount >= USER_MESSAGE_MAX_LINES ||\n        message.trim().length > USER_MESSAGE_LENGTH_THRESHOLD;\n\n      setIsTruncatable(truncatable);\n    };\n\n    measure();\n\n    const observer = new ResizeObserver(measure);\n    observer.observe(content);\n\n    return () => observer.disconnect();\n  }, [message, isExpanded]);\n\n  const isCollapsed = isTruncatable && !isExpanded;\n\n  return (\n    <div className=\"relative min-w-0\">\n      <div\n        ref={contentRef}\n        className={cn(\n          \"text-sm leading-6 whitespace-normal [word-break:break-word]\",\n          isCollapsed && \"line-clamp-5\",\n        )}\n      >\n        <MarkdownRenderer\n          includeStandard\n          includeHeadings\n          allowHtml={false}\n          components={chatBubbleMarkdownComponents}\n        >\n          {message}\n        </MarkdownRenderer>\n      </div>\n\n      {isCollapsed ? (\n        <>\n          <div\n            aria-hidden\n            data-testid=\"chat-message-truncation-gradient\"\n            className=\"pointer-events-none absolute inset-x-0 bottom-0 h-10 bg-gradient-to-t from-tertiary to-transparent\"\n          />\n          <span\n            data-testid=\"chat-message-view-more\"\n            className={cn(\n              \"pointer-events-none absolute bottom-1 left-1/2 z-10 inline-flex -translate-x-1/2 items-center rounded-full border border-[var(--oh-border-subtle)] bg-[var(--oh-surface-raised)] px-2.5 py-0.5 text-xs font-normal text-[var(--oh-foreground)] transition-opacity duration-150\",\n              isHovering ? \"opacity-100\" : \"opacity-0\",\n            )}\n          >\n            {t(I18nKey.COMMON$VIEW_MORE)}\n          </span>\n        </>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAMA,IAAM,IAAyB,GACzB,IAAgC,KAGzB,IAA+B,EAC1C,IAAI,EAAE,kBACJ,kBAAC,KAAD;CAAG,WAAU;CAAiB;CAAa,CAAA,EAE9C;AAED,SAAgB,EAAgB,EAC9B,YACA,eACA,eACA,0BAMC;CACD,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAa,EAAM,OAAuB,KAAK,EAC/C,CAAC,GAAe,KAAoB,EAAM,SAAS,GAAM;AAM/D,CAJA,EAAM,gBAAgB;AACpB,IAAoB,EAAc;IACjC,CAAC,GAAe,EAAoB,CAAC,EAExC,EAAM,sBAAsB;EAC1B,IAAM,IAAU,EAAW;AAC3B,MAAI,CAAC,KAAW,GAAY;AAC1B,KAAiB,GAAM;AACvB;;EAGF,IAAM,UAAgB;GACpB,IAAM,IAAa,OAAO,WACxB,iBAAiB,EAAQ,CAAC,WAC3B,EAKK,IAAY,KAHhB,OAAO,SAAS,EAAW,IAAI,IAAa,IACxC,IAAA,KAGA,KAAgB,EAAQ,MAAM,MAAM,IAAI,EAAE,EAAE;AAOlD,KAJE,EAAQ,eAAe,IAAY,KACnC,KAAgB,KAChB,EAAQ,MAAM,CAAC,SAAS,EAEG;;AAG/B,KAAS;EAET,IAAM,IAAW,IAAI,eAAe,EAAQ;AAG5C,SAFA,EAAS,QAAQ,EAAQ,QAEZ,EAAS,YAAY;IACjC,CAAC,GAAS,EAAW,CAAC;CAEzB,IAAM,IAAc,KAAiB,CAAC;AAEtC,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GACE,KAAK;GACL,WAAW,EACT,+DACA,KAAe,eAChB;aAED,kBAAC,GAAD;IACE,iBAAA;IACA,iBAAA;IACA,WAAW;IACX,YAAY;cAEX;IACgB,CAAA;GACf,CAAA,EAEL,IACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD;GACE,eAAA;GACA,eAAY;GACZ,WAAU;GACV,CAAA,EACF,kBAAC,QAAD;GACE,eAAY;GACZ,WAAW,EACT,kRACA,IAAa,gBAAgB,YAC9B;aAEA,EAAE,EAAQ,iBAAiB;GACvB,CAAA,CACN,EAAA,CAAA,GACD,KACA"}

package/dist/components/features/command-menu/command-menu-items.d.ts

@@ -0,0 +1,32 @@
+import React from "react";
+import { I18nKey } from "#/i18n/declaration";
+export declare const COMMAND_MENU_ROUTE: {
+    readonly conversations: "/conversations";
+    readonly customize: "/customize";
+    readonly automations: "/automations";
+    readonly mcp: "/mcp";
+    readonly settings: "/settings";
+    readonly agentSettings: "/settings/agents";
+    readonly llmSettings: "/settings/llm";
+    readonly condenserSettings: "/settings/condenser";
+    readonly verificationSettings: "/settings/verification";
+    readonly appSettings: "/settings/app";
+    readonly secretsSettings: "/settings/secrets";
+};
+export type CommandMenuGroupId = "navigation" | "settings" | "actions";
+export type CommandMenuItemId = "new-chat" | "customize" | "automations" | "mcp" | "settings" | "agent-settings" | "llm-settings" | "condenser-settings" | "verification-settings" | "app-settings" | "secrets-settings" | "toggle-sidebar";
+export interface CommandMenuItemDefinition {
+    id: CommandMenuItemId;
+    group: CommandMenuGroupId;
+    titleKey: I18nKey;
+    descriptionKey: I18nKey;
+    keywordsKey: I18nKey;
+    icon: React.ReactElement;
+    to?: string;
+    perform?: () => void;
+}
+export declare const COMMAND_MENU_GROUP_LABELS: Record<CommandMenuGroupId, I18nKey>;
+export declare const COMMAND_MENU_GROUP_ORDER: CommandMenuGroupId[];
+export declare const createCommandMenuItems: ({ toggleSidebar, }: {
+    toggleSidebar: () => void;
+}) => CommandMenuItemDefinition[];

package/dist/components/features/command-menu/command-menu-trigger.cjs

@@ -0,0 +1,2 @@
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../node_modules/lucide-react/dist/esm/icons/search.cjs`),i=require(`../../../utils/utils.cjs`),a=require(`../../shared/buttons/styled-tooltip.cjs`),o=require(`../sidebar/sidebar-layout.cjs`),s=require(`../sidebar/sidebar-collapsed-icon-slot.cjs`),c=require(`../../../stores/command-menu-store.cjs`);let l=require(`react`);l=e.__toESM(l,1);let u=require(`react/jsx-runtime`);var d=`command-menu-trigger`,f=18;function p({collapsed:e}){let{t:l}=t.useTranslation(`openhands`),p=c.useCommandMenuStore(e=>e.open),m=l(n.I18nKey.COMMAND_MENU$OPEN_LABEL),h=(0,u.jsxs)(`button`,{type:`button`,"data-testid":d,"aria-label":m,onClick:p,className:i.cn(o.sidebarNavRowClassName({collapsed:e}),e?`cursor-pointer`:`group justify-between border border-[var(--oh-border-subtle)] bg-[var(--oh-surface)]/50 hover:border-[var(--oh-border)] hover:bg-[var(--oh-surface-raised)]`),children:[(0,u.jsxs)(`span`,{className:`flex min-w-0 items-center gap-2`,children:[e?(0,u.jsx)(s.SidebarCollapsedIconSlot,{active:!1,children:(0,u.jsx)(r.Search,{width:f,height:f})}):(0,u.jsx)(`span`,{className:i.cn(o.SIDEBAR_ICON_SLOT_CLASS,`text-[var(--oh-muted)] group-hover:text-white`),"aria-hidden":`true`,children:(0,u.jsx)(r.Search,{width:f,height:f})}),(0,u.jsx)(`span`,{className:o.sidebarNavLabelClassName(e),children:m})]}),e?null:(0,u.jsx)(`kbd`,{className:`rounded-md border border-[var(--oh-border)] bg-black/20 px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-[0.12em] text-[var(--oh-text-dim)]`,children:l(n.I18nKey.COMMAND_MENU$SHORTCUT)})]});return e?(0,u.jsx)(a.StyledTooltip,{content:m,placement:`right`,children:h}):h}exports.CommandMenuTrigger=p;
+//# sourceMappingURL=command-menu-trigger.cjs.map

package/dist/components/features/command-menu/command-menu-trigger.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-menu-trigger.cjs","names":[],"sources":["../../../../src/components/features/command-menu/command-menu-trigger.tsx"],"sourcesContent":["import React from \"react\";\nimport { Search } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { StyledTooltip } from \"#/components/shared/buttons/styled-tooltip\";\nimport { useCommandMenuStore } from \"#/stores/command-menu-store\";\nimport { cn } from \"#/utils/utils\";\nimport { SidebarCollapsedIconSlot } from \"#/components/features/sidebar/sidebar-collapsed-icon-slot\";\nimport {\n  SIDEBAR_ICON_SLOT_CLASS,\n  sidebarNavLabelClassName,\n  sidebarNavRowClassName,\n} from \"#/components/features/sidebar/sidebar-layout\";\n\ninterface CommandMenuTriggerProps {\n  collapsed: boolean;\n}\n\nconst COMMAND_MENU_TRIGGER_TEST_ID = \"command-menu-trigger\";\nconst COMMAND_MENU_TRIGGER_ICON_SIZE = 18;\n\nexport function CommandMenuTrigger({ collapsed }: CommandMenuTriggerProps) {\n  const { t } = useTranslation(\"openhands\");\n  const open = useCommandMenuStore((state) => state.open);\n  const label = t(I18nKey.COMMAND_MENU$OPEN_LABEL);\n\n  const trigger = (\n    <button\n      type=\"button\"\n      data-testid={COMMAND_MENU_TRIGGER_TEST_ID}\n      aria-label={label}\n      onClick={open}\n      className={cn(\n        sidebarNavRowClassName({ collapsed }),\n        collapsed\n          ? \"cursor-pointer\"\n          : \"group justify-between border border-[var(--oh-border-subtle)] bg-[var(--oh-surface)]/50 hover:border-[var(--oh-border)] hover:bg-[var(--oh-surface-raised)]\",\n      )}\n    >\n      <span className=\"flex min-w-0 items-center gap-2\">\n        {collapsed ? (\n          <SidebarCollapsedIconSlot active={false}>\n            <Search\n              width={COMMAND_MENU_TRIGGER_ICON_SIZE}\n              height={COMMAND_MENU_TRIGGER_ICON_SIZE}\n            />\n          </SidebarCollapsedIconSlot>\n        ) : (\n          <span\n            className={cn(\n              SIDEBAR_ICON_SLOT_CLASS,\n              \"text-[var(--oh-muted)] group-hover:text-white\",\n            )}\n            aria-hidden=\"true\"\n          >\n            <Search\n              width={COMMAND_MENU_TRIGGER_ICON_SIZE}\n              height={COMMAND_MENU_TRIGGER_ICON_SIZE}\n            />\n          </span>\n        )}\n        <span className={sidebarNavLabelClassName(collapsed)}>{label}</span>\n      </span>\n      {!collapsed ? (\n        <kbd className=\"rounded-md border border-[var(--oh-border)] bg-black/20 px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-[0.12em] text-[var(--oh-text-dim)]\">\n          {t(I18nKey.COMMAND_MENU$SHORTCUT)}\n        </kbd>\n      ) : null}\n    </button>\n  );\n\n  if (collapsed) {\n    return (\n      <StyledTooltip content={label} placement=\"right\">\n        {trigger}\n      </StyledTooltip>\n    );\n  }\n\n  return trigger;\n}\n"],"mappings":"yjBAkBA,IAAM,EAA+B,uBAC/B,EAAiC,GAEvC,SAAgB,EAAmB,CAAE,aAAsC,CACzE,GAAM,CAAE,KAAM,EAAA,eAAe,YAAY,CACnC,EAAO,EAAA,oBAAqB,GAAU,EAAM,KAAK,CACjD,EAAQ,EAAE,EAAA,QAAQ,wBAAwB,CAE1C,GACJ,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,cAAa,EACb,aAAY,EACZ,QAAS,EACT,UAAW,EAAA,GACT,EAAA,uBAAuB,CAAE,YAAW,CAAC,CACrC,EACI,iBACA,8JACL,UAVH,EAYE,EAAA,EAAA,MAAC,OAAD,CAAM,UAAU,2CAAhB,CACG,GACC,EAAA,EAAA,KAAC,EAAA,yBAAD,CAA0B,OAAQ,aAChC,EAAA,EAAA,KAAC,EAAA,OAAD,CACE,MAAO,EACP,OAAQ,EACR,CAAA,CACuB,CAAA,EAE3B,EAAA,EAAA,KAAC,OAAD,CACE,UAAW,EAAA,GACT,EAAA,wBACA,gDACD,CACD,cAAY,iBAEZ,EAAA,EAAA,KAAC,EAAA,OAAD,CACE,MAAO,EACP,OAAQ,EACR,CAAA,CACG,CAAA,EAET,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,yBAAyB,EAAU,UAAG,EAAa,CAAA,CAC/D,GACL,EAIE,MAHF,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,iKACZ,EAAE,EAAA,QAAQ,sBAAsB,CAC7B,CAAA,CAED,GAWX,OARI,GAEA,EAAA,EAAA,KAAC,EAAA,cAAD,CAAe,QAAS,EAAO,UAAU,iBACtC,EACa,CAAA,CAIb"}

package/dist/components/features/command-menu/command-menu-trigger.d.ts

@@ -0,0 +1,5 @@
+interface CommandMenuTriggerProps {
+    collapsed: boolean;
+}
+export declare function CommandMenuTrigger({ collapsed }: CommandMenuTriggerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/features/command-menu/command-menu-trigger.js

@@ -0,0 +1,53 @@
+import { useTranslation as e } from "../../../node_modules/react-i18next/dist/es/useTranslation.js";
+import { I18nKey as t } from "../../../i18n/declaration.js";
+import { Search as n } from "../../../node_modules/lucide-react/dist/esm/icons/search.js";
+import { cn as r } from "../../../utils/utils.js";
+import { StyledTooltip as i } from "../../shared/buttons/styled-tooltip.js";
+import { SIDEBAR_ICON_SLOT_CLASS as a, sidebarNavLabelClassName as o, sidebarNavRowClassName as s } from "../sidebar/sidebar-layout.js";
+import { SidebarCollapsedIconSlot as c } from "../sidebar/sidebar-collapsed-icon-slot.js";
+import { useCommandMenuStore as l } from "../../../stores/command-menu-store.js";
+import "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/features/command-menu/command-menu-trigger.tsx
+var f = "command-menu-trigger", p = 18;
+function m({ collapsed: m }) {
+	let { t: h } = e("openhands"), g = l((e) => e.open), _ = h(t.COMMAND_MENU$OPEN_LABEL), v = /* @__PURE__ */ d("button", {
+		type: "button",
+		"data-testid": f,
+		"aria-label": _,
+		onClick: g,
+		className: r(s({ collapsed: m }), m ? "cursor-pointer" : "group justify-between border border-[var(--oh-border-subtle)] bg-[var(--oh-surface)]/50 hover:border-[var(--oh-border)] hover:bg-[var(--oh-surface-raised)]"),
+		children: [/* @__PURE__ */ d("span", {
+			className: "flex min-w-0 items-center gap-2",
+			children: [m ? /* @__PURE__ */ u(c, {
+				active: !1,
+				children: /* @__PURE__ */ u(n, {
+					width: p,
+					height: p
+				})
+			}) : /* @__PURE__ */ u("span", {
+				className: r(a, "text-[var(--oh-muted)] group-hover:text-white"),
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ u(n, {
+					width: p,
+					height: p
+				})
+			}), /* @__PURE__ */ u("span", {
+				className: o(m),
+				children: _
+			})]
+		}), m ? null : /* @__PURE__ */ u("kbd", {
+			className: "rounded-md border border-[var(--oh-border)] bg-black/20 px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-[0.12em] text-[var(--oh-text-dim)]",
+			children: h(t.COMMAND_MENU$SHORTCUT)
+		})]
+	});
+	return m ? /* @__PURE__ */ u(i, {
+		content: _,
+		placement: "right",
+		children: v
+	}) : v;
+}
+//#endregion
+export { m as CommandMenuTrigger };
+
+//# sourceMappingURL=command-menu-trigger.js.map

package/dist/components/features/command-menu/command-menu-trigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-menu-trigger.js","names":[],"sources":["../../../../src/components/features/command-menu/command-menu-trigger.tsx"],"sourcesContent":["import React from \"react\";\nimport { Search } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { StyledTooltip } from \"#/components/shared/buttons/styled-tooltip\";\nimport { useCommandMenuStore } from \"#/stores/command-menu-store\";\nimport { cn } from \"#/utils/utils\";\nimport { SidebarCollapsedIconSlot } from \"#/components/features/sidebar/sidebar-collapsed-icon-slot\";\nimport {\n  SIDEBAR_ICON_SLOT_CLASS,\n  sidebarNavLabelClassName,\n  sidebarNavRowClassName,\n} from \"#/components/features/sidebar/sidebar-layout\";\n\ninterface CommandMenuTriggerProps {\n  collapsed: boolean;\n}\n\nconst COMMAND_MENU_TRIGGER_TEST_ID = \"command-menu-trigger\";\nconst COMMAND_MENU_TRIGGER_ICON_SIZE = 18;\n\nexport function CommandMenuTrigger({ collapsed }: CommandMenuTriggerProps) {\n  const { t } = useTranslation(\"openhands\");\n  const open = useCommandMenuStore((state) => state.open);\n  const label = t(I18nKey.COMMAND_MENU$OPEN_LABEL);\n\n  const trigger = (\n    <button\n      type=\"button\"\n      data-testid={COMMAND_MENU_TRIGGER_TEST_ID}\n      aria-label={label}\n      onClick={open}\n      className={cn(\n        sidebarNavRowClassName({ collapsed }),\n        collapsed\n          ? \"cursor-pointer\"\n          : \"group justify-between border border-[var(--oh-border-subtle)] bg-[var(--oh-surface)]/50 hover:border-[var(--oh-border)] hover:bg-[var(--oh-surface-raised)]\",\n      )}\n    >\n      <span className=\"flex min-w-0 items-center gap-2\">\n        {collapsed ? (\n          <SidebarCollapsedIconSlot active={false}>\n            <Search\n              width={COMMAND_MENU_TRIGGER_ICON_SIZE}\n              height={COMMAND_MENU_TRIGGER_ICON_SIZE}\n            />\n          </SidebarCollapsedIconSlot>\n        ) : (\n          <span\n            className={cn(\n              SIDEBAR_ICON_SLOT_CLASS,\n              \"text-[var(--oh-muted)] group-hover:text-white\",\n            )}\n            aria-hidden=\"true\"\n          >\n            <Search\n              width={COMMAND_MENU_TRIGGER_ICON_SIZE}\n              height={COMMAND_MENU_TRIGGER_ICON_SIZE}\n            />\n          </span>\n        )}\n        <span className={sidebarNavLabelClassName(collapsed)}>{label}</span>\n      </span>\n      {!collapsed ? (\n        <kbd className=\"rounded-md border border-[var(--oh-border)] bg-black/20 px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-[0.12em] text-[var(--oh-text-dim)]\">\n          {t(I18nKey.COMMAND_MENU$SHORTCUT)}\n        </kbd>\n      ) : null}\n    </button>\n  );\n\n  if (collapsed) {\n    return (\n      <StyledTooltip content={label} placement=\"right\">\n        {trigger}\n      </StyledTooltip>\n    );\n  }\n\n  return trigger;\n}\n"],"mappings":";;;;;;;;;;;AAkBA,IAAM,IAA+B,wBAC/B,IAAiC;AAEvC,SAAgB,EAAmB,EAAE,gBAAsC;CACzE,IAAM,EAAE,SAAM,EAAe,YAAY,EACnC,IAAO,GAAqB,MAAU,EAAM,KAAK,EACjD,IAAQ,EAAE,EAAQ,wBAAwB,EAE1C,IACJ,kBAAC,UAAD;EACE,MAAK;EACL,eAAa;EACb,cAAY;EACZ,SAAS;EACT,WAAW,EACT,EAAuB,EAAE,cAAW,CAAC,EACrC,IACI,mBACA,8JACL;YAVH,CAYE,kBAAC,QAAD;GAAM,WAAU;aAAhB,CACG,IACC,kBAAC,GAAD;IAA0B,QAAQ;cAChC,kBAAC,GAAD;KACE,OAAO;KACP,QAAQ;KACR,CAAA;IACuB,CAAA,GAE3B,kBAAC,QAAD;IACE,WAAW,EACT,GACA,gDACD;IACD,eAAY;cAEZ,kBAAC,GAAD;KACE,OAAO;KACP,QAAQ;KACR,CAAA;IACG,CAAA,EAET,kBAAC,QAAD;IAAM,WAAW,EAAyB,EAAU;cAAG;IAAa,CAAA,CAC/D;MACL,IAIE,OAHF,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAE,EAAQ,sBAAsB;GAC7B,CAAA,CAED;;AAWX,QARI,IAEA,kBAAC,GAAD;EAAe,SAAS;EAAO,WAAU;YACtC;EACa,CAAA,GAIb"}

package/dist/components/features/command-menu/command-menu.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare function CommandMenu(): React.ReactPortal | null;

package/dist/components/features/command-menu/index.d.ts

@@ -0,0 +1,2 @@
+export { CommandMenu } from "./command-menu";
+export { CommandMenuTrigger } from "./command-menu-trigger";

package/dist/components/features/controls/tools-context-menu.cjs

@@ -1,2 +1,2 @@
-const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../utils/utils.cjs`),i=require(`../../../hooks/query/use-active-conversation.cjs`),a=require(`../../../ui/context-menu.cjs`),o=require(`../context-menu/context-menu-list-item.cjs`),s=require(`../../../hooks/use-click-outside-element.cjs`),c=require(`../../../ui/divider.cjs`),l=require(`../../../icons/settings.cjs`),u=require(`../../../hooks/use-user-providers.cjs`),d=require(`../../../icons/u-code-branch.cjs`),f=require(`../../../icons/skills.cjs`),p=require(`../../../icons/fishing-hook.cjs`),m=require(`../../../icons/u-tools.cjs`),h=require(`../../../icons/carret-right-fill.cjs`),g=require(`./tools-context-menu-icon-text.cjs`),_=require(`./git-tools-submenu.cjs`),v=require(`./macros-submenu.cjs`),y=require(`../context-menu/archived-disabled-tooltip.cjs`),b=require(`../../../hooks/use-is-archived-conversation.cjs`);let x=require(`react`);x=e.__toESM(x,1);let S=require(`react/jsx-runtime`);function C({onClose:e,onShowSkills:C,onShowHooks:w,onShowAgentTools:T,shouldShowAgentTools:E=!0,shouldShowHooks:D=!1,footerAction:O}){let{t:k}=t.useTranslation(`openhands`),{data:A}=i.useActiveConversation(),{providers:j}=u.useUserProviders(),M=b.useIsArchivedConversation(),[N,P]=(0,x.useState)(null),F=!!A?.selected_repository,I=j.length>0,L=F&&I,R=e=>{M||P(N===e?null:e)},z=()=>{P(null),e()};return(0,S.jsxs)(a.ContextMenu,{ref:s.useClickOutsideElement(z),testId:`tools-context-menu`,position:`top`,alignment:`left`,className:`left-[-16px] mb-2 bottom-full overflow-visible min-w-[200px]`,children:[L&&(0,S.jsxs)(`div`,{className:`relative group/git`,children:[(0,S.jsx)(y.ArchivedDisabledTooltip,{isDisabled:M,children:(0,S.jsx)(o.ContextMenuListItem,{testId:`git-tools-button`,onClick:()=>R(`git`),isDisabled:M,children:(0,S.jsx)(g.ToolsContextMenuIconText,{icon:(0,S.jsx)(d.default,{width:16,height:16}),text:k(n.I18nKey.COMMON$GIT_TOOLS),rightIcon:(0,S.jsx)(h.default,{width:10,height:10})})})}),!M&&(0,S.jsx)(`div`,{className:r.cn(`absolute left-full top-[-6px] z-60 opacity-0 invisible pointer-events-none transition-all duration-200 ml-[1px]`,`group-hover/git:opacity-100 group-hover/git:visible group-hover/git:pointer-events-auto`,`hover:opacity-100 hover:visible hover:pointer-events-auto`,N===`git`&&`opacity-100 visible pointer-events-auto`),children:(0,S.jsx)(_.GitToolsSubmenu,{onClose:z})})]}),(0,S.jsxs)(`div`,{className:`relative group/macros`,children:[(0,S.jsx)(y.ArchivedDisabledTooltip,{isDisabled:M,children:(0,S.jsx)(o.ContextMenuListItem,{testId:`macros-button`,onClick:()=>R(`macros`),isDisabled:M,children:(0,S.jsx)(g.ToolsContextMenuIconText,{icon:(0,S.jsx)(l.default,{width:16,height:16}),text:k(n.I18nKey.COMMON$MACROS),rightIcon:(0,S.jsx)(h.default,{width:10,height:10})})})}),!M&&(0,S.jsx)(`div`,{className:r.cn(`absolute left-full top-[-4px] z-60 opacity-0 invisible pointer-events-none transition-all duration-200 ml-[1px]`,`group-hover/macros:opacity-100 group-hover/macros:visible group-hover/macros:pointer-events-auto`,`hover:opacity-100 hover:visible hover:pointer-events-auto`,N===`macros`&&`opacity-100 visible pointer-events-auto`),children:(0,S.jsx)(v.MacrosSubmenu,{onClose:z})})]}),E&&(0,S.jsx)(c.Divider,{inset:`menu`}),(0,S.jsx)(y.ArchivedDisabledTooltip,{isDisabled:M,children:(0,S.jsx)(o.ContextMenuListItem,{testId:`show-skills-button`,onClick:C,isDisabled:M,children:(0,S.jsx)(g.ToolsContextMenuIconText,{icon:(0,S.jsx)(f.default,{width:16,height:16,className:`stroke-[1.75]`,"aria-hidden":!0}),text:k(n.I18nKey.CONVERSATION$SHOW_SKILLS)})})}),D&&(0,S.jsx)(y.ArchivedDisabledTooltip,{isDisabled:M,children:(0,S.jsx)(o.ContextMenuListItem,{testId:`show-hooks-button`,onClick:w,isDisabled:M,children:(0,S.jsx)(g.ToolsContextMenuIconText,{icon:(0,S.jsx)(p.default,{width:16,height:16,"aria-hidden":!0}),text:k(n.I18nKey.CONVERSATION$SHOW_HOOKS)})})}),E&&(0,S.jsx)(y.ArchivedDisabledTooltip,{isDisabled:M,children:(0,S.jsx)(o.ContextMenuListItem,{testId:`show-agent-tools-button`,onClick:T,isDisabled:M,children:(0,S.jsx)(g.ToolsContextMenuIconText,{icon:(0,S.jsx)(m.default,{width:16,height:16}),text:k(n.I18nKey.BUTTON$SHOW_AGENT_TOOLS_AND_METADATA)})})}),O&&(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(c.Divider,{}),(0,S.jsx)(o.ContextMenuListItem,{testId:O.testId,onClick:e=>{e.preventDefault(),e.stopPropagation(),O.onClick(),z()},children:(0,S.jsx)(g.ToolsContextMenuIconText,{icon:O.icon,text:O.label})})]})]})}exports.ToolsContextMenu=C;
+const e=require(`../../../_virtual/_rolldown/runtime.cjs`),t=require(`../../../node_modules/react-i18next/dist/es/useTranslation.cjs`),n=require(`../../../i18n/declaration.cjs`),r=require(`../../../utils/utils.cjs`),i=require(`../../../hooks/query/use-active-conversation.cjs`),a=require(`../../../ui/context-menu.cjs`),o=require(`../context-menu/context-menu-list-item.cjs`),s=require(`../../../hooks/use-click-outside-element.cjs`),c=require(`../../../ui/divider.cjs`),l=require(`../../../hooks/use-user-providers.cjs`),u=require(`../../../icons/u-code-branch.cjs`),d=require(`../../../icons/skills.cjs`),f=require(`../../../icons/u-puzzle-piece.cjs`),p=require(`../../../icons/fishing-hook.cjs`),m=require(`../../../icons/u-tools.cjs`),h=require(`../../../icons/settings.cjs`),g=require(`../../../icons/carret-right-fill.cjs`),_=require(`./tools-context-menu-icon-text.cjs`),v=require(`./git-tools-submenu.cjs`),y=require(`./macros-submenu.cjs`),b=require(`../context-menu/archived-disabled-tooltip.cjs`),x=require(`../../../hooks/use-is-archived-conversation.cjs`);let S=require(`react`);S=e.__toESM(S,1);let C=require(`react/jsx-runtime`);function w({onClose:e,onShowSkills:w,onShowPlugins:T,onShowHooks:E,onShowAgentTools:D,shouldShowAgentTools:O=!0,shouldShowHooks:k=!1,shouldShowPlugins:A=!1,footerAction:j}){let{t:M}=t.useTranslation(`openhands`),{data:N}=i.useActiveConversation(),{providers:P}=l.useUserProviders(),F=x.useIsArchivedConversation(),[I,L]=(0,S.useState)(null),R=!!N?.selected_repository,z=P.length>0,B=R&&z,V=e=>{F||L(I===e?null:e)},H=()=>{L(null),e()};return(0,C.jsxs)(a.ContextMenu,{ref:s.useClickOutsideElement(H),testId:`tools-context-menu`,position:`top`,alignment:`left`,className:`left-[-16px] mb-2 bottom-full overflow-visible min-w-[200px]`,children:[B&&(0,C.jsxs)(`div`,{className:`relative group/git`,children:[(0,C.jsx)(b.ArchivedDisabledTooltip,{isDisabled:F,children:(0,C.jsx)(o.ContextMenuListItem,{testId:`git-tools-button`,onClick:()=>V(`git`),isDisabled:F,children:(0,C.jsx)(_.ToolsContextMenuIconText,{icon:(0,C.jsx)(u.default,{width:16,height:16}),text:M(n.I18nKey.COMMON$GIT_TOOLS),rightIcon:(0,C.jsx)(g.default,{width:10,height:10})})})}),!F&&(0,C.jsx)(`div`,{className:r.cn(`absolute left-full top-[-6px] z-60 opacity-0 invisible pointer-events-none transition-all duration-200 ml-[1px]`,`group-hover/git:opacity-100 group-hover/git:visible group-hover/git:pointer-events-auto`,`hover:opacity-100 hover:visible hover:pointer-events-auto`,I===`git`&&`opacity-100 visible pointer-events-auto`),children:(0,C.jsx)(v.GitToolsSubmenu,{onClose:H})})]}),(0,C.jsxs)(`div`,{className:`relative group/macros`,children:[(0,C.jsx)(b.ArchivedDisabledTooltip,{isDisabled:F,children:(0,C.jsx)(o.ContextMenuListItem,{testId:`macros-button`,onClick:()=>V(`macros`),isDisabled:F,children:(0,C.jsx)(_.ToolsContextMenuIconText,{icon:(0,C.jsx)(h.default,{width:16,height:16}),text:M(n.I18nKey.COMMON$MACROS),rightIcon:(0,C.jsx)(g.default,{width:10,height:10})})})}),!F&&(0,C.jsx)(`div`,{className:r.cn(`absolute left-full top-[-4px] z-60 opacity-0 invisible pointer-events-none transition-all duration-200 ml-[1px]`,`group-hover/macros:opacity-100 group-hover/macros:visible group-hover/macros:pointer-events-auto`,`hover:opacity-100 hover:visible hover:pointer-events-auto`,I===`macros`&&`opacity-100 visible pointer-events-auto`),children:(0,C.jsx)(y.MacrosSubmenu,{onClose:H})})]}),O&&(0,C.jsx)(c.Divider,{inset:`menu`}),(0,C.jsx)(b.ArchivedDisabledTooltip,{isDisabled:F,children:(0,C.jsx)(o.ContextMenuListItem,{testId:`show-skills-button`,onClick:w,isDisabled:F,children:(0,C.jsx)(_.ToolsContextMenuIconText,{icon:(0,C.jsx)(d.default,{width:16,height:16,className:`stroke-[1.75]`,"aria-hidden":!0}),text:M(n.I18nKey.CONVERSATION$SHOW_SKILLS)})})}),A&&(0,C.jsx)(b.ArchivedDisabledTooltip,{isDisabled:F,children:(0,C.jsx)(o.ContextMenuListItem,{testId:`show-plugins-button`,onClick:T,isDisabled:F,children:(0,C.jsx)(_.ToolsContextMenuIconText,{icon:(0,C.jsx)(f.default,{width:16,height:16,"aria-hidden":!0}),text:M(n.I18nKey.CONVERSATION$SHOW_PLUGINS)})})}),k&&(0,C.jsx)(b.ArchivedDisabledTooltip,{isDisabled:F,children:(0,C.jsx)(o.ContextMenuListItem,{testId:`show-hooks-button`,onClick:E,isDisabled:F,children:(0,C.jsx)(_.ToolsContextMenuIconText,{icon:(0,C.jsx)(p.default,{width:16,height:16,"aria-hidden":!0}),text:M(n.I18nKey.CONVERSATION$SHOW_HOOKS)})})}),O&&(0,C.jsx)(b.ArchivedDisabledTooltip,{isDisabled:F,children:(0,C.jsx)(o.ContextMenuListItem,{testId:`show-agent-tools-button`,onClick:D,isDisabled:F,children:(0,C.jsx)(_.ToolsContextMenuIconText,{icon:(0,C.jsx)(m.default,{width:16,height:16}),text:M(n.I18nKey.BUTTON$SHOW_AGENT_TOOLS_AND_METADATA)})})}),j&&(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(c.Divider,{}),(0,C.jsx)(o.ContextMenuListItem,{testId:j.testId,onClick:e=>{e.preventDefault(),e.stopPropagation(),j.onClick(),H()},children:(0,C.jsx)(_.ToolsContextMenuIconText,{icon:j.icon,text:j.label})})]})]})}exports.ToolsContextMenu=w;
 //# sourceMappingURL=tools-context-menu.cjs.map

package/dist/components/features/controls/tools-context-menu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"tools-context-menu.cjs","names":[],"sources":["../../../../src/components/features/controls/tools-context-menu.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useUserProviders } from \"#/hooks/use-user-providers\";\nimport { cn } from \"#/utils/utils\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { ContextMenuListItem } from \"../context-menu/context-menu-list-item\";\nimport { Divider } from \"#/ui/divider\";\nimport { I18nKey } from \"#/i18n/declaration\";\n\nimport CodeBranchIcon from \"#/icons/u-code-branch.svg?react\";\nimport SkillsIcon from \"#/icons/skills.svg?react\";\nimport FishingHookIcon from \"#/icons/fishing-hook.svg?react\";\nimport ToolsIcon from \"#/icons/u-tools.svg?react\";\nimport SettingsIcon from \"#/icons/settings.svg?react\";\nimport CarretRightFillIcon from \"#/icons/carret-right-fill.svg?react\";\nimport { ToolsContextMenuIconText } from \"./tools-context-menu-icon-text\";\nimport { GitToolsSubmenu } from \"./git-tools-submenu\";\nimport { MacrosSubmenu } from \"./macros-submenu\";\nimport { ArchivedDisabledTooltip } from \"../context-menu/archived-disabled-tooltip\";\nimport { useIsArchivedConversation } from \"#/hooks/use-is-archived-conversation\";\n\ninterface ToolsContextMenuProps {\n  onClose: () => void;\n  onShowSkills: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onShowHooks: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onShowAgentTools: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  shouldShowAgentTools?: boolean;\n  shouldShowHooks?: boolean;\n  /** When set, renders a divider and this action as the last menu item. */\n  footerAction?: {\n    testId: string;\n    icon: React.ReactNode;\n    label: string;\n    onClick: () => void;\n  };\n}\n\nexport function ToolsContextMenu({\n  onClose,\n  onShowSkills,\n  onShowHooks,\n  onShowAgentTools,\n  shouldShowAgentTools = true,\n  shouldShowHooks = false,\n  footerAction,\n}: ToolsContextMenuProps) {\n  const { t } = useTranslation(\"openhands\");\n  const { data: conversation } = useActiveConversation();\n  const { providers } = useUserProviders();\n  const isArchivedConversation = useIsArchivedConversation();\n\n  const [activeSubmenu, setActiveSubmenu] = useState<\"git\" | \"macros\" | null>(\n    null,\n  );\n\n  const hasRepository = !!conversation?.selected_repository;\n  const providersAreSet = providers.length > 0;\n  const showGitTools = hasRepository && providersAreSet;\n\n  const handleSubmenuClick = (submenu: \"git\" | \"macros\") => {\n    if (isArchivedConversation) {\n      return;\n    }\n    setActiveSubmenu(activeSubmenu === submenu ? null : submenu);\n  };\n\n  const handleClose = () => {\n    setActiveSubmenu(null);\n    onClose();\n  };\n\n  const ref = useClickOutsideElement<HTMLUListElement>(handleClose);\n\n  return (\n    <ContextMenu\n      ref={ref}\n      testId=\"tools-context-menu\"\n      position=\"top\"\n      alignment=\"left\"\n      className=\"left-[-16px] mb-2 bottom-full overflow-visible min-w-[200px]\"\n    >\n      {/* Git Tools */}\n      {showGitTools && (\n        <div className=\"relative group/git\">\n          <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n            <ContextMenuListItem\n              testId=\"git-tools-button\"\n              onClick={() => handleSubmenuClick(\"git\")}\n              isDisabled={isArchivedConversation}\n            >\n              <ToolsContextMenuIconText\n                icon={<CodeBranchIcon width={16} height={16} />}\n                text={t(I18nKey.COMMON$GIT_TOOLS)}\n                rightIcon={<CarretRightFillIcon width={10} height={10} />}\n              />\n            </ContextMenuListItem>\n          </ArchivedDisabledTooltip>\n          {!isArchivedConversation && (\n            <div\n              className={cn(\n                \"absolute left-full top-[-6px] z-60 opacity-0 invisible pointer-events-none transition-all duration-200 ml-[1px]\",\n                \"group-hover/git:opacity-100 group-hover/git:visible group-hover/git:pointer-events-auto\",\n                \"hover:opacity-100 hover:visible hover:pointer-events-auto\",\n                activeSubmenu === \"git\" &&\n                  \"opacity-100 visible pointer-events-auto\",\n              )}\n            >\n              <GitToolsSubmenu onClose={handleClose} />\n            </div>\n          )}\n        </div>\n      )}\n\n      {/* Macros */}\n      <div className=\"relative group/macros\">\n        <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n          <ContextMenuListItem\n            testId=\"macros-button\"\n            onClick={() => handleSubmenuClick(\"macros\")}\n            isDisabled={isArchivedConversation}\n          >\n            <ToolsContextMenuIconText\n              icon={<SettingsIcon width={16} height={16} />}\n              text={t(I18nKey.COMMON$MACROS)}\n              rightIcon={<CarretRightFillIcon width={10} height={10} />}\n            />\n          </ContextMenuListItem>\n        </ArchivedDisabledTooltip>\n        {!isArchivedConversation && (\n          <div\n            className={cn(\n              \"absolute left-full top-[-4px] z-60 opacity-0 invisible pointer-events-none transition-all duration-200 ml-[1px]\",\n              \"group-hover/macros:opacity-100 group-hover/macros:visible group-hover/macros:pointer-events-auto\",\n              \"hover:opacity-100 hover:visible hover:pointer-events-auto\",\n              activeSubmenu === \"macros\" &&\n                \"opacity-100 visible pointer-events-auto\",\n            )}\n          >\n            <MacrosSubmenu onClose={handleClose} />\n          </div>\n        )}\n      </div>\n\n      {shouldShowAgentTools && <Divider inset=\"menu\" />}\n\n      <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n        <ContextMenuListItem\n          testId=\"show-skills-button\"\n          onClick={onShowSkills}\n          isDisabled={isArchivedConversation}\n        >\n          <ToolsContextMenuIconText\n            icon={\n              <SkillsIcon\n                width={16}\n                height={16}\n                className=\"stroke-[1.75]\"\n                aria-hidden\n              />\n            }\n            text={t(I18nKey.CONVERSATION$SHOW_SKILLS)}\n          />\n        </ContextMenuListItem>\n      </ArchivedDisabledTooltip>\n\n      {/* Show Hooks - Only show for V1 conversations */}\n      {shouldShowHooks && (\n        <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n          <ContextMenuListItem\n            testId=\"show-hooks-button\"\n            onClick={onShowHooks}\n            isDisabled={isArchivedConversation}\n          >\n            <ToolsContextMenuIconText\n              icon={<FishingHookIcon width={16} height={16} aria-hidden />}\n              text={t(I18nKey.CONVERSATION$SHOW_HOOKS)}\n            />\n          </ContextMenuListItem>\n        </ArchivedDisabledTooltip>\n      )}\n\n      {/* Show Agent Tools and Metadata - Only show if system message is available */}\n      {shouldShowAgentTools && (\n        <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n          <ContextMenuListItem\n            testId=\"show-agent-tools-button\"\n            onClick={onShowAgentTools}\n            isDisabled={isArchivedConversation}\n          >\n            <ToolsContextMenuIconText\n              icon={<ToolsIcon width={16} height={16} />}\n              text={t(I18nKey.BUTTON$SHOW_AGENT_TOOLS_AND_METADATA)}\n            />\n          </ContextMenuListItem>\n        </ArchivedDisabledTooltip>\n      )}\n\n      {footerAction && (\n        <>\n          <Divider />\n          <ContextMenuListItem\n            testId={footerAction.testId}\n            onClick={(event) => {\n              event.preventDefault();\n              event.stopPropagation();\n              footerAction.onClick();\n              handleClose();\n            }}\n          >\n            <ToolsContextMenuIconText\n              icon={footerAction.icon}\n              text={footerAction.label}\n            />\n          </ContextMenuListItem>\n        </>\n      )}\n    </ContextMenu>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"tools-context-menu.cjs","names":[],"sources":["../../../../src/components/features/controls/tools-context-menu.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useUserProviders } from \"#/hooks/use-user-providers\";\nimport { cn } from \"#/utils/utils\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { ContextMenuListItem } from \"../context-menu/context-menu-list-item\";\nimport { Divider } from \"#/ui/divider\";\nimport { I18nKey } from \"#/i18n/declaration\";\n\nimport CodeBranchIcon from \"#/icons/u-code-branch.svg?react\";\nimport SkillsIcon from \"#/icons/skills.svg?react\";\nimport PuzzleIcon from \"#/icons/u-puzzle-piece.svg?react\";\nimport FishingHookIcon from \"#/icons/fishing-hook.svg?react\";\nimport ToolsIcon from \"#/icons/u-tools.svg?react\";\nimport SettingsIcon from \"#/icons/settings.svg?react\";\nimport CarretRightFillIcon from \"#/icons/carret-right-fill.svg?react\";\nimport { ToolsContextMenuIconText } from \"./tools-context-menu-icon-text\";\nimport { GitToolsSubmenu } from \"./git-tools-submenu\";\nimport { MacrosSubmenu } from \"./macros-submenu\";\nimport { ArchivedDisabledTooltip } from \"../context-menu/archived-disabled-tooltip\";\nimport { useIsArchivedConversation } from \"#/hooks/use-is-archived-conversation\";\n\ninterface ToolsContextMenuProps {\n  onClose: () => void;\n  onShowSkills: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onShowPlugins: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onShowHooks: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onShowAgentTools: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  shouldShowAgentTools?: boolean;\n  shouldShowHooks?: boolean;\n  shouldShowPlugins?: boolean;\n  /** When set, renders a divider and this action as the last menu item. */\n  footerAction?: {\n    testId: string;\n    icon: React.ReactNode;\n    label: string;\n    onClick: () => void;\n  };\n}\n\nexport function ToolsContextMenu({\n  onClose,\n  onShowSkills,\n  onShowPlugins,\n  onShowHooks,\n  onShowAgentTools,\n  shouldShowAgentTools = true,\n  shouldShowHooks = false,\n  shouldShowPlugins = false,\n  footerAction,\n}: ToolsContextMenuProps) {\n  const { t } = useTranslation(\"openhands\");\n  const { data: conversation } = useActiveConversation();\n  const { providers } = useUserProviders();\n  const isArchivedConversation = useIsArchivedConversation();\n\n  const [activeSubmenu, setActiveSubmenu] = useState<\"git\" | \"macros\" | null>(\n    null,\n  );\n\n  const hasRepository = !!conversation?.selected_repository;\n  const providersAreSet = providers.length > 0;\n  const showGitTools = hasRepository && providersAreSet;\n\n  const handleSubmenuClick = (submenu: \"git\" | \"macros\") => {\n    if (isArchivedConversation) {\n      return;\n    }\n    setActiveSubmenu(activeSubmenu === submenu ? null : submenu);\n  };\n\n  const handleClose = () => {\n    setActiveSubmenu(null);\n    onClose();\n  };\n\n  const ref = useClickOutsideElement<HTMLUListElement>(handleClose);\n\n  return (\n    <ContextMenu\n      ref={ref}\n      testId=\"tools-context-menu\"\n      position=\"top\"\n      alignment=\"left\"\n      className=\"left-[-16px] mb-2 bottom-full overflow-visible min-w-[200px]\"\n    >\n      {/* Git Tools */}\n      {showGitTools && (\n        <div className=\"relative group/git\">\n          <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n            <ContextMenuListItem\n              testId=\"git-tools-button\"\n              onClick={() => handleSubmenuClick(\"git\")}\n              isDisabled={isArchivedConversation}\n            >\n              <ToolsContextMenuIconText\n                icon={<CodeBranchIcon width={16} height={16} />}\n                text={t(I18nKey.COMMON$GIT_TOOLS)}\n                rightIcon={<CarretRightFillIcon width={10} height={10} />}\n              />\n            </ContextMenuListItem>\n          </ArchivedDisabledTooltip>\n          {!isArchivedConversation && (\n            <div\n              className={cn(\n                \"absolute left-full top-[-6px] z-60 opacity-0 invisible pointer-events-none transition-all duration-200 ml-[1px]\",\n                \"group-hover/git:opacity-100 group-hover/git:visible group-hover/git:pointer-events-auto\",\n                \"hover:opacity-100 hover:visible hover:pointer-events-auto\",\n                activeSubmenu === \"git\" &&\n                  \"opacity-100 visible pointer-events-auto\",\n              )}\n            >\n              <GitToolsSubmenu onClose={handleClose} />\n            </div>\n          )}\n        </div>\n      )}\n\n      {/* Macros */}\n      <div className=\"relative group/macros\">\n        <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n          <ContextMenuListItem\n            testId=\"macros-button\"\n            onClick={() => handleSubmenuClick(\"macros\")}\n            isDisabled={isArchivedConversation}\n          >\n            <ToolsContextMenuIconText\n              icon={<SettingsIcon width={16} height={16} />}\n              text={t(I18nKey.COMMON$MACROS)}\n              rightIcon={<CarretRightFillIcon width={10} height={10} />}\n            />\n          </ContextMenuListItem>\n        </ArchivedDisabledTooltip>\n        {!isArchivedConversation && (\n          <div\n            className={cn(\n              \"absolute left-full top-[-4px] z-60 opacity-0 invisible pointer-events-none transition-all duration-200 ml-[1px]\",\n              \"group-hover/macros:opacity-100 group-hover/macros:visible group-hover/macros:pointer-events-auto\",\n              \"hover:opacity-100 hover:visible hover:pointer-events-auto\",\n              activeSubmenu === \"macros\" &&\n                \"opacity-100 visible pointer-events-auto\",\n            )}\n          >\n            <MacrosSubmenu onClose={handleClose} />\n          </div>\n        )}\n      </div>\n\n      {shouldShowAgentTools && <Divider inset=\"menu\" />}\n\n      <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n        <ContextMenuListItem\n          testId=\"show-skills-button\"\n          onClick={onShowSkills}\n          isDisabled={isArchivedConversation}\n        >\n          <ToolsContextMenuIconText\n            icon={\n              <SkillsIcon\n                width={16}\n                height={16}\n                className=\"stroke-[1.75]\"\n                aria-hidden\n              />\n            }\n            text={t(I18nKey.CONVERSATION$SHOW_SKILLS)}\n          />\n        </ContextMenuListItem>\n      </ArchivedDisabledTooltip>\n\n      {/* Show Plugins - only when this conversation has attached plugins */}\n      {shouldShowPlugins && (\n        <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n          <ContextMenuListItem\n            testId=\"show-plugins-button\"\n            onClick={onShowPlugins}\n            isDisabled={isArchivedConversation}\n          >\n            <ToolsContextMenuIconText\n              icon={<PuzzleIcon width={16} height={16} aria-hidden />}\n              text={t(I18nKey.CONVERSATION$SHOW_PLUGINS)}\n            />\n          </ContextMenuListItem>\n        </ArchivedDisabledTooltip>\n      )}\n\n      {/* Show Hooks - Only show for V1 conversations */}\n      {shouldShowHooks && (\n        <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n          <ContextMenuListItem\n            testId=\"show-hooks-button\"\n            onClick={onShowHooks}\n            isDisabled={isArchivedConversation}\n          >\n            <ToolsContextMenuIconText\n              icon={<FishingHookIcon width={16} height={16} aria-hidden />}\n              text={t(I18nKey.CONVERSATION$SHOW_HOOKS)}\n            />\n          </ContextMenuListItem>\n        </ArchivedDisabledTooltip>\n      )}\n\n      {/* Show Agent Tools and Metadata - Only show if system message is available */}\n      {shouldShowAgentTools && (\n        <ArchivedDisabledTooltip isDisabled={isArchivedConversation}>\n          <ContextMenuListItem\n            testId=\"show-agent-tools-button\"\n            onClick={onShowAgentTools}\n            isDisabled={isArchivedConversation}\n          >\n            <ToolsContextMenuIconText\n              icon={<ToolsIcon width={16} height={16} />}\n              text={t(I18nKey.BUTTON$SHOW_AGENT_TOOLS_AND_METADATA)}\n            />\n          </ContextMenuListItem>\n        </ArchivedDisabledTooltip>\n      )}\n\n      {footerAction && (\n        <>\n          <Divider />\n          <ContextMenuListItem\n            testId={footerAction.testId}\n            onClick={(event) => {\n              event.preventDefault();\n              event.stopPropagation();\n              footerAction.onClick();\n              handleClose();\n            }}\n          >\n            <ToolsContextMenuIconText\n              icon={footerAction.icon}\n              text={footerAction.label}\n            />\n          </ContextMenuListItem>\n        </>\n      )}\n    </ContextMenu>\n  );\n}\n"],"mappings":"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"}

package/dist/components/features/controls/tools-context-menu.d.ts

@@ -2,10 +2,12 @@ import React from "react";
 interface ToolsContextMenuProps {
     onClose: () => void;
     onShowSkills: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onShowPlugins: (event: React.MouseEvent<HTMLButtonElement>) => void;
     onShowHooks: (event: React.MouseEvent<HTMLButtonElement>) => void;
     onShowAgentTools: (event: React.MouseEvent<HTMLButtonElement>) => void;
     shouldShowAgentTools?: boolean;
     shouldShowHooks?: boolean;
+    shouldShowPlugins?: boolean;
     /** When set, renders a divider and this action as the last menu item. */
     footerAction?: {
         testId: string;
@@ -14,5 +16,5 @@ interface ToolsContextMenuProps {
         onClick: () => void;
     };
 }
-export declare function ToolsContextMenu({ onClose, onShowSkills, onShowHooks, onShowAgentTools, shouldShowAgentTools, shouldShowHooks, footerAction, }: ToolsContextMenuProps): import("react/jsx-runtime").JSX.Element;
+export declare function ToolsContextMenu({ onClose, onShowSkills, onShowPlugins, onShowHooks, onShowAgentTools, shouldShowAgentTools, shouldShowHooks, shouldShowPlugins, footerAction, }: ToolsContextMenuProps): import("react/jsx-runtime").JSX.Element;
 export {};