@athenaintel/react 0.23.1 → 0.23.3

package/dist/chat/AthenaChat.js

@@ -37,13 +37,19 @@ import { ChatThreadShell } from "../chat-ui/thread/chat-thread-shell.js";
 import { StatewireHistoryEdge } from "../chat-ui/thread/statewire-history-edge.js";
 import { ThreadLoadingOverlay } from "../chat-ui/thread/thread-loading-overlay.js";
 import { ComposerSendOrStop } from "../chat-ui/thread/composer-send-or-stop.js";
+import { resolveComposerAction } from "../chat-ui/composer/composer-action.js";
+import { athenaDiagnostics } from "../diagnostics/athena-diagnostics.js";
+import { useDictation } from "../dictation/use-dictation.js";
+import { DictationStrip } from "../dictation/DictationStrip.js";
+import { DictationStopButton, DictationMicButton, DictationCancelButton } from "../dictation/dictation-controls.js";
+import { composeDictationDraft, DICTATION_STATUSES } from "../dictation/dictation-state.js";
 import { TiptapComposer } from "../chat-ui/composer/tiptap-composer.js";
 import { MentionAuthCtx } from "../chat-ui/mentions/suggestions/data/api-client.js";
 import { ACTION_BAR_REVEAL_CLASS, BranchPicker } from "../chat-ui/messages/message-components.js";
 import { useMessageActionsReadOnly } from "../chat-ui/messages/message-actions-config.js";
 import { useAthenaRunLive } from "./use-athena-run-live.js";
 import { DEFAULT_WELCOME_SUGGESTIONS, AthenaChatWelcomeSuggestions, AthenaChatWelcome, welcomeEntrance, welcomeComposerDelayMs } from "./athena-chat-welcome.js";
-import { ATHENA_COMPOSER_COMPONENTS, AthenaComposerMentionButton } from "./athena-composer-controls.js";
+import { AthenaComposerSendButton, ATHENA_COMPOSER_COMPONENTS, AthenaComposerMentionButton } from "./athena-composer-controls.js";
 import { useComposerKeyboardHint, ComposerKeyboardHint } from "./composer-keyboard-hint.js";
 import { usePrefersReducedMotion } from "../lib/use-prefers-reduced-motion.js";
 import { useAuiState, ActionBarPrimitive, ActionBarMorePrimitive, MessagePrimitive, ThreadPrimitive, AuiIf, ErrorPrimitive, useAui } from "@assistant-ui/react";
@@ -142,7 +148,9 @@ const AthenaChat = ({
   mentionTools,
   welcomeSuggestions = DEFAULT_WELCOME_SUGGESTIONS,
   components,
-  groupToolCalls = true
+  groupToolCalls = true,
+  composer: composerSlots,
+  dictation = true
 }) => {
   var _a, _b, _c;
   const athenaConfig = useAthenaConfig();
@@ -250,6 +258,8 @@ const AthenaChat = ({
             AthenaChatComposer,
             {
               tools,
+              slots: composerSlots,
+              dictation,
               welcomeSuggestionCount: welcomeSuggestions.length
             }
           ) })
@@ -308,7 +318,7 @@ const ATHENA_CHAT_MENTION_CATEGORIES = [
   "projects",
   "folders"
 ];
-const AthenaChatComposer = ({ tools, welcomeSuggestionCount }) => {
+const AthenaChatComposer = ({ tools, slots, dictation, welcomeSuggestionCount }) => {
   const aui = useAui();
   const threadId = useAthenaStatewireThreadId();
   const { appUrl } = useAthenaConfig();
@@ -317,6 +327,10 @@ const AthenaChatComposer = ({ tools, welcomeSuggestionCount }) => {
   const { attachFiles } = useAttachFiles();
   const composerRef = useRef(null);
   const [hasText, setHasText] = useState(false);
+  const isRunning = useAuiState((state) => {
+    var _a;
+    return ((_a = state.optional.thread) == null ? void 0 : _a.isRunning) ?? false;
+  });
   const [dragActive, setDragActive] = useState(false);
   const keyboardHint = useComposerKeyboardHint();
   const reducedMotion = usePrefersReducedMotion();
@@ -326,6 +340,28 @@ const AthenaChatComposer = ({ tools, welcomeSuggestionCount }) => {
     welcomeComposerDelayMs(welcomeSuggestionCount),
     reducedMotion || !mountedEmpty
   );
+  const dictationEnabled = dictation !== false;
+  const dictationOptions = typeof dictation === "object" ? dictation : void 0;
+  const appendSpokenText = useCallback(
+    (spoken) => {
+      if (!spoken) return;
+      aui.composer.setText(composeDictationDraft(aui.composer.getState().text ?? "", spoken));
+    },
+    [aui]
+  );
+  const dictationCtl = useDictation({
+    engine: dictationOptions == null ? void 0 : dictationOptions.engine,
+    lang: dictationOptions == null ? void 0 : dictationOptions.lang,
+    // A recognizer that gives up on its own (silence window) still hands
+    // over what it heard instead of dropping the words with the session.
+    onAutoEnd: appendSpokenText
+  });
+  const recording = dictationEnabled && dictationCtl.isActive;
+  const showMic = dictationEnabled && dictationCtl.isSupported;
+  const { isActive: dictationActive, cancel: cancelDictation } = dictationCtl;
+  useEffect(() => {
+    if (!dictationEnabled && dictationActive) cancelDictation();
+  }, [cancelDictation, dictationActive, dictationEnabled]);
   const rootCategories = useMemo(() => {
     const categories = [...ATHENA_CHAT_MENTION_CATEGORIES];
     if (tools.some((tool) => tool.type === "toolkit")) categories.push("toolkits");
@@ -381,6 +417,36 @@ const AthenaChatComposer = ({ tools, welcomeSuggestionCount }) => {
     }),
     [attachFiles]
   );
+  const stopDictation = useCallback(async () => {
+    appendSpokenText(await dictationCtl.stop());
+  }, [appendSpokenText, dictationCtl]);
+  const sendDictation = useCallback(async () => {
+    var _a;
+    const spoken = await dictationCtl.stop();
+    const text = composeDictationDraft(aui.composer.getState().text ?? "", spoken);
+    const extras = attachmentsRef.current.length > 0 || quoteRef.current !== null;
+    if (!text && !extras) return;
+    aui.composer.setText(text);
+    const action = resolveComposerAction({ hasDraft: true, isRunning });
+    if (action === "stop") return;
+    try {
+      await ((_a = slots == null ? void 0 : slots.onBeforeSend) == null ? void 0 : _a.call(slots, { action }));
+    } catch (error) {
+      athenaDiagnostics.emit("composer.dictation", {
+        level: "warn",
+        data: {
+          phase: "before_send_rejected",
+          error: error instanceof Error ? error.message : String(error)
+        }
+      });
+      return;
+    }
+    if (extras) {
+      sendComposed(text);
+      return;
+    }
+    aui.composer.send({ steer: false });
+  }, [aui, dictationCtl, isRunning, sendComposed, slots]);
   return /* @__PURE__ */ jsx(ComposerDropZone, { onDragActiveChange: setDragActive, children: /* @__PURE__ */ jsx(
     "div",
     {
@@ -397,23 +463,34 @@ const AthenaChatComposer = ({ tools, welcomeSuggestionCount }) => {
             /* @__PURE__ */ jsx(ComposerQuotePreview, {}),
             /* @__PURE__ */ jsx(ComposerAttachmentPreview, {})
           ] }),
-          editor: /* @__PURE__ */ jsx(
-            TiptapComposer,
-            {
-              ref: composerRef,
-              threadId,
-              appearance: "paper",
-              placeholder: "Type @ to tag an asset",
-              tools,
-              rootCategories,
-              onDraftStateChange: setHasText,
-              waitForHostUploads,
-              interceptSubmit,
-              fileIntake,
-              onSubmitted: keyboardHint.onSubmitted
-            }
-          ),
-          toolbarStart: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+          editor: /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("div", { className: cn(recording && "hidden"), children: /* @__PURE__ */ jsx(
+              TiptapComposer,
+              {
+                ref: composerRef,
+                threadId,
+                appearance: "paper",
+                placeholder: "Type @ to tag an asset",
+                tools,
+                rootCategories,
+                onDraftStateChange: setHasText,
+                waitForHostUploads,
+                interceptSubmit,
+                fileIntake,
+                onSubmitted: keyboardHint.onSubmitted
+              }
+            ) }),
+            recording && /* @__PURE__ */ jsx(
+              DictationStrip,
+              {
+                status: dictationCtl.status,
+                transcript: dictationCtl.transcript,
+                stream: dictationCtl.stream
+              }
+            ),
+            dictationEnabled && dictationCtl.status === DICTATION_STATUSES.error && dictationCtl.error && /* @__PURE__ */ jsx("p", { className: "aui-dictation-error px-1.5 pb-1 text-destructive text-xs", role: "alert", children: dictationCtl.error.message })
+          ] }),
+          toolbarStart: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: recording ? /* @__PURE__ */ jsx(DictationCancelButton, { onClick: dictationCtl.cancel }) : /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx(FileUploadButton, { className: "aui-composer-attach size-8 rounded-full p-0 disabled:opacity-30" }),
             /* @__PURE__ */ jsx(
               AthenaComposerMentionButton,
@@ -423,17 +500,40 @@ const AthenaChatComposer = ({ tools, welcomeSuggestionCount }) => {
                   return (_b = (_a = composerRef.current) == null ? void 0 : _a.openMentionMenu) == null ? void 0 : _b.call(_a);
                 }
               }
+            ),
+            slots == null ? void 0 : slots.toolbarStart
+          ] }) }),
+          toolbarEnd: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: recording ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              DictationStopButton,
+              {
+                onClick: () => void stopDictation(),
+                disabled: dictationCtl.status === DICTATION_STATUSES.stopping
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              AthenaComposerSendButton,
+              {
+                action: isRunning ? "queue" : "send",
+                onSend: () => void sendDictation(),
+                disabled: dictationCtl.status !== DICTATION_STATUSES.listening || isUploading,
+                title: isUploading ? "Upload in progress..." : void 0
+              }
             )
-          ] }),
-          toolbarEnd: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ jsx(
-            ComposerSendOrStop,
-            {
-              composerRef,
-              hasDraft: hasText || hasExtras,
-              sendBlockedReason: isUploading ? "Upload in progress..." : null,
-              components: ATHENA_COMPOSER_COMPONENTS
-            }
-          ) }),
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            slots == null ? void 0 : slots.toolbarEnd,
+            showMic && /* @__PURE__ */ jsx(DictationMicButton, { onClick: dictationCtl.start, disabled: isUploading }),
+            /* @__PURE__ */ jsx(
+              ComposerSendOrStop,
+              {
+                composerRef,
+                hasDraft: hasText || hasExtras,
+                sendBlockedReason: isUploading ? "Upload in progress..." : null,
+                onBeforeSend: slots == null ? void 0 : slots.onBeforeSend,
+                components: ATHENA_COMPOSER_COMPONENTS
+              }
+            )
+          ] }) }),
           belowSurface: /* @__PURE__ */ jsx(ComposerKeyboardHint, { visible: keyboardHint.visible })
         }
       )
@@ -704,21 +804,14 @@ const AthenaAssistantMessage = ({
       children: [
         /* @__PURE__ */ jsx(MessageDaySeparator, {}),
         /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
-          /* @__PURE__ */ jsx(
+          AvatarComponent ? /* @__PURE__ */ jsx(
             "div",
             {
               "data-slot": "assistant-lead",
               className: "aui-assistant-message-lead flex shrink-0 justify-center",
-              children: AvatarComponent ? /* @__PURE__ */ jsx(AvatarComponent, {}) : /* @__PURE__ */ jsx(
-                "span",
-                {
-                  "aria-hidden": "true",
-                  "data-slot": "assistant-rule",
-                  className: "aui-assistant-message-rule w-0.5 self-stretch rounded-full bg-border"
-                }
-              )
+              children: /* @__PURE__ */ jsx(AvatarComponent, {})
             }
-          ),
+          ) : null,
           /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
             /* @__PURE__ */ jsx(AthenaReasoningTextComponentContext.Provider, { value: TextComponent, children: /* @__PURE__ */ jsxs("div", { className: "aui-assistant-message-content wrap-break-word px-2 text-foreground leading-relaxed", children: [
               /* @__PURE__ */ jsx(NestedPtcComponentsProvider, { components: nestedPtcComponents, children: groupToolCalls ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-2", children: [