@openhands/agent-canvas 1.13.0 → 1.15.0

package/dist/components/features/chat/error-message-banner.cjs

@@ -1,2 +1,2 @@
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/react-i18next/dist/es/Trans.cjs"),n=require("../../../node_modules/react-i18next/dist/es/useTranslation.cjs"),r=require("../../../i18n/declaration.cjs"),i=require("../../../node_modules/lucide-react/dist/esm/icons/check.cjs"),a=require("../../../node_modules/lucide-react/dist/esm/icons/circle-x.cjs"),o=require("../../../node_modules/lucide-react/dist/esm/icons/copy.cjs"),s=require("../../../node_modules/lucide-react/dist/esm/icons/x.cjs"),c=require("../../../constants/status-colors.cjs"),l=require("../../../utils/utils.cjs"),u=require("../../../utils/custom-toast-handlers.cjs"),d=require("../../../utils/acp-error-codes.cjs");let f=require("react");f=e.__toESM(f,1);let p=require("react/jsx-runtime");var m=220;function h({message:e,code:h,onDismiss:g,onRetry:_,onReauth:v}){let{t:y,i18n:b}=n.useTranslation(`openhands`),x=d.getAcpErrorHeaderKey(h),[S,C]=f.default.useState(!1),[w,T]=f.default.useState(!1),[E,D]=f.default.useState(!1),O=f.default.useRef(null),k=b.exists(e,{ns:`openhands`}),A=k?String(y(e)):e,j=A.length>m,M=j&&!S;return f.default.useEffect(()=>{if(!E)return;let e=setTimeout(()=>{D(!1)},2e3);return()=>clearTimeout(e)},[E]),f.default.useEffect(()=>{D(!1)},[A]),f.default.useLayoutEffect(()=>{let e=O.current;if(!e)return;let t=()=>{let t=Number.parseFloat(getComputedStyle(e).lineHeight);if(!Number.isFinite(t)||t<=0){T(!1);return}T(e.getBoundingClientRect().height>t*1.5)};t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[A,M,S,e]),(0,p.jsxs)(`div`,{className:l.cn(`flex w-full gap-2 rounded-lg border border-[var(--oh-border)] bg-[var(--oh-surface-raised)] p-2 text-[var(--oh-foreground)]`,w?`items-start`:`items-center`),"data-testid":`error-message-banner`,children:[(0,p.jsx)(a.CircleX,{"aria-hidden":!0,className:`h-4 w-4 shrink-0`,strokeWidth:2,style:{color:c.OH_STATUS_ERROR_COLOR},"data-testid":`error-message-banner-icon`}),(0,p.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[x&&(0,p.jsx)(`div`,{className:`text-sm font-medium text-[var(--oh-foreground)]`,"data-testid":`error-message-banner-header`,children:y(x)}),(0,p.jsx)(`div`,{ref:O,className:l.cn(`whitespace-pre-wrap break-words text-sm text-[var(--oh-muted)]`,M&&`line-clamp-3`),"data-testid":`error-message-banner-content`,children:k?(0,p.jsx)(t.Trans,{ns:`openhands`,i18nKey:e}):e}),v&&(0,p.jsx)(`button`,{type:`button`,onClick:v,className:`mt-2 cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]`,"data-testid":`error-message-banner-reauth`,children:y(r.I18nKey.ERROR$ACP_UPDATE_CREDENTIALS)}),j&&(0,p.jsx)(`button`,{type:`button`,className:`mt-1 cursor-pointer text-xs font-normal text-[var(--oh-foreground)] underline`,onClick:()=>C(e=>!e),"data-testid":`error-message-banner-toggle`,children:y(S?r.I18nKey.COMMON$VIEW_LESS:r.I18nKey.COMMON$VIEW_MORE)})]}),(0,p.jsxs)(`div`,{className:l.cn(`flex shrink-0 gap-1`,w?`self-start`:`items-center`),children:[_&&(0,p.jsx)(`button`,{type:`button`,onClick:_,className:`cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]`,"data-testid":`error-message-banner-retry`,children:y(r.I18nKey.CHAT_INTERFACE$MESSAGE_RETRY)}),(0,p.jsx)(`button`,{type:`button`,onClick:async()=>{try{await navigator.clipboard.writeText(A),D(!0)}catch{u.displayErrorToast(y(r.I18nKey.CHAT_INTERFACE$CHAT_MESSAGE_COPY_FAILED))}},className:`shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]`,"aria-label":y(E?r.I18nKey.BUTTON$COPIED:r.I18nKey.BUTTON$COPY),"data-testid":`error-message-banner-copy`,children:E?(0,p.jsx)(i.Check,{className:`h-4 w-4`,"aria-hidden":!0}):(0,p.jsx)(o.Copy,{className:`h-4 w-4`,"aria-hidden":!0})}),g&&(0,p.jsx)(`button`,{type:`button`,onClick:g,className:`shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]`,"aria-label":y(r.I18nKey.BUTTON$CLOSE),"data-testid":`error-message-banner-dismiss`,children:(0,p.jsx)(s.X,{className:`h-4 w-4`,"aria-hidden":!0})})]})]})}exports.ErrorMessageBanner=h;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/react-i18next/dist/es/Trans.cjs"),n=require("../../../node_modules/react-i18next/dist/es/useTranslation.cjs"),r=require("../../../i18n/declaration.cjs"),i=require("../../../node_modules/lucide-react/dist/esm/icons/check.cjs"),a=require("../../../node_modules/lucide-react/dist/esm/icons/circle-alert.cjs"),o=require("../../../node_modules/lucide-react/dist/esm/icons/circle-x.cjs"),s=require("../../../node_modules/lucide-react/dist/esm/icons/copy.cjs"),c=require("../../../node_modules/lucide-react/dist/esm/icons/x.cjs"),l=require("../../../constants/status-colors.cjs"),u=require("../../../utils/utils.cjs"),d=require("../../../utils/custom-toast-handlers.cjs"),f=require("../../../utils/acp-error-codes.cjs");let p=require("react");p=e.__toESM(p,1);let m=require("react/jsx-runtime");var h=220;function g({message:e,code:g,onDismiss:_,onRetry:v,onReauth:y,classification:b}){let{t:x,i18n:S}=n.useTranslation(`openhands`),C=f.getAcpErrorHeaderKey(g),[w,T]=p.default.useState(!1),[E,D]=p.default.useState(!1),[O,k]=p.default.useState(!1),A=p.default.useRef(null),j=S.exists(e,{ns:`openhands`}),M=j?String(x(e)):e,N=M.length>h,P=N&&!w;return p.default.useEffect(()=>{if(!O)return;let e=setTimeout(()=>{k(!1)},2e3);return()=>clearTimeout(e)},[O]),p.default.useEffect(()=>{k(!1)},[M]),p.default.useLayoutEffect(()=>{let e=A.current;if(!e)return;let t=()=>{let t=Number.parseFloat(getComputedStyle(e).lineHeight);if(!Number.isFinite(t)||t<=0){D(!1);return}D(e.getBoundingClientRect().height>t*1.5)};t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[M,P,w,e]),(0,m.jsxs)(`div`,{className:u.cn(`flex w-full gap-2 rounded-lg border border-[var(--oh-border)] bg-[var(--oh-surface-raised)] p-2 text-[var(--oh-foreground)]`,E?`items-start`:`items-center`),"data-testid":`error-message-banner`,children:[b!=null&&b.kind!==`internal`&&b.kind!==`unknown`?(0,m.jsx)(a.CircleAlert,{"aria-hidden":!0,className:`h-4 w-4 shrink-0 text-[var(--oh-warning)]`,strokeWidth:2,"data-testid":`warning-message-banner-icon`}):(0,m.jsx)(o.CircleX,{"aria-hidden":!0,className:`h-4 w-4 shrink-0`,strokeWidth:2,style:{color:l.OH_STATUS_ERROR_COLOR},"data-testid":`error-message-banner-icon`}),(0,m.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[C&&(0,m.jsx)(`div`,{className:`text-sm font-medium text-[var(--oh-foreground)]`,"data-testid":`error-message-banner-header`,children:x(C)}),(0,m.jsx)(`div`,{ref:A,className:u.cn(`whitespace-pre-wrap break-words text-sm text-[var(--oh-muted)]`,P&&`line-clamp-3`),"data-testid":`error-message-banner-content`,children:j?(0,m.jsx)(t.Trans,{ns:`openhands`,i18nKey:e}):e}),y&&(0,m.jsx)(`button`,{type:`button`,onClick:y,className:`mt-2 cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]`,"data-testid":`error-message-banner-reauth`,children:x(r.I18nKey.ERROR$ACP_UPDATE_CREDENTIALS)}),N&&(0,m.jsx)(`button`,{type:`button`,className:`mt-1 cursor-pointer text-xs font-normal text-[var(--oh-foreground)] underline`,onClick:()=>T(e=>!e),"data-testid":`error-message-banner-toggle`,children:x(w?r.I18nKey.COMMON$VIEW_LESS:r.I18nKey.COMMON$VIEW_MORE)})]}),(0,m.jsxs)(`div`,{className:u.cn(`flex shrink-0 gap-1`,E?`self-start`:`items-center`),children:[v&&(0,m.jsx)(`button`,{type:`button`,onClick:v,className:`cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]`,"data-testid":`error-message-banner-retry`,children:x(r.I18nKey.CHAT_INTERFACE$MESSAGE_RETRY)}),(0,m.jsx)(`button`,{type:`button`,onClick:async()=>{try{await navigator.clipboard.writeText(M),k(!0)}catch{d.displayErrorToast(x(r.I18nKey.CHAT_INTERFACE$CHAT_MESSAGE_COPY_FAILED))}},className:`shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]`,"aria-label":x(O?r.I18nKey.BUTTON$COPIED:r.I18nKey.BUTTON$COPY),"data-testid":`error-message-banner-copy`,children:O?(0,m.jsx)(i.Check,{className:`h-4 w-4`,"aria-hidden":!0}):(0,m.jsx)(s.Copy,{className:`h-4 w-4`,"aria-hidden":!0})}),_&&(0,m.jsx)(`button`,{type:`button`,onClick:_,className:`shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]`,"aria-label":x(r.I18nKey.BUTTON$CLOSE),"data-testid":`error-message-banner-dismiss`,children:(0,m.jsx)(c.X,{className:`h-4 w-4`,"aria-hidden":!0})})]})]})}exports.ErrorMessageBanner=g;
 //# sourceMappingURL=error-message-banner.cjs.map

package/dist/components/features/chat/error-message-banner.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"error-message-banner.cjs","names":[],"sources":["../../../../src/components/features/chat/error-message-banner.tsx"],"sourcesContent":["import React from \"react\";\nimport { Trans, useTranslation } from \"react-i18next\";\nimport { Check, CircleX, Copy, X } from \"lucide-react\";\nimport { OH_STATUS_ERROR_COLOR } from \"#/constants/status-colors\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { displayErrorToast } from \"#/utils/custom-toast-handlers\";\nimport { getAcpErrorHeaderKey } from \"#/utils/acp-error-codes\";\nimport { cn } from \"#/utils/utils\";\n\ninterface ErrorMessageBannerProps {\n  message: string;\n  /** Structured error code (e.g. \"ACPAuthRequired\") used to pick a header. */\n  code?: string | null;\n  onDismiss?: () => void;\n  onRetry?: () => void;\n  /** Recovery action (e.g. re-authenticate) shown for credential failures. */\n  onReauth?: () => void;\n}\n\nconst DEFAULT_MAX_COLLAPSED_CHARS = 220;\n\nexport function ErrorMessageBanner({\n  message,\n  code,\n  onDismiss,\n  onRetry,\n  onReauth,\n}: ErrorMessageBannerProps) {\n  const { t, i18n } = useTranslation(\"openhands\");\n  const headerKey = getAcpErrorHeaderKey(code);\n  const [isExpanded, setIsExpanded] = React.useState(false);\n  const [isMultiLine, setIsMultiLine] = React.useState(false);\n  const [isCopied, setIsCopied] = React.useState(false);\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const isI18nKey = i18n.exists(message, { ns: \"openhands\" });\n  const displayTextForLength = isI18nKey ? String(t(message)) : message;\n  const shouldShowToggle =\n    displayTextForLength.length > DEFAULT_MAX_COLLAPSED_CHARS;\n\n  const isCollapsed = shouldShowToggle && !isExpanded;\n\n  const handleCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(displayTextForLength);\n      setIsCopied(true);\n    } catch {\n      displayErrorToast(t(I18nKey.CHAT_INTERFACE$CHAT_MESSAGE_COPY_FAILED));\n    }\n  };\n\n  React.useEffect(() => {\n    if (!isCopied) return undefined;\n\n    const timeout = setTimeout(() => {\n      setIsCopied(false);\n    }, 2000);\n\n    return () => clearTimeout(timeout);\n  }, [isCopied]);\n\n  React.useEffect(() => {\n    setIsCopied(false);\n  }, [displayTextForLength]);\n\n  React.useLayoutEffect(() => {\n    const content = contentRef.current;\n    if (!content) {\n      return undefined;\n    }\n\n    const updateIsMultiLine = () => {\n      const lineHeight = Number.parseFloat(\n        getComputedStyle(content).lineHeight,\n      );\n      if (!Number.isFinite(lineHeight) || lineHeight <= 0) {\n        setIsMultiLine(false);\n        return;\n      }\n\n      setIsMultiLine(content.getBoundingClientRect().height > lineHeight * 1.5);\n    };\n\n    updateIsMultiLine();\n\n    const observer = new ResizeObserver(updateIsMultiLine);\n    observer.observe(content);\n\n    return () => observer.disconnect();\n  }, [displayTextForLength, isCollapsed, isExpanded, message]);\n\n  return (\n    <div\n      className={cn(\n        \"flex w-full gap-2 rounded-lg border border-[var(--oh-border)] bg-[var(--oh-surface-raised)] p-2 text-[var(--oh-foreground)]\",\n        isMultiLine ? \"items-start\" : \"items-center\",\n      )}\n      data-testid=\"error-message-banner\"\n    >\n      <CircleX\n        aria-hidden\n        className=\"h-4 w-4 shrink-0\"\n        strokeWidth={2}\n        style={{ color: OH_STATUS_ERROR_COLOR }}\n        data-testid=\"error-message-banner-icon\"\n      />\n      <div className=\"min-w-0 flex-1\">\n        {headerKey && (\n          <div\n            className=\"text-sm font-medium text-[var(--oh-foreground)]\"\n            data-testid=\"error-message-banner-header\"\n          >\n            {t(headerKey)}\n          </div>\n        )}\n        <div\n          ref={contentRef}\n          className={cn(\n            \"whitespace-pre-wrap break-words text-sm text-[var(--oh-muted)]\",\n            isCollapsed && \"line-clamp-3\",\n          )}\n          data-testid=\"error-message-banner-content\"\n        >\n          {isI18nKey ? <Trans ns=\"openhands\" i18nKey={message} /> : message}\n        </div>\n\n        {onReauth && (\n          <button\n            type=\"button\"\n            onClick={onReauth}\n            className=\"mt-2 cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]\"\n            data-testid=\"error-message-banner-reauth\"\n          >\n            {t(I18nKey.ERROR$ACP_UPDATE_CREDENTIALS)}\n          </button>\n        )}\n\n        {shouldShowToggle && (\n          <button\n            type=\"button\"\n            className=\"mt-1 cursor-pointer text-xs font-normal text-[var(--oh-foreground)] underline\"\n            onClick={() => setIsExpanded((prev) => !prev)}\n            data-testid=\"error-message-banner-toggle\"\n          >\n            {isExpanded\n              ? t(I18nKey.COMMON$VIEW_LESS)\n              : t(I18nKey.COMMON$VIEW_MORE)}\n          </button>\n        )}\n      </div>\n\n      <div\n        className={cn(\n          \"flex shrink-0 gap-1\",\n          isMultiLine ? \"self-start\" : \"items-center\",\n        )}\n      >\n        {onRetry && (\n          <button\n            type=\"button\"\n            onClick={onRetry}\n            className=\"cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]\"\n            data-testid=\"error-message-banner-retry\"\n          >\n            {t(I18nKey.CHAT_INTERFACE$MESSAGE_RETRY)}\n          </button>\n        )}\n\n        <button\n          type=\"button\"\n          onClick={handleCopy}\n          className=\"shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]\"\n          aria-label={t(isCopied ? I18nKey.BUTTON$COPIED : I18nKey.BUTTON$COPY)}\n          data-testid=\"error-message-banner-copy\"\n        >\n          {isCopied ? (\n            <Check className=\"h-4 w-4\" aria-hidden />\n          ) : (\n            <Copy className=\"h-4 w-4\" aria-hidden />\n          )}\n        </button>\n\n        {onDismiss && (\n          <button\n            type=\"button\"\n            onClick={onDismiss}\n            className=\"shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]\"\n            aria-label={t(I18nKey.BUTTON$CLOSE)}\n            data-testid=\"error-message-banner-dismiss\"\n          >\n            <X className=\"h-4 w-4\" aria-hidden />\n          </button>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"error-message-banner.cjs","names":[],"sources":["../../../../src/components/features/chat/error-message-banner.tsx"],"sourcesContent":["import React from \"react\";\nimport { Trans, useTranslation } from \"react-i18next\";\nimport { Check, CircleAlert, CircleX, Copy, X } from \"lucide-react\";\nimport { OH_STATUS_ERROR_COLOR } from \"#/constants/status-colors\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { displayErrorToast } from \"#/utils/custom-toast-handlers\";\nimport { getAcpErrorHeaderKey } from \"#/utils/acp-error-codes\";\nimport { cn } from \"#/utils/utils\";\nimport type { ErrorClassification } from \"@openhands/typescript-client\";\n\ninterface ErrorMessageBannerProps {\n  message: string;\n  /** Structured error code (e.g. \"ACPAuthRequired\") used to pick a header. */\n  code?: string | null;\n  onDismiss?: () => void;\n  onRetry?: () => void;\n  /** Recovery action (e.g. re-authenticate) shown for credential failures. */\n  onReauth?: () => void;\n  classification?: ErrorClassification | null;\n}\n\nconst DEFAULT_MAX_COLLAPSED_CHARS = 220;\n\nexport function ErrorMessageBanner({\n  message,\n  code,\n  onDismiss,\n  onRetry,\n  onReauth,\n  classification,\n}: ErrorMessageBannerProps) {\n  const { t, i18n } = useTranslation(\"openhands\");\n  const headerKey = getAcpErrorHeaderKey(code);\n  const [isExpanded, setIsExpanded] = React.useState(false);\n  const [isMultiLine, setIsMultiLine] = React.useState(false);\n  const [isCopied, setIsCopied] = React.useState(false);\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const isI18nKey = i18n.exists(message, { ns: \"openhands\" });\n  const displayTextForLength = isI18nKey ? String(t(message)) : message;\n  const shouldShowToggle =\n    displayTextForLength.length > DEFAULT_MAX_COLLAPSED_CHARS;\n\n  const isCollapsed = shouldShowToggle && !isExpanded;\n\n  const handleCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(displayTextForLength);\n      setIsCopied(true);\n    } catch {\n      displayErrorToast(t(I18nKey.CHAT_INTERFACE$CHAT_MESSAGE_COPY_FAILED));\n    }\n  };\n\n  React.useEffect(() => {\n    if (!isCopied) return undefined;\n\n    const timeout = setTimeout(() => {\n      setIsCopied(false);\n    }, 2000);\n\n    return () => clearTimeout(timeout);\n  }, [isCopied]);\n\n  React.useEffect(() => {\n    setIsCopied(false);\n  }, [displayTextForLength]);\n\n  React.useLayoutEffect(() => {\n    const content = contentRef.current;\n    if (!content) {\n      return undefined;\n    }\n\n    const updateIsMultiLine = () => {\n      const lineHeight = Number.parseFloat(\n        getComputedStyle(content).lineHeight,\n      );\n      if (!Number.isFinite(lineHeight) || lineHeight <= 0) {\n        setIsMultiLine(false);\n        return;\n      }\n\n      setIsMultiLine(content.getBoundingClientRect().height > lineHeight * 1.5);\n    };\n\n    updateIsMultiLine();\n\n    const observer = new ResizeObserver(updateIsMultiLine);\n    observer.observe(content);\n\n    return () => observer.disconnect();\n  }, [displayTextForLength, isCollapsed, isExpanded, message]);\n\n  return (\n    <div\n      className={cn(\n        \"flex w-full gap-2 rounded-lg border border-[var(--oh-border)] bg-[var(--oh-surface-raised)] p-2 text-[var(--oh-foreground)]\",\n        isMultiLine ? \"items-start\" : \"items-center\",\n      )}\n      data-testid=\"error-message-banner\"\n    >\n      {classification != null &&\n      classification.kind !== \"internal\" &&\n      classification.kind !== \"unknown\" ? (\n        <CircleAlert\n          aria-hidden\n          className=\"h-4 w-4 shrink-0 text-[var(--oh-warning)]\"\n          strokeWidth={2}\n          data-testid=\"warning-message-banner-icon\"\n        />\n      ) : (\n        <CircleX\n          aria-hidden\n          className=\"h-4 w-4 shrink-0\"\n          strokeWidth={2}\n          style={{ color: OH_STATUS_ERROR_COLOR }}\n          data-testid=\"error-message-banner-icon\"\n        />\n      )}\n      <div className=\"min-w-0 flex-1\">\n        {headerKey && (\n          <div\n            className=\"text-sm font-medium text-[var(--oh-foreground)]\"\n            data-testid=\"error-message-banner-header\"\n          >\n            {t(headerKey)}\n          </div>\n        )}\n        <div\n          ref={contentRef}\n          className={cn(\n            \"whitespace-pre-wrap break-words text-sm text-[var(--oh-muted)]\",\n            isCollapsed && \"line-clamp-3\",\n          )}\n          data-testid=\"error-message-banner-content\"\n        >\n          {isI18nKey ? <Trans ns=\"openhands\" i18nKey={message} /> : message}\n        </div>\n\n        {onReauth && (\n          <button\n            type=\"button\"\n            onClick={onReauth}\n            className=\"mt-2 cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]\"\n            data-testid=\"error-message-banner-reauth\"\n          >\n            {t(I18nKey.ERROR$ACP_UPDATE_CREDENTIALS)}\n          </button>\n        )}\n\n        {shouldShowToggle && (\n          <button\n            type=\"button\"\n            className=\"mt-1 cursor-pointer text-xs font-normal text-[var(--oh-foreground)] underline\"\n            onClick={() => setIsExpanded((prev) => !prev)}\n            data-testid=\"error-message-banner-toggle\"\n          >\n            {isExpanded\n              ? t(I18nKey.COMMON$VIEW_LESS)\n              : t(I18nKey.COMMON$VIEW_MORE)}\n          </button>\n        )}\n      </div>\n\n      <div\n        className={cn(\n          \"flex shrink-0 gap-1\",\n          isMultiLine ? \"self-start\" : \"items-center\",\n        )}\n      >\n        {onRetry && (\n          <button\n            type=\"button\"\n            onClick={onRetry}\n            className=\"cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]\"\n            data-testid=\"error-message-banner-retry\"\n          >\n            {t(I18nKey.CHAT_INTERFACE$MESSAGE_RETRY)}\n          </button>\n        )}\n\n        <button\n          type=\"button\"\n          onClick={handleCopy}\n          className=\"shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]\"\n          aria-label={t(isCopied ? I18nKey.BUTTON$COPIED : I18nKey.BUTTON$COPY)}\n          data-testid=\"error-message-banner-copy\"\n        >\n          {isCopied ? (\n            <Check className=\"h-4 w-4\" aria-hidden />\n          ) : (\n            <Copy className=\"h-4 w-4\" aria-hidden />\n          )}\n        </button>\n\n        {onDismiss && (\n          <button\n            type=\"button\"\n            onClick={onDismiss}\n            className=\"shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]\"\n            aria-label={t(I18nKey.BUTTON$CLOSE)}\n            data-testid=\"error-message-banner-dismiss\"\n          >\n            <X className=\"h-4 w-4\" aria-hidden />\n          </button>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/features/chat/error-message-banner.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import type { ErrorClassification } from "@openhands/typescript-client";
 interface ErrorMessageBannerProps {
     message: string;
     /** Structured error code (e.g. "ACPAuthRequired") used to pick a header. */
@@ -7,6 +8,7 @@ interface ErrorMessageBannerProps {
     onRetry?: () => void;
     /** Recovery action (e.g. re-authenticate) shown for credential failures. */
     onReauth?: () => void;
+    classification?: ErrorClassification | null;
 }
-export declare function ErrorMessageBanner({ message, code, onDismiss, onRetry, onReauth, }: ErrorMessageBannerProps): React.JSX.Element;
+export declare function ErrorMessageBanner({ message, code, onDismiss, onRetry, onReauth, classification, }: ErrorMessageBannerProps): React.JSX.Element;
 export {};

package/dist/components/features/chat/error-message-banner.js

@@ -2,124 +2,130 @@ import { Trans as e } from "../../../node_modules/react-i18next/dist/es/Trans.js
 import { useTranslation as t } from "../../../node_modules/react-i18next/dist/es/useTranslation.js";
 import { I18nKey as n } from "../../../i18n/declaration.js";
 import { Check as r } from "../../../node_modules/lucide-react/dist/esm/icons/check.js";
-import { CircleX as i } from "../../../node_modules/lucide-react/dist/esm/icons/circle-x.js";
-import { Copy as a } from "../../../node_modules/lucide-react/dist/esm/icons/copy.js";
-import { X as o } from "../../../node_modules/lucide-react/dist/esm/icons/x.js";
-import { OH_STATUS_ERROR_COLOR as s } from "../../../constants/status-colors.js";
-import { cn as c } from "../../../utils/utils.js";
-import { displayErrorToast as l } from "../../../utils/custom-toast-handlers.js";
-import { getAcpErrorHeaderKey as u } from "../../../utils/acp-error-codes.js";
-import d from "react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { CircleAlert as i } from "../../../node_modules/lucide-react/dist/esm/icons/circle-alert.js";
+import { CircleX as a } from "../../../node_modules/lucide-react/dist/esm/icons/circle-x.js";
+import { Copy as o } from "../../../node_modules/lucide-react/dist/esm/icons/copy.js";
+import { X as s } from "../../../node_modules/lucide-react/dist/esm/icons/x.js";
+import { OH_STATUS_ERROR_COLOR as c } from "../../../constants/status-colors.js";
+import { cn as l } from "../../../utils/utils.js";
+import { displayErrorToast as u } from "../../../utils/custom-toast-handlers.js";
+import { getAcpErrorHeaderKey as d } from "../../../utils/acp-error-codes.js";
+import f from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
 //#region src/components/features/chat/error-message-banner.tsx
-var m = 220;
-function h({ message: h, code: g, onDismiss: _, onRetry: v, onReauth: y }) {
-	let { t: b, i18n: x } = t("openhands"), S = u(g), [C, w] = d.useState(!1), [T, E] = d.useState(!1), [D, O] = d.useState(!1), k = d.useRef(null), A = x.exists(h, { ns: "openhands" }), j = A ? String(b(h)) : h, M = j.length > m, N = M && !C;
-	return d.useEffect(() => {
-		if (!D) return;
+var h = 220;
+function g({ message: g, code: _, onDismiss: v, onRetry: y, onReauth: b, classification: x }) {
+	let { t: S, i18n: C } = t("openhands"), w = d(_), [T, E] = f.useState(!1), [D, O] = f.useState(!1), [k, A] = f.useState(!1), j = f.useRef(null), M = C.exists(g, { ns: "openhands" }), N = M ? String(S(g)) : g, P = N.length > h, F = P && !T;
+	return f.useEffect(() => {
+		if (!k) return;
 		let e = setTimeout(() => {
-			O(!1);
+			A(!1);
 		}, 2e3);
 		return () => clearTimeout(e);
-	}, [D]), d.useEffect(() => {
-		O(!1);
-	}, [j]), d.useLayoutEffect(() => {
-		let e = k.current;
+	}, [k]), f.useEffect(() => {
+		A(!1);
+	}, [N]), f.useLayoutEffect(() => {
+		let e = j.current;
 		if (!e) return;
 		let t = () => {
 			let t = Number.parseFloat(getComputedStyle(e).lineHeight);
 			if (!Number.isFinite(t) || t <= 0) {
-				E(!1);
+				O(!1);
 				return;
 			}
-			E(e.getBoundingClientRect().height > t * 1.5);
+			O(e.getBoundingClientRect().height > t * 1.5);
 		};
 		t();
 		let n = new ResizeObserver(t);
 		return n.observe(e), () => n.disconnect();
 	}, [
-		j,
 		N,
-		C,
-		h
-	]), /* @__PURE__ */ p("div", {
-		className: c("flex w-full gap-2 rounded-lg border border-[var(--oh-border)] bg-[var(--oh-surface-raised)] p-2 text-[var(--oh-foreground)]", T ? "items-start" : "items-center"),
+		F,
+		T,
+		g
+	]), /* @__PURE__ */ m("div", {
+		className: l("flex w-full gap-2 rounded-lg border border-[var(--oh-border)] bg-[var(--oh-surface-raised)] p-2 text-[var(--oh-foreground)]", D ? "items-start" : "items-center"),
 		"data-testid": "error-message-banner",
 		children: [
-			/* @__PURE__ */ f(i, {
+			x != null && x.kind !== "internal" && x.kind !== "unknown" ? /* @__PURE__ */ p(i, {
+				"aria-hidden": !0,
+				className: "h-4 w-4 shrink-0 text-[var(--oh-warning)]",
+				strokeWidth: 2,
+				"data-testid": "warning-message-banner-icon"
+			}) : /* @__PURE__ */ p(a, {
 				"aria-hidden": !0,
 				className: "h-4 w-4 shrink-0",
 				strokeWidth: 2,
-				style: { color: s },
+				style: { color: c },
 				"data-testid": "error-message-banner-icon"
 			}),
-			/* @__PURE__ */ p("div", {
+			/* @__PURE__ */ m("div", {
 				className: "min-w-0 flex-1",
 				children: [
-					S && /* @__PURE__ */ f("div", {
+					w && /* @__PURE__ */ p("div", {
 						className: "text-sm font-medium text-[var(--oh-foreground)]",
 						"data-testid": "error-message-banner-header",
-						children: b(S)
+						children: S(w)
 					}),
-					/* @__PURE__ */ f("div", {
-						ref: k,
-						className: c("whitespace-pre-wrap break-words text-sm text-[var(--oh-muted)]", N && "line-clamp-3"),
+					/* @__PURE__ */ p("div", {
+						ref: j,
+						className: l("whitespace-pre-wrap break-words text-sm text-[var(--oh-muted)]", F && "line-clamp-3"),
 						"data-testid": "error-message-banner-content",
-						children: A ? /* @__PURE__ */ f(e, {
+						children: M ? /* @__PURE__ */ p(e, {
 							ns: "openhands",
-							i18nKey: h
-						}) : h
+							i18nKey: g
+						}) : g
 					}),
-					y && /* @__PURE__ */ f("button", {
+					b && /* @__PURE__ */ p("button", {
 						type: "button",
-						onClick: y,
+						onClick: b,
 						className: "mt-2 cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]",
 						"data-testid": "error-message-banner-reauth",
-						children: b(n.ERROR$ACP_UPDATE_CREDENTIALS)
+						children: S(n.ERROR$ACP_UPDATE_CREDENTIALS)
 					}),
-					M && /* @__PURE__ */ f("button", {
+					P && /* @__PURE__ */ p("button", {
 						type: "button",
 						className: "mt-1 cursor-pointer text-xs font-normal text-[var(--oh-foreground)] underline",
-						onClick: () => w((e) => !e),
+						onClick: () => E((e) => !e),
 						"data-testid": "error-message-banner-toggle",
-						children: b(C ? n.COMMON$VIEW_LESS : n.COMMON$VIEW_MORE)
+						children: S(T ? n.COMMON$VIEW_LESS : n.COMMON$VIEW_MORE)
 					})
 				]
 			}),
-			/* @__PURE__ */ p("div", {
-				className: c("flex shrink-0 gap-1", T ? "self-start" : "items-center"),
+			/* @__PURE__ */ m("div", {
+				className: l("flex shrink-0 gap-1", D ? "self-start" : "items-center"),
 				children: [
-					v && /* @__PURE__ */ f("button", {
+					y && /* @__PURE__ */ p("button", {
 						type: "button",
-						onClick: v,
+						onClick: y,
 						className: "cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]",
 						"data-testid": "error-message-banner-retry",
-						children: b(n.CHAT_INTERFACE$MESSAGE_RETRY)
+						children: S(n.CHAT_INTERFACE$MESSAGE_RETRY)
 					}),
-					/* @__PURE__ */ f("button", {
+					/* @__PURE__ */ p("button", {
 						type: "button",
 						onClick: async () => {
 							try {
-								await navigator.clipboard.writeText(j), O(!0);
+								await navigator.clipboard.writeText(N), A(!0);
 							} catch {
-								l(b(n.CHAT_INTERFACE$CHAT_MESSAGE_COPY_FAILED));
+								u(S(n.CHAT_INTERFACE$CHAT_MESSAGE_COPY_FAILED));
 							}
 						},
 						className: "shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]",
-						"aria-label": b(D ? n.BUTTON$COPIED : n.BUTTON$COPY),
+						"aria-label": S(k ? n.BUTTON$COPIED : n.BUTTON$COPY),
 						"data-testid": "error-message-banner-copy",
-						children: f(D ? r : a, {
+						children: p(k ? r : o, {
 							className: "h-4 w-4",
 							"aria-hidden": !0
 						})
 					}),
-					_ && /* @__PURE__ */ f("button", {
+					v && /* @__PURE__ */ p("button", {
 						type: "button",
-						onClick: _,
+						onClick: v,
 						className: "shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]",
-						"aria-label": b(n.BUTTON$CLOSE),
+						"aria-label": S(n.BUTTON$CLOSE),
 						"data-testid": "error-message-banner-dismiss",
-						children: /* @__PURE__ */ f(o, {
+						children: /* @__PURE__ */ p(s, {
 							className: "h-4 w-4",
 							"aria-hidden": !0
 						})
@@ -130,6 +136,6 @@ function h({ message: h, code: g, onDismiss: _, onRetry: v, onReauth: y }) {
 	});
 }
 //#endregion
-export { h as ErrorMessageBanner };
+export { g as ErrorMessageBanner };
 
 //# sourceMappingURL=error-message-banner.js.map

package/dist/components/features/chat/error-message-banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"error-message-banner.js","names":[],"sources":["../../../../src/components/features/chat/error-message-banner.tsx"],"sourcesContent":["import React from \"react\";\nimport { Trans, useTranslation } from \"react-i18next\";\nimport { Check, CircleX, Copy, X } from \"lucide-react\";\nimport { OH_STATUS_ERROR_COLOR } from \"#/constants/status-colors\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { displayErrorToast } from \"#/utils/custom-toast-handlers\";\nimport { getAcpErrorHeaderKey } from \"#/utils/acp-error-codes\";\nimport { cn } from \"#/utils/utils\";\n\ninterface ErrorMessageBannerProps {\n  message: string;\n  /** Structured error code (e.g. \"ACPAuthRequired\") used to pick a header. */\n  code?: string | null;\n  onDismiss?: () => void;\n  onRetry?: () => void;\n  /** Recovery action (e.g. re-authenticate) shown for credential failures. */\n  onReauth?: () => void;\n}\n\nconst DEFAULT_MAX_COLLAPSED_CHARS = 220;\n\nexport function ErrorMessageBanner({\n  message,\n  code,\n  onDismiss,\n  onRetry,\n  onReauth,\n}: ErrorMessageBannerProps) {\n  const { t, i18n } = useTranslation(\"openhands\");\n  const headerKey = getAcpErrorHeaderKey(code);\n  const [isExpanded, setIsExpanded] = React.useState(false);\n  const [isMultiLine, setIsMultiLine] = React.useState(false);\n  const [isCopied, setIsCopied] = React.useState(false);\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const isI18nKey = i18n.exists(message, { ns: \"openhands\" });\n  const displayTextForLength = isI18nKey ? String(t(message)) : message;\n  const shouldShowToggle =\n    displayTextForLength.length > DEFAULT_MAX_COLLAPSED_CHARS;\n\n  const isCollapsed = shouldShowToggle && !isExpanded;\n\n  const handleCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(displayTextForLength);\n      setIsCopied(true);\n    } catch {\n      displayErrorToast(t(I18nKey.CHAT_INTERFACE$CHAT_MESSAGE_COPY_FAILED));\n    }\n  };\n\n  React.useEffect(() => {\n    if (!isCopied) return undefined;\n\n    const timeout = setTimeout(() => {\n      setIsCopied(false);\n    }, 2000);\n\n    return () => clearTimeout(timeout);\n  }, [isCopied]);\n\n  React.useEffect(() => {\n    setIsCopied(false);\n  }, [displayTextForLength]);\n\n  React.useLayoutEffect(() => {\n    const content = contentRef.current;\n    if (!content) {\n      return undefined;\n    }\n\n    const updateIsMultiLine = () => {\n      const lineHeight = Number.parseFloat(\n        getComputedStyle(content).lineHeight,\n      );\n      if (!Number.isFinite(lineHeight) || lineHeight <= 0) {\n        setIsMultiLine(false);\n        return;\n      }\n\n      setIsMultiLine(content.getBoundingClientRect().height > lineHeight * 1.5);\n    };\n\n    updateIsMultiLine();\n\n    const observer = new ResizeObserver(updateIsMultiLine);\n    observer.observe(content);\n\n    return () => observer.disconnect();\n  }, [displayTextForLength, isCollapsed, isExpanded, message]);\n\n  return (\n    <div\n      className={cn(\n        \"flex w-full gap-2 rounded-lg border border-[var(--oh-border)] bg-[var(--oh-surface-raised)] p-2 text-[var(--oh-foreground)]\",\n        isMultiLine ? \"items-start\" : \"items-center\",\n      )}\n      data-testid=\"error-message-banner\"\n    >\n      <CircleX\n        aria-hidden\n        className=\"h-4 w-4 shrink-0\"\n        strokeWidth={2}\n        style={{ color: OH_STATUS_ERROR_COLOR }}\n        data-testid=\"error-message-banner-icon\"\n      />\n      <div className=\"min-w-0 flex-1\">\n        {headerKey && (\n          <div\n            className=\"text-sm font-medium text-[var(--oh-foreground)]\"\n            data-testid=\"error-message-banner-header\"\n          >\n            {t(headerKey)}\n          </div>\n        )}\n        <div\n          ref={contentRef}\n          className={cn(\n            \"whitespace-pre-wrap break-words text-sm text-[var(--oh-muted)]\",\n            isCollapsed && \"line-clamp-3\",\n          )}\n          data-testid=\"error-message-banner-content\"\n        >\n          {isI18nKey ? <Trans ns=\"openhands\" i18nKey={message} /> : message}\n        </div>\n\n        {onReauth && (\n          <button\n            type=\"button\"\n            onClick={onReauth}\n            className=\"mt-2 cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]\"\n            data-testid=\"error-message-banner-reauth\"\n          >\n            {t(I18nKey.ERROR$ACP_UPDATE_CREDENTIALS)}\n          </button>\n        )}\n\n        {shouldShowToggle && (\n          <button\n            type=\"button\"\n            className=\"mt-1 cursor-pointer text-xs font-normal text-[var(--oh-foreground)] underline\"\n            onClick={() => setIsExpanded((prev) => !prev)}\n            data-testid=\"error-message-banner-toggle\"\n          >\n            {isExpanded\n              ? t(I18nKey.COMMON$VIEW_LESS)\n              : t(I18nKey.COMMON$VIEW_MORE)}\n          </button>\n        )}\n      </div>\n\n      <div\n        className={cn(\n          \"flex shrink-0 gap-1\",\n          isMultiLine ? \"self-start\" : \"items-center\",\n        )}\n      >\n        {onRetry && (\n          <button\n            type=\"button\"\n            onClick={onRetry}\n            className=\"cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]\"\n            data-testid=\"error-message-banner-retry\"\n          >\n            {t(I18nKey.CHAT_INTERFACE$MESSAGE_RETRY)}\n          </button>\n        )}\n\n        <button\n          type=\"button\"\n          onClick={handleCopy}\n          className=\"shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]\"\n          aria-label={t(isCopied ? I18nKey.BUTTON$COPIED : I18nKey.BUTTON$COPY)}\n          data-testid=\"error-message-banner-copy\"\n        >\n          {isCopied ? (\n            <Check className=\"h-4 w-4\" aria-hidden />\n          ) : (\n            <Copy className=\"h-4 w-4\" aria-hidden />\n          )}\n        </button>\n\n        {onDismiss && (\n          <button\n            type=\"button\"\n            onClick={onDismiss}\n            className=\"shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]\"\n            aria-label={t(I18nKey.BUTTON$CLOSE)}\n            data-testid=\"error-message-banner-dismiss\"\n          >\n            <X className=\"h-4 w-4\" aria-hidden />\n          </button>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"error-message-banner.js","names":[],"sources":["../../../../src/components/features/chat/error-message-banner.tsx"],"sourcesContent":["import React from \"react\";\nimport { Trans, useTranslation } from \"react-i18next\";\nimport { Check, CircleAlert, CircleX, Copy, X } from \"lucide-react\";\nimport { OH_STATUS_ERROR_COLOR } from \"#/constants/status-colors\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { displayErrorToast } from \"#/utils/custom-toast-handlers\";\nimport { getAcpErrorHeaderKey } from \"#/utils/acp-error-codes\";\nimport { cn } from \"#/utils/utils\";\nimport type { ErrorClassification } from \"@openhands/typescript-client\";\n\ninterface ErrorMessageBannerProps {\n  message: string;\n  /** Structured error code (e.g. \"ACPAuthRequired\") used to pick a header. */\n  code?: string | null;\n  onDismiss?: () => void;\n  onRetry?: () => void;\n  /** Recovery action (e.g. re-authenticate) shown for credential failures. */\n  onReauth?: () => void;\n  classification?: ErrorClassification | null;\n}\n\nconst DEFAULT_MAX_COLLAPSED_CHARS = 220;\n\nexport function ErrorMessageBanner({\n  message,\n  code,\n  onDismiss,\n  onRetry,\n  onReauth,\n  classification,\n}: ErrorMessageBannerProps) {\n  const { t, i18n } = useTranslation(\"openhands\");\n  const headerKey = getAcpErrorHeaderKey(code);\n  const [isExpanded, setIsExpanded] = React.useState(false);\n  const [isMultiLine, setIsMultiLine] = React.useState(false);\n  const [isCopied, setIsCopied] = React.useState(false);\n  const contentRef = React.useRef<HTMLDivElement>(null);\n\n  const isI18nKey = i18n.exists(message, { ns: \"openhands\" });\n  const displayTextForLength = isI18nKey ? String(t(message)) : message;\n  const shouldShowToggle =\n    displayTextForLength.length > DEFAULT_MAX_COLLAPSED_CHARS;\n\n  const isCollapsed = shouldShowToggle && !isExpanded;\n\n  const handleCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(displayTextForLength);\n      setIsCopied(true);\n    } catch {\n      displayErrorToast(t(I18nKey.CHAT_INTERFACE$CHAT_MESSAGE_COPY_FAILED));\n    }\n  };\n\n  React.useEffect(() => {\n    if (!isCopied) return undefined;\n\n    const timeout = setTimeout(() => {\n      setIsCopied(false);\n    }, 2000);\n\n    return () => clearTimeout(timeout);\n  }, [isCopied]);\n\n  React.useEffect(() => {\n    setIsCopied(false);\n  }, [displayTextForLength]);\n\n  React.useLayoutEffect(() => {\n    const content = contentRef.current;\n    if (!content) {\n      return undefined;\n    }\n\n    const updateIsMultiLine = () => {\n      const lineHeight = Number.parseFloat(\n        getComputedStyle(content).lineHeight,\n      );\n      if (!Number.isFinite(lineHeight) || lineHeight <= 0) {\n        setIsMultiLine(false);\n        return;\n      }\n\n      setIsMultiLine(content.getBoundingClientRect().height > lineHeight * 1.5);\n    };\n\n    updateIsMultiLine();\n\n    const observer = new ResizeObserver(updateIsMultiLine);\n    observer.observe(content);\n\n    return () => observer.disconnect();\n  }, [displayTextForLength, isCollapsed, isExpanded, message]);\n\n  return (\n    <div\n      className={cn(\n        \"flex w-full gap-2 rounded-lg border border-[var(--oh-border)] bg-[var(--oh-surface-raised)] p-2 text-[var(--oh-foreground)]\",\n        isMultiLine ? \"items-start\" : \"items-center\",\n      )}\n      data-testid=\"error-message-banner\"\n    >\n      {classification != null &&\n      classification.kind !== \"internal\" &&\n      classification.kind !== \"unknown\" ? (\n        <CircleAlert\n          aria-hidden\n          className=\"h-4 w-4 shrink-0 text-[var(--oh-warning)]\"\n          strokeWidth={2}\n          data-testid=\"warning-message-banner-icon\"\n        />\n      ) : (\n        <CircleX\n          aria-hidden\n          className=\"h-4 w-4 shrink-0\"\n          strokeWidth={2}\n          style={{ color: OH_STATUS_ERROR_COLOR }}\n          data-testid=\"error-message-banner-icon\"\n        />\n      )}\n      <div className=\"min-w-0 flex-1\">\n        {headerKey && (\n          <div\n            className=\"text-sm font-medium text-[var(--oh-foreground)]\"\n            data-testid=\"error-message-banner-header\"\n          >\n            {t(headerKey)}\n          </div>\n        )}\n        <div\n          ref={contentRef}\n          className={cn(\n            \"whitespace-pre-wrap break-words text-sm text-[var(--oh-muted)]\",\n            isCollapsed && \"line-clamp-3\",\n          )}\n          data-testid=\"error-message-banner-content\"\n        >\n          {isI18nKey ? <Trans ns=\"openhands\" i18nKey={message} /> : message}\n        </div>\n\n        {onReauth && (\n          <button\n            type=\"button\"\n            onClick={onReauth}\n            className=\"mt-2 cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]\"\n            data-testid=\"error-message-banner-reauth\"\n          >\n            {t(I18nKey.ERROR$ACP_UPDATE_CREDENTIALS)}\n          </button>\n        )}\n\n        {shouldShowToggle && (\n          <button\n            type=\"button\"\n            className=\"mt-1 cursor-pointer text-xs font-normal text-[var(--oh-foreground)] underline\"\n            onClick={() => setIsExpanded((prev) => !prev)}\n            data-testid=\"error-message-banner-toggle\"\n          >\n            {isExpanded\n              ? t(I18nKey.COMMON$VIEW_LESS)\n              : t(I18nKey.COMMON$VIEW_MORE)}\n          </button>\n        )}\n      </div>\n\n      <div\n        className={cn(\n          \"flex shrink-0 gap-1\",\n          isMultiLine ? \"self-start\" : \"items-center\",\n        )}\n      >\n        {onRetry && (\n          <button\n            type=\"button\"\n            onClick={onRetry}\n            className=\"cursor-pointer rounded-md border border-[var(--oh-border)] px-2 py-1 text-xs font-normal text-[var(--oh-foreground)] hover:bg-[var(--oh-interactive-hover)]\"\n            data-testid=\"error-message-banner-retry\"\n          >\n            {t(I18nKey.CHAT_INTERFACE$MESSAGE_RETRY)}\n          </button>\n        )}\n\n        <button\n          type=\"button\"\n          onClick={handleCopy}\n          className=\"shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]\"\n          aria-label={t(isCopied ? I18nKey.BUTTON$COPIED : I18nKey.BUTTON$COPY)}\n          data-testid=\"error-message-banner-copy\"\n        >\n          {isCopied ? (\n            <Check className=\"h-4 w-4\" aria-hidden />\n          ) : (\n            <Copy className=\"h-4 w-4\" aria-hidden />\n          )}\n        </button>\n\n        {onDismiss && (\n          <button\n            type=\"button\"\n            onClick={onDismiss}\n            className=\"shrink-0 cursor-pointer rounded-md p-1 text-[var(--oh-muted)] hover:bg-[var(--oh-interactive-hover)] hover:text-[var(--oh-foreground)]\"\n            aria-label={t(I18nKey.BUTTON$CLOSE)}\n            data-testid=\"error-message-banner-dismiss\"\n          >\n            <X className=\"h-4 w-4\" aria-hidden />\n          </button>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAqBA,IAAM,IAA8B;AAEpC,SAAgB,EAAmB,EACjC,YACA,SACA,cACA,YACA,aACA,qBAC0B;CAC1B,IAAM,EAAE,MAAG,YAAS,EAAe,WAAW,GACxC,IAAY,EAAqB,CAAI,GACrC,CAAC,GAAY,KAAiB,EAAM,SAAS,EAAK,GAClD,CAAC,GAAa,KAAkB,EAAM,SAAS,EAAK,GACpD,CAAC,GAAU,KAAe,EAAM,SAAS,EAAK,GAC9C,IAAa,EAAM,OAAuB,IAAI,GAE9C,IAAY,EAAK,OAAO,GAAS,EAAE,IAAI,YAAY,CAAC,GACpD,IAAuB,IAAY,OAAO,EAAE,CAAO,CAAC,IAAI,GACxD,IACJ,EAAqB,SAAS,GAE1B,IAAc,KAAoB,CAAC;CAmDzC,OAxCA,EAAM,gBAAgB;EACpB,IAAI,CAAC,GAAU;EAEf,IAAM,IAAU,iBAAiB;GAC/B,EAAY,EAAK;EACnB,GAAG,GAAI;EAEP,aAAa,aAAa,CAAO;CACnC,GAAG,CAAC,CAAQ,CAAC,GAEb,EAAM,gBAAgB;EACpB,EAAY,EAAK;CACnB,GAAG,CAAC,CAAoB,CAAC,GAEzB,EAAM,sBAAsB;EAC1B,IAAM,IAAU,EAAW;EAC3B,IAAI,CAAC,GACH;EAGF,IAAM,UAA0B;GAC9B,IAAM,IAAa,OAAO,WACxB,iBAAiB,CAAO,EAAE,UAC5B;GACA,IAAI,CAAC,OAAO,SAAS,CAAU,KAAK,KAAc,GAAG;IACnD,EAAe,EAAK;IACpB;GACF;GAEA,EAAe,EAAQ,sBAAsB,EAAE,SAAS,IAAa,GAAG;EAC1E;EAEA,EAAkB;EAElB,IAAM,IAAW,IAAI,eAAe,CAAiB;EAGrD,OAFA,EAAS,QAAQ,CAAO,SAEX,EAAS,WAAW;CACnC,GAAG;EAAC;EAAsB;EAAa;EAAY;CAAO,CAAC,GAGzD,kBAAC,OAAD;EACE,WAAW,EACT,+HACA,IAAc,gBAAgB,cAChC;EACA,eAAY;YALd;GAOG,KAAkB,QACnB,EAAe,SAAS,cACxB,EAAe,SAAS,YACtB,kBAAC,GAAD;IACE,eAAA;IACA,WAAU;IACV,aAAa;IACb,eAAY;GACb,CAAA,IAED,kBAAC,GAAD;IACE,eAAA;IACA,WAAU;IACV,aAAa;IACb,OAAO,EAAE,OAAO,EAAsB;IACtC,eAAY;GACb,CAAA;GAEH,kBAAC,OAAD;IAAK,WAAU;cAAf;KACG,KACC,kBAAC,OAAD;MACE,WAAU;MACV,eAAY;gBAEX,EAAE,CAAS;KACT,CAAA;KAEP,kBAAC,OAAD;MACE,KAAK;MACL,WAAW,EACT,kEACA,KAAe,cACjB;MACA,eAAY;gBAEX,IAAY,kBAAC,GAAD;OAAO,IAAG;OAAY,SAAS;MAAU,CAAA,IAAI;KACvD,CAAA;KAEJ,KACC,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAU;MACV,eAAY;gBAEX,EAAE,EAAQ,4BAA4B;KACjC,CAAA;KAGT,KACC,kBAAC,UAAD;MACE,MAAK;MACL,WAAU;MACV,eAAe,GAAe,MAAS,CAAC,CAAI;MAC5C,eAAY;gBAGR,EADH,IACK,EAAQ,mBACR,EAAQ,gBAAgB;KACxB,CAAA;IAEP;;GAEL,kBAAC,OAAD;IACE,WAAW,EACT,uBACA,IAAc,eAAe,cAC/B;cAJF;KAMG,KACC,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAU;MACV,eAAY;gBAEX,EAAE,EAAQ,4BAA4B;KACjC,CAAA;KAGV,kBAAC,UAAD;MACE,MAAK;MACL,SAAS,YA3Ic;OAC7B,IAAI;QAEF,AADA,MAAM,UAAU,UAAU,UAAU,CAAoB,GACxD,EAAY,EAAI;OAClB,QAAQ;QACN,EAAkB,EAAE,EAAQ,uCAAuC,CAAC;OACtE;MACF;MAqIQ,WAAU;MACV,cAAY,EAAE,IAAW,EAAQ,gBAAgB,EAAQ,WAAW;MACpE,eAAY;gBAGV,EADD,IACE,IAEA,GAFD;OAAO,WAAU;OAAU,eAAA;MAAa,CAED;KAEnC,CAAA;KAEP,KACC,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAU;MACV,cAAY,EAAE,EAAQ,YAAY;MAClC,eAAY;gBAEZ,kBAAC,GAAD;OAAG,WAAU;OAAU,eAAA;MAAa,CAAA;KAC9B,CAAA;IAEP;;EACF;;AAET"}

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

@@ -18,10 +18,11 @@ export type CommandMenuItemId = "new-chat" | "customize" | "automations" | "mcp"
 export interface CommandMenuItemDefinition {
     id: CommandMenuItemId;
     group: CommandMenuGroupId;
-    titleKey: I18nKey;
-    descriptionKey: I18nKey;
-    keywordsKey: I18nKey;
-    /** Literal copy overriding the i18n key, when a manifest owns it. */
+    /** Absent on an item whose copy a manifest owns, which sets the literal. */
+    titleKey?: I18nKey;
+    descriptionKey?: I18nKey;
+    keywordsKey?: I18nKey;
+    /** Literal copy, for an item a manifest owns. */
     title?: string;
     description?: string;
     keywords?: string;
@@ -29,6 +30,11 @@ export interface CommandMenuItemDefinition {
     to?: string;
     perform?: () => void;
 }
+/**
+ * An item's copy: its literal when a manifest owns the item, its translation
+ * otherwise.
+ */
+export declare function commandMenuItemCopy(literal: string | undefined, key: I18nKey | undefined, translate: (key: I18nKey) => string): string;
 export declare const COMMAND_MENU_GROUP_LABELS: Record<CommandMenuGroupId, I18nKey>;
 export declare const COMMAND_MENU_GROUP_ORDER: CommandMenuGroupId[];
 export declare const createCommandMenuItems: ({ toggleSidebar, }: {

package/dist/components/features/conversation/conversation-git-actions-menu.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/git-commit-horizontal.cjs"),i=require("../../../utils/utils.cjs"),a=require("../../../stores/conversation-store.cjs"),o=require("../../../ui/context-menu.cjs"),s=require("../context-menu/context-menu-list-item.cjs"),c=require("../../../hooks/use-click-outside-element.cjs"),l=require("../../../icons/u-code-branch.cjs"),u=require("../controls/tools-context-menu-icon-text.cjs"),d=require("../../../icons/u-arrow-up.cjs"),f=require("../../../icons/u-arrow-down.cjs"),p=require("../../../icons/u-pr.cjs");let m=require("react");m=e.__toESM(m,1);let h=require("react/jsx-runtime"),g=require("react-dom");g=e.__toESM(g,1);var _=`!w-auto whitespace-nowrap`;function v({anchorRef:e,onClose:v,gitProvider:y,testIdPrefix:b=`conversation-git-actions`}){let{t:x}=t.useTranslation(`openhands`),S=c.useClickOutsideElement(v),C=a.useConversationStore(e=>e.setMessageToSend),[w,T]=(0,m.useState)();return(0,m.useLayoutEffect)(()=>{let t=e.current;if(!t)return;let n=()=>{let e=t.getBoundingClientRect();T({position:`fixed`,top:e.bottom+4,right:window.innerWidth-e.right,zIndex:50})};return n(),window.addEventListener(`resize`,n),window.addEventListener(`scroll`,n,!0),()=>{window.removeEventListener(`resize`,n),window.removeEventListener(`scroll`,n,!0)}},[e]),w?g.default.createPortal((0,h.jsxs)(o.ContextMenu,{ref:S,testId:`${b}-menu`,theme:`popover`,style:w,className:`w-max min-w-[8rem]`,children:[(0,h.jsx)(s.ContextMenuListItem,{testId:`${b}-commit`,onClick:()=>{C(i.getGitCommitPrompt()),v()},className:_,children:(0,h.jsx)(u.ToolsContextMenuIconText,{icon:(0,h.jsx)(r.GitCommitHorizontal,{className:`size-4`,"aria-hidden":!0}),text:x(n.I18nKey.DIFF_VIEWER$COMMITS)})}),(0,h.jsx)(s.ContextMenuListItem,{testId:`${b}-pull`,onClick:()=>{C(i.getGitPullPrompt()),v()},className:_,children:(0,h.jsx)(u.ToolsContextMenuIconText,{icon:(0,h.jsx)(f.default,{width:16,height:16,"aria-hidden":!0}),text:x(n.I18nKey.COMMON$PULL)})}),(0,h.jsx)(s.ContextMenuListItem,{testId:`${b}-push`,onClick:()=>{C(i.getGitPushPrompt(y)),v()},className:_,children:(0,h.jsx)(u.ToolsContextMenuIconText,{icon:(0,h.jsx)(d.default,{width:16,height:16,"aria-hidden":!0}),text:x(n.I18nKey.COMMON$PUSH)})}),(0,h.jsx)(s.ContextMenuListItem,{testId:`${b}-create-pr`,onClick:()=>{C(i.getCreatePRPrompt(y)),v()},className:_,children:(0,h.jsx)(u.ToolsContextMenuIconText,{icon:(0,h.jsx)(p.default,{width:16,height:16,"aria-hidden":!0}),text:x(n.I18nKey.COMMON$CREATE_PR)})}),(0,h.jsx)(s.ContextMenuListItem,{testId:`${b}-create-new-branch`,onClick:()=>{C(i.getCreateNewBranchPrompt()),v()},className:_,children:(0,h.jsx)(u.ToolsContextMenuIconText,{icon:(0,h.jsx)(l.default,{width:16,height:16,"aria-hidden":!0}),text:x(n.I18nKey.COMMON$CREATE_NEW_BRANCH)})})]}),document.body):null}exports.ConversationGitActionsMenu=v;
+//# sourceMappingURL=conversation-git-actions-menu.cjs.map

package/dist/components/features/conversation/conversation-git-actions-menu.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation-git-actions-menu.cjs","names":[],"sources":["../../../../src/components/features/conversation/conversation-git-actions-menu.tsx"],"sourcesContent":["import React, { useLayoutEffect, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { GitCommitHorizontal } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport ArrowDownIcon from \"#/icons/u-arrow-down.svg?react\";\nimport ArrowUpIcon from \"#/icons/u-arrow-up.svg?react\";\nimport CodeBranchIcon from \"#/icons/u-code-branch.svg?react\";\nimport PrIcon from \"#/icons/u-pr.svg?react\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { ContextMenuListItem } from \"#/components/features/context-menu/context-menu-list-item\";\nimport { ToolsContextMenuIconText } from \"#/components/features/controls/tools-context-menu-icon-text\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport {\n  getCreateNewBranchPrompt,\n  getCreatePRPrompt,\n  getGitCommitPrompt,\n  getGitPullPrompt,\n  getGitPushPrompt,\n} from \"#/utils/utils\";\nimport { Provider } from \"#/types/settings\";\n\nconst GIT_MENU_ITEM_CLASSNAME = \"!w-auto whitespace-nowrap\";\n\ninterface ConversationGitActionsMenuProps {\n  anchorRef: React.RefObject<HTMLButtonElement | null>;\n  onClose: () => void;\n  gitProvider: Provider;\n  /** Prefix for menu/item `data-testid` values (suffixes: -menu, -commit, …). */\n  testIdPrefix?: string;\n}\n\n/**\n * Portaled dropdown of agent-prompt git actions (commit, pull, push, PR, branch).\n * Anchored under a trigger; shared by the overview diffs row and header toggle.\n */\nexport function ConversationGitActionsMenu({\n  anchorRef,\n  onClose,\n  gitProvider,\n  testIdPrefix = \"conversation-git-actions\",\n}: ConversationGitActionsMenuProps) {\n  const { t } = useTranslation(\"openhands\");\n  const menuRef = useClickOutsideElement<HTMLUListElement>(onClose);\n  const setMessageToSend = useConversationStore(\n    (state) => state.setMessageToSend,\n  );\n  const [portalStyle, setPortalStyle] = useState<React.CSSProperties>();\n\n  useLayoutEffect(() => {\n    const anchor = anchorRef.current;\n    if (!anchor) {\n      return undefined;\n    }\n\n    const updatePosition = () => {\n      const rect = anchor.getBoundingClientRect();\n      setPortalStyle({\n        position: \"fixed\",\n        top: rect.bottom + 4,\n        right: window.innerWidth - rect.right,\n        zIndex: 50,\n      });\n    };\n\n    updatePosition();\n    window.addEventListener(\"resize\", updatePosition);\n    window.addEventListener(\"scroll\", updatePosition, true);\n    return () => {\n      window.removeEventListener(\"resize\", updatePosition);\n      window.removeEventListener(\"scroll\", updatePosition, true);\n    };\n  }, [anchorRef]);\n\n  const handleCommit = () => {\n    setMessageToSend(getGitCommitPrompt());\n    onClose();\n  };\n\n  const handlePull = () => {\n    setMessageToSend(getGitPullPrompt());\n    onClose();\n  };\n\n  const handlePush = () => {\n    setMessageToSend(getGitPushPrompt(gitProvider));\n    onClose();\n  };\n\n  const handleCreatePr = () => {\n    setMessageToSend(getCreatePRPrompt(gitProvider));\n    onClose();\n  };\n\n  const handleCreateNewBranch = () => {\n    setMessageToSend(getCreateNewBranchPrompt());\n    onClose();\n  };\n\n  if (!portalStyle) {\n    return null;\n  }\n\n  return ReactDOM.createPortal(\n    <ContextMenu\n      ref={menuRef}\n      testId={`${testIdPrefix}-menu`}\n      theme=\"popover\"\n      style={portalStyle}\n      className=\"w-max min-w-[8rem]\"\n    >\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-commit`}\n        onClick={handleCommit}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<GitCommitHorizontal className=\"size-4\" aria-hidden />}\n          text={t(I18nKey.DIFF_VIEWER$COMMITS)}\n        />\n      </ContextMenuListItem>\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-pull`}\n        onClick={handlePull}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<ArrowDownIcon width={16} height={16} aria-hidden />}\n          text={t(I18nKey.COMMON$PULL)}\n        />\n      </ContextMenuListItem>\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-push`}\n        onClick={handlePush}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<ArrowUpIcon width={16} height={16} aria-hidden />}\n          text={t(I18nKey.COMMON$PUSH)}\n        />\n      </ContextMenuListItem>\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-create-pr`}\n        onClick={handleCreatePr}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<PrIcon width={16} height={16} aria-hidden />}\n          text={t(I18nKey.COMMON$CREATE_PR)}\n        />\n      </ContextMenuListItem>\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-create-new-branch`}\n        onClick={handleCreateNewBranch}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<CodeBranchIcon width={16} height={16} aria-hidden />}\n          text={t(I18nKey.COMMON$CREATE_NEW_BRANCH)}\n        />\n      </ContextMenuListItem>\n    </ContextMenu>,\n    document.body,\n  );\n}\n"],"mappings":"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"}

package/dist/components/features/conversation/conversation-git-actions-menu.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { Provider } from "#/types/settings";
+interface ConversationGitActionsMenuProps {
+    anchorRef: React.RefObject<HTMLButtonElement | null>;
+    onClose: () => void;
+    gitProvider: Provider;
+    /** Prefix for menu/item `data-testid` values (suffixes: -menu, -commit, …). */
+    testIdPrefix?: string;
+}
+/**
+ * Portaled dropdown of agent-prompt git actions (commit, pull, push, PR, branch).
+ * Anchored under a trigger; shared by the overview diffs row and header toggle.
+ */
+export declare function ConversationGitActionsMenu({ anchorRef, onClose, gitProvider, testIdPrefix, }: ConversationGitActionsMenuProps): React.ReactPortal | null;
+export {};

package/dist/components/features/conversation/conversation-git-actions-menu.js

@@ -0,0 +1,123 @@
+import { useTranslation as e } from "../../../node_modules/react-i18next/dist/es/useTranslation.js";
+import { I18nKey as t } from "../../../i18n/declaration.js";
+import { GitCommitHorizontal as n } from "../../../node_modules/lucide-react/dist/esm/icons/git-commit-horizontal.js";
+import { getCreateNewBranchPrompt as r, getCreatePRPrompt as i, getGitCommitPrompt as a, getGitPullPrompt as o, getGitPushPrompt as s } from "../../../utils/utils.js";
+import { useConversationStore as c } from "../../../stores/conversation-store.js";
+import { ContextMenu as l } from "../../../ui/context-menu.js";
+import { ContextMenuListItem as u } from "../context-menu/context-menu-list-item.js";
+import { useClickOutsideElement as d } from "../../../hooks/use-click-outside-element.js";
+import f from "../../../icons/u-code-branch.js";
+import { ToolsContextMenuIconText as p } from "../controls/tools-context-menu-icon-text.js";
+import m from "../../../icons/u-arrow-up.js";
+import h from "../../../icons/u-arrow-down.js";
+import g from "../../../icons/u-pr.js";
+import { useLayoutEffect as _, useState as v } from "react";
+import { jsx as y, jsxs as b } from "react/jsx-runtime";
+import x from "react-dom";
+//#region src/components/features/conversation/conversation-git-actions-menu.tsx
+var S = "!w-auto whitespace-nowrap";
+function C({ anchorRef: C, onClose: w, gitProvider: T, testIdPrefix: E = "conversation-git-actions" }) {
+	let { t: D } = e("openhands"), O = d(w), k = c((e) => e.setMessageToSend), [A, j] = v();
+	return _(() => {
+		let e = C.current;
+		if (!e) return;
+		let t = () => {
+			let t = e.getBoundingClientRect();
+			j({
+				position: "fixed",
+				top: t.bottom + 4,
+				right: window.innerWidth - t.right,
+				zIndex: 50
+			});
+		};
+		return t(), window.addEventListener("resize", t), window.addEventListener("scroll", t, !0), () => {
+			window.removeEventListener("resize", t), window.removeEventListener("scroll", t, !0);
+		};
+	}, [C]), A ? x.createPortal(/* @__PURE__ */ b(l, {
+		ref: O,
+		testId: `${E}-menu`,
+		theme: "popover",
+		style: A,
+		className: "w-max min-w-[8rem]",
+		children: [
+			/* @__PURE__ */ y(u, {
+				testId: `${E}-commit`,
+				onClick: () => {
+					k(a()), w();
+				},
+				className: S,
+				children: /* @__PURE__ */ y(p, {
+					icon: /* @__PURE__ */ y(n, {
+						className: "size-4",
+						"aria-hidden": !0
+					}),
+					text: D(t.DIFF_VIEWER$COMMITS)
+				})
+			}),
+			/* @__PURE__ */ y(u, {
+				testId: `${E}-pull`,
+				onClick: () => {
+					k(o()), w();
+				},
+				className: S,
+				children: /* @__PURE__ */ y(p, {
+					icon: /* @__PURE__ */ y(h, {
+						width: 16,
+						height: 16,
+						"aria-hidden": !0
+					}),
+					text: D(t.COMMON$PULL)
+				})
+			}),
+			/* @__PURE__ */ y(u, {
+				testId: `${E}-push`,
+				onClick: () => {
+					k(s(T)), w();
+				},
+				className: S,
+				children: /* @__PURE__ */ y(p, {
+					icon: /* @__PURE__ */ y(m, {
+						width: 16,
+						height: 16,
+						"aria-hidden": !0
+					}),
+					text: D(t.COMMON$PUSH)
+				})
+			}),
+			/* @__PURE__ */ y(u, {
+				testId: `${E}-create-pr`,
+				onClick: () => {
+					k(i(T)), w();
+				},
+				className: S,
+				children: /* @__PURE__ */ y(p, {
+					icon: /* @__PURE__ */ y(g, {
+						width: 16,
+						height: 16,
+						"aria-hidden": !0
+					}),
+					text: D(t.COMMON$CREATE_PR)
+				})
+			}),
+			/* @__PURE__ */ y(u, {
+				testId: `${E}-create-new-branch`,
+				onClick: () => {
+					k(r()), w();
+				},
+				className: S,
+				children: /* @__PURE__ */ y(p, {
+					icon: /* @__PURE__ */ y(f, {
+						width: 16,
+						height: 16,
+						"aria-hidden": !0
+					}),
+					text: D(t.COMMON$CREATE_NEW_BRANCH)
+				})
+			})
+		]
+	}), document.body) : null;
+}
+//#endregion
+export { C as ConversationGitActionsMenu };
+
+//# sourceMappingURL=conversation-git-actions-menu.js.map

package/dist/components/features/conversation/conversation-git-actions-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation-git-actions-menu.js","names":[],"sources":["../../../../src/components/features/conversation/conversation-git-actions-menu.tsx"],"sourcesContent":["import React, { useLayoutEffect, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { GitCommitHorizontal } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport ArrowDownIcon from \"#/icons/u-arrow-down.svg?react\";\nimport ArrowUpIcon from \"#/icons/u-arrow-up.svg?react\";\nimport CodeBranchIcon from \"#/icons/u-code-branch.svg?react\";\nimport PrIcon from \"#/icons/u-pr.svg?react\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { useConversationStore } from \"#/stores/conversation-store\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { ContextMenuListItem } from \"#/components/features/context-menu/context-menu-list-item\";\nimport { ToolsContextMenuIconText } from \"#/components/features/controls/tools-context-menu-icon-text\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport {\n  getCreateNewBranchPrompt,\n  getCreatePRPrompt,\n  getGitCommitPrompt,\n  getGitPullPrompt,\n  getGitPushPrompt,\n} from \"#/utils/utils\";\nimport { Provider } from \"#/types/settings\";\n\nconst GIT_MENU_ITEM_CLASSNAME = \"!w-auto whitespace-nowrap\";\n\ninterface ConversationGitActionsMenuProps {\n  anchorRef: React.RefObject<HTMLButtonElement | null>;\n  onClose: () => void;\n  gitProvider: Provider;\n  /** Prefix for menu/item `data-testid` values (suffixes: -menu, -commit, …). */\n  testIdPrefix?: string;\n}\n\n/**\n * Portaled dropdown of agent-prompt git actions (commit, pull, push, PR, branch).\n * Anchored under a trigger; shared by the overview diffs row and header toggle.\n */\nexport function ConversationGitActionsMenu({\n  anchorRef,\n  onClose,\n  gitProvider,\n  testIdPrefix = \"conversation-git-actions\",\n}: ConversationGitActionsMenuProps) {\n  const { t } = useTranslation(\"openhands\");\n  const menuRef = useClickOutsideElement<HTMLUListElement>(onClose);\n  const setMessageToSend = useConversationStore(\n    (state) => state.setMessageToSend,\n  );\n  const [portalStyle, setPortalStyle] = useState<React.CSSProperties>();\n\n  useLayoutEffect(() => {\n    const anchor = anchorRef.current;\n    if (!anchor) {\n      return undefined;\n    }\n\n    const updatePosition = () => {\n      const rect = anchor.getBoundingClientRect();\n      setPortalStyle({\n        position: \"fixed\",\n        top: rect.bottom + 4,\n        right: window.innerWidth - rect.right,\n        zIndex: 50,\n      });\n    };\n\n    updatePosition();\n    window.addEventListener(\"resize\", updatePosition);\n    window.addEventListener(\"scroll\", updatePosition, true);\n    return () => {\n      window.removeEventListener(\"resize\", updatePosition);\n      window.removeEventListener(\"scroll\", updatePosition, true);\n    };\n  }, [anchorRef]);\n\n  const handleCommit = () => {\n    setMessageToSend(getGitCommitPrompt());\n    onClose();\n  };\n\n  const handlePull = () => {\n    setMessageToSend(getGitPullPrompt());\n    onClose();\n  };\n\n  const handlePush = () => {\n    setMessageToSend(getGitPushPrompt(gitProvider));\n    onClose();\n  };\n\n  const handleCreatePr = () => {\n    setMessageToSend(getCreatePRPrompt(gitProvider));\n    onClose();\n  };\n\n  const handleCreateNewBranch = () => {\n    setMessageToSend(getCreateNewBranchPrompt());\n    onClose();\n  };\n\n  if (!portalStyle) {\n    return null;\n  }\n\n  return ReactDOM.createPortal(\n    <ContextMenu\n      ref={menuRef}\n      testId={`${testIdPrefix}-menu`}\n      theme=\"popover\"\n      style={portalStyle}\n      className=\"w-max min-w-[8rem]\"\n    >\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-commit`}\n        onClick={handleCommit}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<GitCommitHorizontal className=\"size-4\" aria-hidden />}\n          text={t(I18nKey.DIFF_VIEWER$COMMITS)}\n        />\n      </ContextMenuListItem>\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-pull`}\n        onClick={handlePull}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<ArrowDownIcon width={16} height={16} aria-hidden />}\n          text={t(I18nKey.COMMON$PULL)}\n        />\n      </ContextMenuListItem>\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-push`}\n        onClick={handlePush}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<ArrowUpIcon width={16} height={16} aria-hidden />}\n          text={t(I18nKey.COMMON$PUSH)}\n        />\n      </ContextMenuListItem>\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-create-pr`}\n        onClick={handleCreatePr}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<PrIcon width={16} height={16} aria-hidden />}\n          text={t(I18nKey.COMMON$CREATE_PR)}\n        />\n      </ContextMenuListItem>\n      <ContextMenuListItem\n        testId={`${testIdPrefix}-create-new-branch`}\n        onClick={handleCreateNewBranch}\n        className={GIT_MENU_ITEM_CLASSNAME}\n      >\n        <ToolsContextMenuIconText\n          icon={<CodeBranchIcon width={16} height={16} aria-hidden />}\n          text={t(I18nKey.COMMON$CREATE_NEW_BRANCH)}\n        />\n      </ContextMenuListItem>\n    </ContextMenu>,\n    document.body,\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAuBA,IAAM,IAA0B;AAchC,SAAgB,EAA2B,EACzC,cACA,YACA,gBACA,kBAAe,8BACmB;CAClC,IAAM,EAAE,SAAM,EAAe,WAAW,GAClC,IAAU,EAAyC,CAAO,GAC1D,IAAmB,GACtB,MAAU,EAAM,gBACnB,GACM,CAAC,GAAa,KAAkB,EAA8B;CAwDpE,OAtDA,QAAsB;EACpB,IAAM,IAAS,EAAU;EACzB,IAAI,CAAC,GACH;EAGF,IAAM,UAAuB;GAC3B,IAAM,IAAO,EAAO,sBAAsB;GAC1C,EAAe;IACb,UAAU;IACV,KAAK,EAAK,SAAS;IACnB,OAAO,OAAO,aAAa,EAAK;IAChC,QAAQ;GACV,CAAC;EACH;EAKA,OAHA,EAAe,GACf,OAAO,iBAAiB,UAAU,CAAc,GAChD,OAAO,iBAAiB,UAAU,GAAgB,EAAI,SACzC;GAEX,AADA,OAAO,oBAAoB,UAAU,CAAc,GACnD,OAAO,oBAAoB,UAAU,GAAgB,EAAI;EAC3D;CACF,GAAG,CAAC,CAAS,CAAC,GA2BT,IAIE,EAAS,aACd,kBAAC,GAAD;EACE,KAAK;EACL,QAAQ,GAAG,EAAa;EACxB,OAAM;EACN,OAAO;EACP,WAAU;YALZ;GAOE,kBAAC,GAAD;IACE,QAAQ,GAAG,EAAa;IACxB,eAvCqB;KAEzB,AADA,EAAiB,EAAmB,CAAC,GACrC,EAAQ;IACV;IAqCM,WAAW;cAEX,kBAAC,GAAD;KACE,MAAM,kBAAC,GAAD;MAAqB,WAAU;MAAS,eAAA;KAAa,CAAA;KAC3D,MAAM,EAAE,EAAQ,mBAAmB;IACpC,CAAA;GACkB,CAAA;GACrB,kBAAC,GAAD;IACE,QAAQ,GAAG,EAAa;IACxB,eA5CmB;KAEvB,AADA,EAAiB,EAAiB,CAAC,GACnC,EAAQ;IACV;IA0CM,WAAW;cAEX,kBAAC,GAAD;KACE,MAAM,kBAAC,GAAD;MAAe,OAAO;MAAI,QAAQ;MAAI,eAAA;KAAa,CAAA;KACzD,MAAM,EAAE,EAAQ,WAAW;IAC5B,CAAA;GACkB,CAAA;GACrB,kBAAC,GAAD;IACE,QAAQ,GAAG,EAAa;IACxB,eAjDmB;KAEvB,AADA,EAAiB,EAAiB,CAAW,CAAC,GAC9C,EAAQ;IACV;IA+CM,WAAW;cAEX,kBAAC,GAAD;KACE,MAAM,kBAAC,GAAD;MAAa,OAAO;MAAI,QAAQ;MAAI,eAAA;KAAa,CAAA;KACvD,MAAM,EAAE,EAAQ,WAAW;IAC5B,CAAA;GACkB,CAAA;GACrB,kBAAC,GAAD;IACE,QAAQ,GAAG,EAAa;IACxB,eAtDuB;KAE3B,AADA,EAAiB,EAAkB,CAAW,CAAC,GAC/C,EAAQ;IACV;IAoDM,WAAW;cAEX,kBAAC,GAAD;KACE,MAAM,kBAAC,GAAD;MAAQ,OAAO;MAAI,QAAQ;MAAI,eAAA;KAAa,CAAA;KAClD,MAAM,EAAE,EAAQ,gBAAgB;IACjC,CAAA;GACkB,CAAA;GACrB,kBAAC,GAAD;IACE,QAAQ,GAAG,EAAa;IACxB,eA3D8B;KAElC,AADA,EAAiB,EAAyB,CAAC,GAC3C,EAAQ;IACV;IAyDM,WAAW;cAEX,kBAAC,GAAD;KACE,MAAM,kBAAC,GAAD;MAAgB,OAAO;MAAI,QAAQ;MAAI,eAAA;KAAa,CAAA;KAC1D,MAAM,EAAE,EAAQ,wBAAwB;IACzC,CAAA;GACkB,CAAA;EACV;KACb,SAAS,IACX,IA/DS;AAgEX"}

package/dist/components/features/conversation/conversation-git-actions-toggle.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/git-commit-horizontal.cjs"),i=require("../../../utils/utils.cjs"),a=require("../../../hooks/query/use-active-conversation.cjs"),o=require("../../../utils/form-control-classes.cjs"),s=require("../../../hooks/use-is-archived-conversation.cjs"),c=require("./conversation-git-actions-menu.cjs"),l=require("../chat/chat-action-tooltip.cjs");let u=require("react");u=e.__toESM(u,1);let d=require("react/jsx-runtime");var f=i.cn(`inline-flex h-7 min-h-7 w-fit shrink-0 cursor-pointer items-center justify-center gap-1.5 px-2.5`,`rounded-md text-xs font-normal leading-none`,o.formControlBorderClassName,o.formControlTransitionClassName,`text-[var(--oh-muted)]`,o.formControlMutedHoverClassName,`disabled:cursor-not-allowed disabled:opacity-30`);function p({className:e}){let{t:o}=t.useTranslation(`openhands`),p=s.useIsArchivedConversation(),{data:m}=a.useActiveConversation(),[h,g]=(0,u.useState)(!1),_=(0,u.useRef)(null),v=m?.git_provider??`github`;(0,u.useEffect)(()=>{if(!h)return;let e=e=>{e.key===`Escape`&&g(!1)};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[h]);let y=o(n.I18nKey.CONVERSATION$OVERVIEW_DIFF_GIT_ACTIONS),b=(0,d.jsxs)(`button`,{ref:_,type:`button`,onClick:()=>{p||g(e=>!e)},disabled:p,className:i.cn(f,h&&`bg-white/10 text-[var(--oh-foreground)]`,p&&`cursor-not-allowed opacity-50 hover:bg-transparent hover:text-[var(--oh-muted)]`,e),"aria-expanded":h,"aria-haspopup":`menu`,"aria-disabled":p,"data-testid":`conversation-git-actions-toggle`,children:[(0,d.jsx)(r.GitCommitHorizontal,{className:`size-4 shrink-0`,size:16,"aria-hidden":!0}),(0,d.jsx)(`span`,{className:`whitespace-nowrap`,children:y})]});return(0,d.jsxs)(`div`,{className:`relative inline-flex items-center self-center`,children:[p?(0,d.jsx)(l.ChatActionTooltip,{tooltip:o(n.I18nKey.CONVERSATION$UNAVAILABLE_FOR_ARCHIVES),ariaLabel:o(n.I18nKey.CONVERSATION$UNAVAILABLE_FOR_ARCHIVES),children:b}):b,h?(0,d.jsx)(c.ConversationGitActionsMenu,{anchorRef:_,gitProvider:v,onClose:()=>g(!1)}):null]})}exports.ConversationGitActionsToggle=p;
+//# sourceMappingURL=conversation-git-actions-toggle.cjs.map

package/dist/components/features/conversation/conversation-git-actions-toggle.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation-git-actions-toggle.cjs","names":[],"sources":["../../../../src/components/features/conversation/conversation-git-actions-toggle.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { GitCommitHorizontal } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useIsArchivedConversation } from \"#/hooks/use-is-archived-conversation\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { Provider } from \"#/types/settings\";\nimport { cn } from \"#/utils/utils\";\nimport {\n  formControlBorderClassName,\n  formControlMutedHoverClassName,\n  formControlTransitionClassName,\n} from \"#/utils/form-control-classes\";\nimport { ChatActionTooltip } from \"../chat/chat-action-tooltip\";\nimport { ConversationGitActionsMenu } from \"./conversation-git-actions-menu\";\n\n/** Same 28px height as overview / drawer header icon buttons. */\nconst GIT_ACTIONS_BUTTON_CLASSNAME = cn(\n  \"inline-flex h-7 min-h-7 w-fit shrink-0 cursor-pointer items-center justify-center gap-1.5 px-2.5\",\n  \"rounded-md text-xs font-normal leading-none\",\n  formControlBorderClassName,\n  formControlTransitionClassName,\n  \"text-[var(--oh-muted)]\",\n  formControlMutedHoverClassName,\n  \"disabled:cursor-not-allowed disabled:opacity-30\",\n);\n\ninterface ConversationGitActionsToggleProps {\n  className?: string;\n}\n\n/**\n * Header control left of overview: opens the shared git-actions dropdown\n * (commit / pull / push / create PR / new branch) as chat prompts.\n */\nexport function ConversationGitActionsToggle({\n  className,\n}: ConversationGitActionsToggleProps) {\n  const { t } = useTranslation(\"openhands\");\n  const isArchivedConversation = useIsArchivedConversation();\n  const { data: conversation } = useActiveConversation();\n  const [isGitMenuOpen, setIsGitMenuOpen] = useState(false);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n\n  const gitProvider =\n    (conversation?.git_provider as Provider | undefined) ?? \"github\";\n\n  useEffect(() => {\n    if (!isGitMenuOpen) {\n      return undefined;\n    }\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        setIsGitMenuOpen(false);\n      }\n    };\n\n    window.addEventListener(\"keydown\", onKeyDown);\n    return () => window.removeEventListener(\"keydown\", onKeyDown);\n  }, [isGitMenuOpen]);\n\n  const label = t(I18nKey.CONVERSATION$OVERVIEW_DIFF_GIT_ACTIONS);\n\n  const button = (\n    <button\n      ref={buttonRef}\n      type=\"button\"\n      onClick={() => {\n        if (isArchivedConversation) {\n          return;\n        }\n        setIsGitMenuOpen((open) => !open);\n      }}\n      disabled={isArchivedConversation}\n      className={cn(\n        GIT_ACTIONS_BUTTON_CLASSNAME,\n        isGitMenuOpen && \"bg-white/10 text-[var(--oh-foreground)]\",\n        isArchivedConversation &&\n          \"cursor-not-allowed opacity-50 hover:bg-transparent hover:text-[var(--oh-muted)]\",\n        className,\n      )}\n      aria-expanded={isGitMenuOpen}\n      aria-haspopup=\"menu\"\n      aria-disabled={isArchivedConversation}\n      data-testid=\"conversation-git-actions-toggle\"\n    >\n      <GitCommitHorizontal className=\"size-4 shrink-0\" size={16} aria-hidden />\n      <span className=\"whitespace-nowrap\">{label}</span>\n    </button>\n  );\n\n  return (\n    <div className=\"relative inline-flex items-center self-center\">\n      {/* Label is visible, so a tooltip only adds value for the disabled reason. */}\n      {isArchivedConversation ? (\n        <ChatActionTooltip\n          tooltip={t(I18nKey.CONVERSATION$UNAVAILABLE_FOR_ARCHIVES)}\n          ariaLabel={t(I18nKey.CONVERSATION$UNAVAILABLE_FOR_ARCHIVES)}\n        >\n          {button}\n        </ChatActionTooltip>\n      ) : (\n        button\n      )}\n      {isGitMenuOpen ? (\n        <ConversationGitActionsMenu\n          anchorRef={buttonRef}\n          gitProvider={gitProvider}\n          onClose={() => setIsGitMenuOpen(false)}\n        />\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"0oBAiBA,IAAM,EAA+B,EAAA,GACnC,mGACA,8CACA,EAAA,2BACA,EAAA,+BACA,yBACA,EAAA,+BACA,iDACF,EAUA,SAAgB,EAA6B,CAC3C,aACoC,CACpC,GAAM,CAAE,KAAM,EAAA,eAAe,WAAW,EAClC,EAAyB,EAAA,0BAA0B,EACnD,CAAE,KAAM,GAAiB,EAAA,sBAAsB,EAC/C,CAAC,EAAe,IAAA,EAAA,EAAA,UAA6B,EAAK,EAClD,GAAA,EAAA,EAAA,QAAsC,IAAI,EAE1C,EACH,GAAc,cAAyC,UAE1D,EAAA,EAAA,eAAgB,CACd,GAAI,CAAC,EACH,OAGF,IAAM,EAAa,GAAyB,CACtC,EAAM,MAAQ,UAChB,EAAiB,EAAK,CAE1B,EAGA,OADA,OAAO,iBAAiB,UAAW,CAAS,MAC/B,OAAO,oBAAoB,UAAW,CAAS,CAC9D,EAAG,CAAC,CAAa,CAAC,EAElB,IAAM,EAAQ,EAAE,EAAA,QAAQ,sCAAsC,EAExD,GACJ,EAAA,EAAA,MAAC,SAAD,CACE,IAAK,EACL,KAAK,SACL,YAAe,CACT,GAGJ,EAAkB,GAAS,CAAC,CAAI,CAClC,EACA,SAAU,EACV,UAAW,EAAA,GACT,EACA,GAAiB,0CACjB,GACE,kFACF,CACF,EACA,gBAAe,EACf,gBAAc,OACd,gBAAe,EACf,cAAY,2CApBd,EAsBE,EAAA,EAAA,KAAC,EAAA,oBAAD,CAAqB,UAAU,kBAAkB,KAAM,GAAI,cAAA,EAAa,CAAA,GACxE,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,6BAAqB,CAAY,CAAA,CAC3C,IAGV,OACE,EAAA,EAAA,MAAC,MAAD,CAAK,UAAU,yDAAf,CAEG,GACC,EAAA,EAAA,KAAC,EAAA,kBAAD,CACE,QAAS,EAAE,EAAA,QAAQ,qCAAqC,EACxD,UAAW,EAAE,EAAA,QAAQ,qCAAqC,WAEzD,CACgB,CAAA,EAEnB,EAED,GACC,EAAA,EAAA,KAAC,EAAA,2BAAD,CACE,UAAW,EACE,cACb,YAAe,EAAiB,EAAK,CACtC,CAAA,EACC,IACD,GAET"}

package/dist/components/features/conversation/conversation-git-actions-toggle.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+interface ConversationGitActionsToggleProps {
+    className?: string;
+}
+/**
+ * Header control left of overview: opens the shared git-actions dropdown
+ * (commit / pull / push / create PR / new branch) as chat prompts.
+ */
+export declare function ConversationGitActionsToggle({ className, }: ConversationGitActionsToggleProps): React.JSX.Element;
+export {};