@agents24/chat-react 0.5.36 → 0.5.37

package/dist/styles.css

@@ -235,12 +235,19 @@ button.a24-tool-trigger:focus-visible { outline: 2px solid var(--a24-focus); out
 .a24-chat-message { display: flex; flex-direction: column; min-width: 0; width: 100%; }
 .a24-chat-message--user { gap: 0; max-width: 100%; }
 .a24-chat-message--assistant { gap: .5rem; max-width: 100%; }
+.a24-chat-message-action-row--assistant { opacity: 1; pointer-events: auto; transition: opacity 150ms ease; }
+@media (hover: hover) and (pointer: fine) {
+  .a24-chat-message-action-row--assistant { opacity: 0; pointer-events: none; }
+  [data-slot="message"]:is(:hover, :focus-within) .a24-chat-message-action-row--assistant,
+  .a24-chat-message-action-row--assistant:has([data-state="open"]) { opacity: 1; pointer-events: auto; }
+}
 .a24-chat-completion-actions { animation: a24-chat-completion-actions-in 200ms cubic-bezier(.2, 0, 0, 1) both; }
 @keyframes a24-chat-completion-actions-in {
   from { filter: blur(4px); opacity: 0; transform: translateY(4px); }
   to { filter: blur(0); opacity: 1; transform: translateY(0); }
 }
 @media (prefers-reduced-motion: reduce) {
+  .a24-chat-message-action-row--assistant { transition: none; }
   .a24-chat-completion-actions { animation: none; }
 }
 .a24-chat-message-action-row--user { align-items: center; align-self: flex-start; display: flex; gap: .5rem; height: 2rem; margin-left: auto; margin-top: .25rem; padding-inline: .25rem; transition: opacity 150ms ease; width: auto; }

package/dist/ui/agent-chat-composer.d.ts

@@ -20,6 +20,7 @@ export type AgentChatComposerProps = {
     disabled?: boolean;
     forceExpanded?: boolean;
     focusKey?: string | null;
+    scopeKey?: string | null;
     inputToolbarContent?: React.ReactNode;
     isRunning?: boolean;
     isCancelling?: boolean;
@@ -34,4 +35,4 @@ export type AgentChatComposerProps = {
     } | null;
     textareaRef?: React.Ref<HTMLTextAreaElement>;
 };
-export declare function AgentChatComposer({ inputContract, recordingEnabled, contextWindow, accept, allowAttachments, className, disabled, forceExpanded, focusKey, inputToolbarContent, isRunning, isCancelling, onAttachmentCountChange, onStop, onSubmit, placeholder, restoredDraft, textareaRef, }: AgentChatComposerProps): import("react/jsx-runtime").JSX.Element;
+export declare function AgentChatComposer({ inputContract, recordingEnabled, contextWindow, accept, allowAttachments, className, disabled, forceExpanded, focusKey, scopeKey, inputToolbarContent, isRunning, isCancelling, onAttachmentCountChange, onStop, onSubmit, placeholder, restoredDraft, textareaRef, }: AgentChatComposerProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/agent-chat-message.d.ts

@@ -1,3 +1,5 @@
+import type { HitlSubmissionOptions } from "@agents24/react";
+import type { HitlSubmissionLabels } from "./hitl-submission-status";
 import * as React from "react";
 import type { ChatHitlPart, ChatHitlResponse, ChatMessage } from "../types";
 import { type ChatAttachmentContentResolver } from "./adapters";
@@ -19,10 +21,12 @@ export type AgentChatMessageProps = {
     className?: string;
     contentClassName?: string;
     dir?: "ltr" | "rtl";
+    hitlLabels?: Partial<HitlSubmissionLabels>;
+    onHitlPaint?: (durationMs: number) => void;
     getHitlActionState?: (part: ChatHitlPart) => AgentChatPartActionState | undefined;
     message: ChatMessage;
     nodeActivityMode?: "default" | "all" | "hidden";
-    onHitlAction?: (part: ChatHitlPart, response: ChatHitlResponse) => void;
+    onHitlAction?: (part: ChatHitlPart, response: ChatHitlResponse, options?: HitlSubmissionOptions) => void;
     Timeline?: AgentChatTimelineComponent;
     renderAssistantContent?: (input: {
         isStreaming: boolean;
@@ -45,4 +49,4 @@ export declare function AgentChatUserMessageActionRow({ children, className, }:
     children: React.ReactNode;
     className?: string;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function AgentChatMessage({ actionHandlers, additionalActions, actions, actionsClassName, attachmentContentResolver, className, contentClassName, dir, getHitlActionState, message, nodeActivityMode, onHitlAction, Timeline, renderAssistantContent, renderUserContent, showAssistantAttachments, streamingMessageId, userMessageCollapsedLines, userMessageContent, userMessageCollapseThreshold, userMessageShowLessLabel, userMessageShowMoreLabel, }: AgentChatMessageProps): import("react/jsx-runtime").JSX.Element;
+export declare function AgentChatMessage({ actionHandlers, additionalActions, actions, actionsClassName, attachmentContentResolver, className, contentClassName, dir, getHitlActionState, hitlLabels, onHitlPaint, message, nodeActivityMode, onHitlAction, Timeline, renderAssistantContent, renderUserContent, showAssistantAttachments, streamingMessageId, userMessageCollapsedLines, userMessageContent, userMessageCollapseThreshold, userMessageShowLessLabel, userMessageShowMoreLabel, }: AgentChatMessageProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/agent-response-timeline.d.ts

@@ -1,3 +1,5 @@
+import type { HitlSubmissionOptions } from "@agents24/react";
+import { type HitlSubmissionLabels } from "./hitl-submission-status";
 import * as React from "react";
 import type { ChatHitlPart, ChatHitlResponse, ChatMessage, ChatNodeActivityPart, ChatPart, ChatToolPart, ChatUiBlocksPart } from "../types";
 import type { McpConnectRequiredStatus } from "./mcp-connect-required-card";
@@ -6,14 +8,18 @@ import { type AgentChatToolSlots, type AgentChatToolViewMode } from "./tool-sess
 export type AgentChatPartActionState = {
     status?: McpConnectRequiredStatus | string;
     error?: string | null;
+    action?: string;
+    retry?: () => Promise<void>;
 };
 export type HitlActionState = AgentChatPartActionState;
 export type AgentResponseTimelineProps = {
+    hitlLabels?: Partial<HitlSubmissionLabels>;
+    onHitlPaint?: (durationMs: number) => void;
     getHitlActionState?: (part: ChatHitlPart) => AgentChatPartActionState | undefined;
     isLoading?: boolean;
     message: ChatMessage;
     nodeActivityMode?: "default" | "all" | "hidden";
-    onHitlAction?: (part: ChatHitlPart, response: ChatHitlResponse) => void;
+    onHitlAction?: (part: ChatHitlPart, response: ChatHitlResponse, options?: HitlSubmissionOptions) => void;
     onNodeSelect?: (part: ChatNodeActivityPart) => void;
     parts?: readonly ChatPart[];
     renderUiBlocks?: (part: ChatUiBlocksPart) => React.ReactNode;
@@ -36,6 +42,8 @@ export declare function AgentChatToolGroup({ activeToolId, parts, }: {
 export type AgentChatPartProps = {
     activeToolId?: string | null;
     getHitlActionState?: AgentResponseTimelineProps["getHitlActionState"];
+    hitlLabels?: AgentResponseTimelineProps["hitlLabels"];
+    onHitlPaint?: AgentResponseTimelineProps["onHitlPaint"];
     isLoading?: boolean;
     isTextStreaming?: boolean;
     message: ChatMessage;
@@ -44,5 +52,5 @@ export type AgentChatPartProps = {
     responseProps?: AgentResponseTimelineProps["responseProps"];
     toolSlots?: AgentChatToolSlots;
 };
-export declare function AgentChatPart({ activeToolId, getHitlActionState, isLoading, isTextStreaming, message, onHitlAction, part, responseProps, toolSlots, }: AgentChatPartProps): import("react/jsx-runtime").JSX.Element | null;
-export declare function AgentResponseTimeline({ getHitlActionState, isLoading, message, nodeActivityMode, onHitlAction, onNodeSelect, parts: displayParts, renderUiBlocks, responseProps, toolSlots, toolViewMode, }: AgentResponseTimelineProps): import("react/jsx-runtime").JSX.Element;
+export declare function AgentChatPart({ activeToolId, getHitlActionState, hitlLabels, onHitlPaint, isLoading, isTextStreaming, message, onHitlAction, part, responseProps, toolSlots, }: AgentChatPartProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function AgentResponseTimeline({ getHitlActionState, hitlLabels, onHitlPaint, isLoading, message, nodeActivityMode, onHitlAction, onNodeSelect, parts: displayParts, renderUiBlocks, responseProps, toolSlots, toolViewMode, }: AgentResponseTimelineProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/ask-user-interaction.d.ts

@@ -1,8 +1,12 @@
+import { type HitlSubmissionLabels, type HitlSubmissionPresentation } from "./hitl-submission-status";
 import type { ChatHitlAnswer, ChatHitlPart } from "../types";
 export type AskUserInteractionProps = {
     error?: string | null;
+    submission?: HitlSubmissionPresentation;
+    submissionLabels?: Partial<HitlSubmissionLabels>;
+    onSubmissionPaint?: (durationMs: number) => void;
     isBusy?: boolean;
     onSubmit?: (answers: ChatHitlAnswer[]) => void;
     part: ChatHitlPart;
 };
-export declare function AskUserInteraction({ error, isBusy, onSubmit, part, }: AskUserInteractionProps): import("react/jsx-runtime").JSX.Element;
+export declare function AskUserInteraction({ error, submission, submissionLabels, onSubmissionPaint, isBusy, onSubmit, part, }: AskUserInteractionProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/hitl-submission-status.d.ts

@@ -0,0 +1,22 @@
+export type HitlSubmissionLabels = {
+    submitting: string;
+    checking: string;
+    uncertain: string;
+    retry: string;
+    accepted: string;
+    approved: string;
+    rejected: string;
+};
+export declare const defaultHitlSubmissionLabels: HitlSubmissionLabels;
+export type HitlSubmissionPresentation = {
+    status?: string;
+    action?: string;
+    retry?: () => Promise<void>;
+};
+export declare function isHitlSubmissionCompact(state?: HitlSubmissionPresentation): boolean;
+/** Also available to host-owned approval cards; keeps their decision feedback consistent. */
+export declare function HitlSubmissionStatus({ state, labels: overrides, onPaint }: {
+    state: HitlSubmissionPresentation;
+    labels?: Partial<HitlSubmissionLabels>;
+    onPaint?: (durationMs: number) => void;
+}): import("react/jsx-runtime").JSX.Element;