@ai-matrx/chat 0.5.0 → 0.5.3

package/dist/agents/components/messages-display/user/UserActionBar.js

@@ -1,7 +1,8 @@
 "use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useDocumentDialogsHost } from "@ai-matrx/rich-content/host/app-bindings";
 import { buildChatMessageActions } from "../rich-document/chatMessageActions.js";
-import React, { useState, Suspense, useCallback, lazy } from "react";
+import { useState, Suspense, useCallback, lazy } from "react";
 const RegistryActionMenu = lazy(
   () => import("@ai-matrx/rich-content/rich-document/variants/RegistryActionMenu").then((m) => ({ default: m.RegistryActionMenu }))
 );
@@ -181,68 +182,82 @@ function UserActionBar({
     }
   }, [dispatch, conversationId, messagePosition, surfaceKey]);
   const canFork = (messagePosition ?? 0) > 0;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TapTargetButtonGroup, { surface: "solid" }, /* @__PURE__ */ React.createElement(CopySplitButton, { copy: (flavor) => copyRichContent(content, flavor), label: "Copy message" }), /* @__PURE__ */ React.createElement(SpeakerButton, { text: content, variant: "group" }), database ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    TapTargetButtonForGroup,
-    {
-      onClick: handleEdit,
-      ariaLabel: "Edit message",
-      icon: /* @__PURE__ */ React.createElement(Edit, { className: "w-4 h-4 text-muted-foreground" })
-    }
-  ), /* @__PURE__ */ React.createElement(
-    TapTargetButtonForGroup,
-    {
-      onClick: handleEdit,
-      ariaLabel: "Edit and resubmit",
-      icon: /* @__PURE__ */ React.createElement(Send, { className: "w-4 h-4 text-cyan-500 dark:text-cyan-400" })
-    }
-  ), /* @__PURE__ */ React.createElement(
-    TapTargetButtonForGroup,
-    {
-      onClick: () => void togglePinnedMessage(messageId),
-      ariaLabel: pinPending ? isPinned ? "Unpinning\u2026" : "Pinning\u2026" : isPinned ? "Unpin message" : "Pin message",
-      disabled: pinPending,
-      icon: pinPending ? /* @__PURE__ */ React.createElement(Loader2, { className: "w-4 h-4 animate-spin text-muted-foreground" }) : isPinned ? /* @__PURE__ */ React.createElement(PinOff, { className: "w-4 h-4 text-amber-500 dark:text-amber-400" }) : /* @__PURE__ */ React.createElement(Pin, { className: "w-4 h-4 text-muted-foreground" })
-    }
-  ), showOptions && /* @__PURE__ */ React.createElement(
-    TapTargetButtonForGroup,
-    {
-      ref: setMoreOptionsAnchor,
-      onClick: () => setShowOptionsMenu(true),
-      ariaLabel: "More options",
-      icon: /* @__PURE__ */ React.createElement(MoreHorizontal, { className: "w-4 h-4 text-muted-foreground" })
-    }
-  )) : null), database && showOptions && showOptionsMenu && /* @__PURE__ */ React.createElement(Suspense, { fallback: null }, /* @__PURE__ */ React.createElement(
-    RegistryActionMenu,
-    {
-      isOpen: showOptionsMenu,
-      onClose: () => setShowOptionsMenu(false),
-      title: "Your message",
-      anchorElement: moreOptionsAnchor,
-      ...buildChatMessageActions({
-        conversationId,
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(TapTargetButtonGroup, { surface: "solid", children: [
+      /* @__PURE__ */ jsx(CopySplitButton, { copy: (flavor) => copyRichContent(content, flavor), label: "Copy message" }),
+      /* @__PURE__ */ jsx(SpeakerButton, { text: content, variant: "group" }),
+      database ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          TapTargetButtonForGroup,
+          {
+            onClick: handleEdit,
+            ariaLabel: "Edit message",
+            icon: /* @__PURE__ */ jsx(Edit, { className: "w-4 h-4 text-muted-foreground" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          TapTargetButtonForGroup,
+          {
+            onClick: handleEdit,
+            ariaLabel: "Edit and resubmit",
+            icon: /* @__PURE__ */ jsx(Send, { className: "w-4 h-4 text-cyan-500 dark:text-cyan-400" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          TapTargetButtonForGroup,
+          {
+            onClick: () => void togglePinnedMessage(messageId),
+            ariaLabel: pinPending ? isPinned ? "Unpinning\u2026" : "Pinning\u2026" : isPinned ? "Unpin message" : "Pin message",
+            disabled: pinPending,
+            icon: pinPending ? /* @__PURE__ */ jsx(Loader2, { className: "w-4 h-4 animate-spin text-muted-foreground" }) : isPinned ? /* @__PURE__ */ jsx(PinOff, { className: "w-4 h-4 text-amber-500 dark:text-amber-400" }) : /* @__PURE__ */ jsx(Pin, { className: "w-4 h-4 text-muted-foreground" })
+          }
+        ),
+        showOptions && /* @__PURE__ */ jsx(
+          TapTargetButtonForGroup,
+          {
+            ref: setMoreOptionsAnchor,
+            onClick: () => setShowOptionsMenu(true),
+            ariaLabel: "More options",
+            icon: /* @__PURE__ */ jsx(MoreHorizontal, { className: "w-4 h-4 text-muted-foreground" })
+          }
+        )
+      ] }) : null
+    ] }),
+    database && showOptions && showOptionsMenu && /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(
+      RegistryActionMenu,
+      {
+        isOpen: showOptionsMenu,
+        onClose: () => setShowOptionsMenu(false),
+        title: "Your message",
+        anchorElement: moreOptionsAnchor,
+        ...buildChatMessageActions({
+          conversationId,
+          messageId,
+          role: "user",
+          messageContent: content,
+          contentIsStructuredRaw: structuredRaw,
+          metadata,
+          surfaceKey: surfaceKey ?? null,
+          callbacks: {
+            ...dialogsHost.callbacks,
+            onRequestDelete: () => setDeleteDialogOpen(true)
+          }
+        })
+      }
+    ) }),
+    dialogsHost.dialogs,
+    /* @__PURE__ */ jsx(
+      DeleteMessageDialog,
+      {
+        open: deleteDialogOpen,
+        onOpenChange: setDeleteDialogOpen,
         messageId,
-        role: "user",
-        messageContent: content,
-        contentIsStructuredRaw: structuredRaw,
-        metadata,
-        surfaceKey: surfaceKey ?? null,
-        callbacks: {
-          ...dialogsHost.callbacks,
-          onRequestDelete: () => setDeleteDialogOpen(true)
-        }
-      })
-    }
-  )), dialogsHost.dialogs, /* @__PURE__ */ React.createElement(
-    DeleteMessageDialog,
-    {
-      open: deleteDialogOpen,
-      onOpenChange: setDeleteDialogOpen,
-      messageId,
-      canFork,
-      onConfirmDelete: handleConfirmDelete,
-      onConfirmFork: handleConfirmDeleteFork
-    }
-  ));
+        canFork,
+        onConfirmDelete: handleConfirmDelete,
+        onConfirmFork: handleConfirmDeleteFork
+      }
+    )
+  ] });
 }
 export {
   UserActionBar

package/dist/agents/components/messages-display/user/UserMessageAttachmentStyleComparison.js

@@ -1,4 +1,5 @@
 "use client";
+import { jsx, jsxs } from "react/jsx-runtime";
 import {
   Globe,
   StickyNote,
@@ -22,7 +23,7 @@ const COMPARISON_ICONS = {
 };
 function SentMessageChip({ spec }) {
   if (spec.id === "image-legacy") {
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsx(
       FileResourceChip,
       {
         fileId: "00000000-0000-0000-0000-000000000000",
@@ -32,7 +33,7 @@ function SentMessageChip({ spec }) {
     );
   }
   const Icon = COMPARISON_ICONS[spec.id] ?? FileText;
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     ResourceAttachmentTile,
     {
       typeLabel: spec.label,
@@ -45,14 +46,17 @@ function SentMessageChip({ spec }) {
 function ThumbnailTile({ spec }) {
   const Icon = COMPARISON_ICONS[spec.id] ?? FileText;
   const isImage = spec.id === "image-legacy";
-  return /* @__PURE__ */ React.createElement("div", { className: "relative rounded-lg overflow-hidden border border-border shrink-0" }, isImage ? /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx("div", { className: "relative rounded-lg overflow-hidden border border-border shrink-0", children: isImage ? /* @__PURE__ */ jsx(
     "div",
     {
       className: "h-10 w-10 bg-gradient-to-br from-blue-100 to-indigo-200 dark:from-blue-950/60 dark:to-indigo-900/40 flex items-center justify-center",
-      title: spec.title
-    },
-    /* @__PURE__ */ React.createElement(ImageIcon, { className: "h-4 w-4 text-blue-600 dark:text-blue-400" })
-  ) : /* @__PURE__ */ React.createElement("div", { className: "h-10 w-12 flex flex-col items-center justify-center bg-muted py-1" }, /* @__PURE__ */ React.createElement(Icon, { className: "h-6 w-6 text-muted-foreground mb-1" }), /* @__PURE__ */ React.createElement("span", { className: "text-[8px] text-muted-foreground text-center truncate w-full px-1" }, spec.title)));
+      title: spec.title,
+      children: /* @__PURE__ */ jsx(ImageIcon, { className: "h-4 w-4 text-blue-600 dark:text-blue-400" })
+    }
+  ) : /* @__PURE__ */ jsxs("div", { className: "h-10 w-12 flex flex-col items-center justify-center bg-muted py-1", children: [
+    /* @__PURE__ */ jsx(Icon, { className: "h-6 w-6 text-muted-foreground mb-1" }),
+    /* @__PURE__ */ jsx("span", { className: "text-[8px] text-muted-foreground text-center truncate w-full px-1", children: spec.title })
+  ] }) });
 }
 function ComparisonColumn({
   title,
@@ -60,43 +64,82 @@ function ComparisonColumn({
   badge,
   children
 }) {
-  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React.createElement("div", { className: "mb-2 space-y-0.5" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-2 flex-wrap" }, /* @__PURE__ */ React.createElement("h3", { className: "text-sm font-semibold text-foreground" }, title), badge ? /* @__PURE__ */ React.createElement("span", { className: "text-[10px] font-medium uppercase tracking-wide text-muted-foreground bg-muted px-1.5 py-0.5 rounded border border-border" }, badge) : null), /* @__PURE__ */ React.createElement("p", { className: "text-[11px] text-muted-foreground font-mono" }, source)), /* @__PURE__ */ React.createElement("div", { className: "bg-muted border border-border rounded-lg px-2 py-2 flex-1" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-1.5" }, children, /* @__PURE__ */ React.createElement("p", { className: "text-xs text-foreground whitespace-pre-wrap pt-1" }, "Can you review these attachments and summarize next steps?"))));
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-w-0", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-2 space-y-0.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
+        /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-foreground", children: title }),
+        badge ? /* @__PURE__ */ jsx("span", { className: "text-[10px] font-medium uppercase tracking-wide text-muted-foreground bg-muted px-1.5 py-0.5 rounded border border-border", children: badge }) : null
+      ] }),
+      /* @__PURE__ */ jsx("p", { className: "text-[11px] text-muted-foreground font-mono", children: source })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "bg-muted border border-border rounded-lg px-2 py-2 flex-1", children: /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+      children,
+      /* @__PURE__ */ jsx("p", { className: "text-xs text-foreground whitespace-pre-wrap pt-1", children: "Can you review these attachments and summarize next steps?" })
+    ] }) })
+  ] });
 }
 function UserMessageAttachmentStyleComparison({
   specs,
   inputChipsConversationId
 }) {
-  return /* @__PURE__ */ React.createElement("section", { className: "space-y-4" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("h2", { className: "text-base font-semibold text-foreground border-b border-border pb-2" }, "Side-by-side: attachment styles"), /* @__PURE__ */ React.createElement("p", { className: "text-xs text-muted-foreground mt-2 max-w-3xl" }, "Same six fake resources in each column. Input bar and sent messages both use ", /* @__PURE__ */ React.createElement("code", { className: "text-[10px]" }, "ResourceAttachmentTile"), " ", "(file attachments with a ", /* @__PURE__ */ React.createElement("code", { className: "text-[10px]" }, "file_id"), " ", "still use ", /* @__PURE__ */ React.createElement("code", { className: "text-[10px]" }, "FileResourceChip"), ").")), /* @__PURE__ */ React.createElement("div", { className: "grid gap-4 lg:grid-cols-3" }, /* @__PURE__ */ React.createElement(
-    ComparisonColumn,
-    {
-      title: "Sent message (today)",
-      source: "AgentUserMessage \u2192 AttachmentChip",
-      badge: "production"
-    },
-    /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-1.5" }, specs.map((spec) => /* @__PURE__ */ React.createElement(SentMessageChip, { key: spec.id, spec })))
-  ), /* @__PURE__ */ React.createElement(
-    ComparisonColumn,
-    {
-      title: "Input bar",
-      source: "SmartAgentResourceChips \u2192 ResourceAttachmentTile",
-      badge: "production"
-    },
-    /* @__PURE__ */ React.createElement("div", { className: "-mx-2 px-2" }, /* @__PURE__ */ React.createElement(
-      SmartAgentResourceChips,
-      {
-        conversationId: inputChipsConversationId
-      }
-    )),
-    /* @__PURE__ */ React.createElement("p", { className: "text-[10px] text-muted-foreground" }, "Hover for previews. Use the corner Remove control. Image/audio with", " ", /* @__PURE__ */ React.createElement("code", { className: "text-[10px]" }, "file_id"), " use FileResourceChip.")
-  ), /* @__PURE__ */ React.createElement(
-    ComparisonColumn,
-    {
-      title: "Old chat tiles",
-      source: "cx-conversation \u2192 AttachedResourcesDisplay",
-      badge: "legacy"
-    },
-    /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-2" }, specs.map((spec) => /* @__PURE__ */ React.createElement(ThumbnailTile, { key: spec.id, spec })))
-  )));
+  return /* @__PURE__ */ jsxs("section", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-foreground border-b border-border pb-2", children: "Side-by-side: attachment styles" }),
+      /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground mt-2 max-w-3xl", children: [
+        "Same six fake resources in each column. Input bar and sent messages both use ",
+        /* @__PURE__ */ jsx("code", { className: "text-[10px]", children: "ResourceAttachmentTile" }),
+        " ",
+        "(file attachments with a ",
+        /* @__PURE__ */ jsx("code", { className: "text-[10px]", children: "file_id" }),
+        " ",
+        "still use ",
+        /* @__PURE__ */ jsx("code", { className: "text-[10px]", children: "FileResourceChip" }),
+        ")."
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid gap-4 lg:grid-cols-3", children: [
+      /* @__PURE__ */ jsx(
+        ComparisonColumn,
+        {
+          title: "Sent message (today)",
+          source: "AgentUserMessage \u2192 AttachmentChip",
+          badge: "production",
+          children: /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1.5", children: specs.map((spec) => /* @__PURE__ */ jsx(SentMessageChip, { spec }, spec.id)) })
+        }
+      ),
+      /* @__PURE__ */ jsxs(
+        ComparisonColumn,
+        {
+          title: "Input bar",
+          source: "SmartAgentResourceChips \u2192 ResourceAttachmentTile",
+          badge: "production",
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "-mx-2 px-2", children: /* @__PURE__ */ jsx(
+              SmartAgentResourceChips,
+              {
+                conversationId: inputChipsConversationId
+              }
+            ) }),
+            /* @__PURE__ */ jsxs("p", { className: "text-[10px] text-muted-foreground", children: [
+              "Hover for previews. Use the corner Remove control. Image/audio with",
+              " ",
+              /* @__PURE__ */ jsx("code", { className: "text-[10px]", children: "file_id" }),
+              " use FileResourceChip."
+            ] })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        ComparisonColumn,
+        {
+          title: "Old chat tiles",
+          source: "cx-conversation \u2192 AttachedResourcesDisplay",
+          badge: "legacy",
+          children: /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: specs.map((spec) => /* @__PURE__ */ jsx(ThumbnailTile, { spec }, spec.id)) })
+        }
+      )
+    ] })
+  ] });
 }
 export {
   UserMessageAttachmentStyleComparison