@chatsdk-dev/elements 0.1.2 → 0.2.0

package/dist/{element-provider-C_nBsftD.d.ts → element-provider-C95jVJV9.d.ts}

@@ -1,7 +1,6 @@
-import { t as Callbacks } from "./callbacks-PIvHXeEI.js";
-import { r as RootConfig } from "./config-CqihvSgz.js";
+import { t as Callbacks } from "./callbacks-CQelTSwD.js";
+import { r as RootConfig } from "./config-BGIY5Hkg.js";
 import React from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/features/element/element-provider.d.ts
 interface ElementContextType<T, W> {
@@ -31,10 +30,10 @@ declare function createElementContext<T, W>({
       component,
       callbacks,
       children
-    }: ElementProviderProps<T, W>): react_jsx_runtime0.JSX.Element;
+    }: ElementProviderProps<T, W>): React.JSX.Element;
     displayName: string;
   };
 };
 //#endregion
 export { ElementProviderProps as n, createElementContext as r, ElementContextType as t };
-//# sourceMappingURL=element-provider-C_nBsftD.d.ts.map
+//# sourceMappingURL=element-provider-C95jVJV9.d.ts.map

package/dist/element-provider-C95jVJV9.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"element-provider-C95jVJV9.d.ts","names":[],"sources":["../src/features/element/element-provider.tsx"],"mappings":";;;;;UA+DiB,kBAAA;EACf,MAAA,EAAQ,UAAA;EACR,SAAA,EAAW,CAAA;EACX,SAAA,EAAW,SAAA,CAAU,CAAA;AAAA;AAAA,UAGN,oBAAA;EACf,MAAA,EAAQ,UAAA;EACR,SAAA,EAAW,CAAA;EACX,QAAA,EAAU,KAAA,CAAM,SAAA;EAChB,SAAA,EAAW,SAAA,CAAU,CAAA;AAAA;AAAA,UAGb,0BAAA;EACR,IAAI;AAAA;AAAA,iBAGU,oBAAA;EACd;AAAA,GACC,0BAAA;EAAA;;;;;;;;;;OA6BE,oBAAA,CAAqB,CAAA,EAAG,CAAA,IAAE,KAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/features/chat/chat-element.d.ts

@@ -1,2 +1,2 @@
-import { a as useElementComponent, i as useElementCallbacks, n as ElementProvider, o as useElementConfig, r as useElement, t as ChatElement } from "../../chat-element-CSpa62Te.js";
-export { ChatElement, ElementProvider, useElement, useElementCallbacks, useElementComponent, useElementConfig };
+import { t as ChatElement } from "../../chat-element-BbBl5CDM.js";
+export { ChatElement };

package/dist/features/chat/chat-element.js

@@ -1,2 +1,2 @@
-import { a as useElementComponent, i as useElementCallbacks, n as ElementProvider, o as useElementConfig, r as useElement, t as ChatElement } from "../../chat-element-CCsDDFif.js";
-export { ChatElement, ElementProvider, useElement, useElementCallbacks, useElementComponent, useElementConfig };
+import { ChatElement } from "./index.js";
+export { ChatElement };

package/dist/features/chat/conversation/conversation.d.ts

@@ -0,0 +1,2 @@
+import { t as Conversation } from "../../../conversation-CtpcctHL.js";
+export { Conversation };

package/dist/features/chat/conversation/conversation.js

@@ -0,0 +1,73 @@
+"use client";
+import { c as useElementComponent, i as useChat } from "../../../provider-Cps0PPXa.js";
+import { useVisibleMessages } from "../provider/use-visible-messages.js";
+import { Activity } from "./message/activity.js";
+import { MessageProvider } from "./message/provider.js";
+import { MessageParts } from "./message/part.js";
+import { MessageApproval } from "./message/approval.js";
+import { MessageContent } from "./message/content.js";
+import { MessageCopy } from "./message/copy.js";
+import { MessageFeedback } from "./message/feedback.js";
+import { MessageFooter } from "./message/footer.js";
+import { MessageFrame } from "./message/frame.js";
+import { MessageReasoning } from "./message/reasoning.js";
+import { MessageSources } from "./message/sources.js";
+import { MessageText } from "./message/text.js";
+import { MessageTimestamp } from "./message/timestamp.js";
+import { MessageTool } from "./message/tool.js";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport } from "@chatsdk-dev/ui/atoms/message-scroller";
+//#region src/features/chat/conversation/conversation.tsx
+function Conversation() {
+	const { status } = useChat();
+	const { visibleMessages } = useVisibleMessages();
+	const { withTools, withReasoning, autoScrollWhileStreaming } = useElementComponent();
+	const isBusy = status === "submitted" || status === "streaming";
+	const [followStream, setFollowStream] = useState(false);
+	const [prevBusy, setPrevBusy] = useState(isBusy);
+	if (prevBusy !== isBusy) {
+		setPrevBusy(isBusy);
+		setFollowStream(false);
+	}
+	const autoScroll = autoScrollWhileStreaming || followStream || !isBusy;
+	let lastUserId;
+	for (const message of visibleMessages) if (message.role === "user") lastUserId = message.id;
+	return /* @__PURE__ */ jsx("div", {
+		className: "flex-1 min-h-0 overflow-hidden",
+		children: /* @__PURE__ */ jsx(MessageScrollerProvider, {
+			autoScroll,
+			scrollEdgeThreshold: 32,
+			children: /* @__PURE__ */ jsxs(MessageScroller, { children: [/* @__PURE__ */ jsx(MessageScrollerViewport, { children: /* @__PURE__ */ jsxs(MessageScrollerContent, {
+				className: "p-6 pb-10 [&>[data-slot=message-scroller-item]:has([data-role=assistant])+[data-slot=message-scroller-item]:has([data-role=assistant])]:-mt-6",
+				children: [visibleMessages.map((message, index) => /* @__PURE__ */ jsx(MessageScrollerItem, {
+					messageId: message.id,
+					scrollAnchor: message.id === lastUserId,
+					children: /* @__PURE__ */ jsx(MessageProvider, {
+						message,
+						messageIndex: index,
+						children: /* @__PURE__ */ jsx(MessageFrame, { children: /* @__PURE__ */ jsxs(MessageContent, { children: [
+							/* @__PURE__ */ jsx(MessageSources, {}),
+							/* @__PURE__ */ jsxs(MessageParts, { children: [
+								/* @__PURE__ */ jsx(MessageText, {}),
+								withReasoning && /* @__PURE__ */ jsx(MessageReasoning, {}),
+								withTools && /* @__PURE__ */ jsx(MessageTool, {}),
+								/* @__PURE__ */ jsx(MessageApproval, {})
+							] }),
+							/* @__PURE__ */ jsxs(MessageFooter, { children: [
+								/* @__PURE__ */ jsx(MessageTimestamp, {}),
+								/* @__PURE__ */ jsx(MessageFeedback, {}),
+								/* @__PURE__ */ jsx(MessageCopy, {})
+							] })
+						] }) })
+					})
+				}, message.id)), /* @__PURE__ */ jsx(Activity, {})]
+			}) }), /* @__PURE__ */ jsx(MessageScrollerButton, { onClick: () => setFollowStream(true) })] })
+		})
+	});
+}
+Conversation.displayName = "ChatConversation";
+//#endregion
+export { Conversation };
+
+//# sourceMappingURL=conversation.js.map

package/dist/features/chat/conversation/conversation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation.js","names":["Message.Provider","Message.Frame","Message.Content","Message.Sources","Message.Parts","Message.Text","Message.Reasoning","Message.Tool","Message.Approval","Message.Footer","Message.Timestamp","Message.Feedback","Message.Copy"],"sources":["../../../../src/features/chat/conversation/conversation.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\n\nimport {\n  MessageScroller,\n  MessageScrollerButton,\n  MessageScrollerContent,\n  MessageScrollerItem,\n  MessageScrollerProvider,\n  MessageScrollerViewport,\n} from \"@chatsdk-dev/ui/atoms/message-scroller\";\n\nimport { useChat, useElementComponent } from \"../provider/provider\";\nimport { useVisibleMessages } from \"../provider/use-visible-messages\";\nimport { Activity } from \"./message/activity\";\nimport { Message } from \"./message\";\n\nexport function Conversation() {\n  const { status } = useChat();\n  const { visibleMessages } = useVisibleMessages();\n  const { withTools, withReasoning, autoScrollWhileStreaming } =\n    useElementComponent();\n\n  // Auto-scroll only when idle: an in-flight turn streams smoothly into the\n  // reserved canvas (no chase). When idle, autoScroll re-engages but only acts at\n  // the live edge (it releases when scrolled up), so the net effect is \"follow\n  // only when idle AND at the bottom\" — e.g. re-pin when the input grows.\n  // Opt in via `autoScrollWhileStreaming` to instead chase the live edge mid-stream.\n  const isBusy = status === \"submitted\" || status === \"streaming\";\n\n  // Clicking scroll-to-end mid-stream is an explicit \"watch the live edge\":\n  // enable autoScroll so the scroller re-engages follow when the scroll lands\n  // (scrolling up still releases it). Reset per turn transition.\n  const [followStream, setFollowStream] = useState(false);\n  const [prevBusy, setPrevBusy] = useState(isBusy);\n  if (prevBusy !== isBusy) {\n    setPrevBusy(isBusy);\n    setFollowStream(false);\n  }\n\n  const autoScroll = autoScrollWhileStreaming || followStream || !isBusy;\n\n  // Anchor only the active turn's user message. Marking every user message an\n  // anchor leaves bulk-loaded history anchors unregistered in the scroller, so\n  // its \"first unhandled anchor\" logic jumps to the first message on the next\n  // equal-count mutation (e.g. activity to assistant swap).\n  let lastUserId: string | undefined;\n  for (const message of visibleMessages) {\n    if (message.role === \"user\") lastUserId = message.id;\n  }\n\n  return (\n    <div className=\"flex-1 min-h-0 overflow-hidden\">\n      <MessageScrollerProvider autoScroll={autoScroll} scrollEdgeThreshold={32}>\n        <MessageScroller>\n          <MessageScrollerViewport>\n            {/* Consecutive assistant messages come from approval continuations\n                (the resumed stream is a new message). Collapse the gap so they\n                feel like one turn. */}\n            <MessageScrollerContent className=\"p-6 pb-10 [&>[data-slot=message-scroller-item]:has([data-role=assistant])+[data-slot=message-scroller-item]:has([data-role=assistant])]:-mt-6\">\n              {visibleMessages.map((message, index) => (\n                <MessageScrollerItem\n                  key={message.id}\n                  messageId={message.id}\n                  scrollAnchor={message.id === lastUserId}\n                >\n                  <Message.Provider message={message} messageIndex={index}>\n                    <Message.Frame>\n                      <Message.Content>\n                        <Message.Sources />\n                        <Message.Parts>\n                          <Message.Text />\n                          {withReasoning && <Message.Reasoning />}\n                          {withTools && <Message.Tool />}\n                          <Message.Approval />\n                        </Message.Parts>\n                        <Message.Footer>\n                          <Message.Timestamp />\n                          <Message.Feedback />\n                          <Message.Copy />\n                        </Message.Footer>\n                      </Message.Content>\n                    </Message.Frame>\n                  </Message.Provider>\n                </MessageScrollerItem>\n              ))}\n              <Activity />\n            </MessageScrollerContent>\n          </MessageScrollerViewport>\n          <MessageScrollerButton onClick={() => setFollowStream(true)} />\n        </MessageScroller>\n      </MessageScrollerProvider>\n    </div>\n  );\n}\n\nConversation.displayName = \"ChatConversation\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAkBA,SAAgB,eAAe;CAC7B,MAAM,EAAE,WAAW,QAAQ;CAC3B,MAAM,EAAE,oBAAoB,mBAAmB;CAC/C,MAAM,EAAE,WAAW,eAAe,6BAChC,oBAAoB;CAOtB,MAAM,SAAS,WAAW,eAAe,WAAW;CAKpD,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;CACtD,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;CAC/C,IAAI,aAAa,QAAQ;EACvB,YAAY,MAAM;EAClB,gBAAgB,KAAK;CACvB;CAEA,MAAM,aAAa,4BAA4B,gBAAgB,CAAC;CAMhE,IAAI;CACJ,KAAK,MAAM,WAAW,iBACpB,IAAI,QAAQ,SAAS,QAAQ,aAAa,QAAQ;CAGpD,OACE,oBAAC,OAAD;EAAK,WAAU;YACb,oBAAC,yBAAD;GAAqC;GAAY,qBAAqB;aACpE,qBAAC,iBAAD,EAAA,UAAA,CACE,oBAAC,yBAAD,EAAA,UAIE,qBAAC,wBAAD;IAAwB,WAAU;cAAlC,CACG,gBAAgB,KAAK,SAAS,UAC7B,oBAAC,qBAAD;KAEE,WAAW,QAAQ;KACnB,cAAc,QAAQ,OAAO;eAE7B,oBAACA,iBAAD;MAA2B;MAAS,cAAc;gBAChD,oBAACC,cAAD,EAAA,UACE,qBAACC,gBAAD,EAAA,UAAA;OACE,oBAACC,gBAAD,CAAkB,CAAA;OAClB,qBAACC,cAAD,EAAA,UAAA;QACE,oBAACC,aAAD,CAAe,CAAA;QACd,iBAAiB,oBAACC,kBAAD,CAAoB,CAAA;QACrC,aAAa,oBAACC,aAAD,CAAe,CAAA;QAC7B,oBAACC,iBAAD,CAAmB,CAAA;OACN,EAAA,CAAA;OACf,qBAACC,eAAD,EAAA,UAAA;QACE,oBAACC,kBAAD,CAAoB,CAAA;QACpB,oBAACC,iBAAD,CAAmB,CAAA;QACnB,oBAACC,aAAD,CAAe,CAAA;OACD,EAAA,CAAA;MACD,EAAA,CAAA,EACJ,CAAA;KACC,CAAA;IACC,GAtBd,QAAQ,EAsBM,CACtB,GACD,oBAAC,UAAD,CAAW,CAAA,CACW;MACD,CAAA,GACzB,oBAAC,uBAAD,EAAuB,eAAe,gBAAgB,IAAI,EAAI,CAAA,CAC/C,EAAA,CAAA;EACM,CAAA;CACtB,CAAA;AAET;AAEA,aAAa,cAAc"}

package/dist/features/chat/conversation/message/activity.d.ts

@@ -0,0 +1,12 @@
+import { ChatStatus, UIMessage } from "ai";
+
+//#region src/features/chat/conversation/message/activity.d.ts
+type AgentActivity = "thinking" | "working" | null;
+declare function getAgentActivity(messages: UIMessage[], status: ChatStatus, opts: {
+  withTools?: boolean;
+  withReasoning?: boolean;
+}): AgentActivity;
+declare function Activity(): import("react").JSX.Element | null;
+//#endregion
+export { Activity, AgentActivity, getAgentActivity };
+//# sourceMappingURL=activity.d.ts.map

package/dist/features/chat/conversation/message/activity.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"activity.d.ts","names":[],"sources":["../../../../../src/features/chat/conversation/message/activity.tsx"],"mappings":";;;KASY,aAAA;AAAA,iBAII,gBAAA,CACd,QAAA,EAAU,SAAA,IACV,MAAA,EAAQ,UAAA,EACR,IAAA;EAAQ,SAAA;EAAqB,aAAA;AAAA,IAC5B,aAAA;AAAA,iBAmCa,QAAA,oBAAQ,GAAA,CAAA,OAAA"}

package/dist/features/chat/conversation/message/activity.js

@@ -0,0 +1,48 @@
+import { c as useElementComponent, i as useChat } from "../../../../provider-Cps0PPXa.js";
+import { isMessagePartVisible } from "../../utils.js";
+import { useTranslation } from "react-i18next";
+import { jsx } from "react/jsx-runtime";
+import { MessageScrollerItem } from "@chatsdk-dev/ui/atoms/message-scroller";
+import { Marker, MarkerContent } from "@chatsdk-dev/ui/atoms/marker";
+//#region src/features/chat/conversation/message/activity.tsx
+function getAgentActivity(messages, status, opts) {
+	if (status === "submitted") return "thinking";
+	if (status !== "streaming") return null;
+	const last = messages[messages.length - 1];
+	if (last?.role !== "assistant") return "thinking";
+	const part = last.parts[last.parts.length - 1];
+	if (!part) return "thinking";
+	const type = part.type;
+	const isTool = type === "dynamic-tool" || type.startsWith("tool-");
+	if (isTool) {
+		const { approval, state } = part;
+		if (approval?.id && (state === "approval-responded" || state === "output-available" || state === "output-denied")) return "working";
+	}
+	if (isMessagePartVisible(part, opts)) return null;
+	return isTool ? "working" : "thinking";
+}
+function Activity() {
+	const { t } = useTranslation("chatsdk_elements");
+	const { messages, status } = useChat();
+	const { withTools, withReasoning } = useElementComponent();
+	const activity = getAgentActivity(messages, status, {
+		withTools,
+		withReasoning
+	});
+	if (!activity) return null;
+	return /* @__PURE__ */ jsx(MessageScrollerItem, {
+		scrollAnchor: false,
+		children: /* @__PURE__ */ jsx(Marker, {
+			role: "status",
+			"data-role": "assistant",
+			children: /* @__PURE__ */ jsx(MarkerContent, {
+				className: "shimmer shimmer-duration-1000",
+				children: activity === "working" ? t("conversation.activity.working") : t("conversation.activity.thinking")
+			})
+		})
+	});
+}
+//#endregion
+export { Activity, getAgentActivity };
+
+//# sourceMappingURL=activity.js.map

package/dist/features/chat/conversation/message/activity.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"activity.js","names":[],"sources":["../../../../../src/features/chat/conversation/message/activity.tsx"],"sourcesContent":["import { type ChatStatus, type UIMessage } from \"ai\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Marker, MarkerContent } from \"@chatsdk-dev/ui/atoms/marker\";\nimport { MessageScrollerItem } from \"@chatsdk-dev/ui/atoms/message-scroller\";\n\nimport { useChat, useElementComponent } from \"../../provider/provider\";\nimport { isMessagePartVisible } from \"../../utils\";\n\nexport type AgentActivity = \"thinking\" | \"working\" | null;\n\n// Current activity of the latest agent turn, for the trailing indicator. Null\n// once the turn renders its own content (visible reasoning/tool/text).\nexport function getAgentActivity(\n  messages: UIMessage[],\n  status: ChatStatus,\n  opts: { withTools?: boolean; withReasoning?: boolean },\n): AgentActivity {\n  if (status === \"submitted\") return \"thinking\";\n  if (status !== \"streaming\") return null;\n\n  const last = messages[messages.length - 1];\n  if (last?.role !== \"assistant\") return \"thinking\";\n\n  const part = last.parts[last.parts.length - 1];\n  if (!part) return \"thinking\";\n\n  const type = part.type as string;\n  const isTool = type === \"dynamic-tool\" || type.startsWith(\"tool-\");\n  // The continuation streams into the gated message, so its answered tool part\n  // is the last part while the approved tool executes and completes. Those\n  // state flips (responded → completed/denied) aren't new content — keep the\n  // indicator up until a genuinely new part streams in.\n  if (isTool) {\n    const { approval, state } = part as {\n      approval?: { id?: string };\n      state?: string;\n    };\n    if (\n      approval?.id &&\n      (state === \"approval-responded\" ||\n        state === \"output-available\" ||\n        state === \"output-denied\")\n    ) {\n      return \"working\";\n    }\n  }\n\n  if (isMessagePartVisible(part, opts)) return null;\n  return isTool ? \"working\" : \"thinking\";\n}\n\nexport function Activity() {\n  const { t } = useTranslation(\"chatsdk_elements\");\n  const { messages, status } = useChat();\n\n  const { withTools, withReasoning } = useElementComponent();\n\n  const activity = getAgentActivity(messages, status, {\n    withTools,\n    withReasoning,\n  });\n\n  if (!activity) {\n    return null;\n  }\n\n  return (\n    <MessageScrollerItem scrollAnchor={false}>\n      {/* data-role: stands in for the upcoming assistant content, so the\n          consecutive-assistant gap collapse also applies to the indicator. */}\n      <Marker role=\"status\" data-role=\"assistant\">\n        <MarkerContent className=\"shimmer shimmer-duration-1000\">\n          {activity === \"working\"\n            ? t(\"conversation.activity.working\")\n            : t(\"conversation.activity.thinking\")}\n        </MarkerContent>\n      </Marker>\n    </MessageScrollerItem>\n  );\n}\n"],"mappings":";;;;;;;AAaA,SAAgB,iBACd,UACA,QACA,MACe;CACf,IAAI,WAAW,aAAa,OAAO;CACnC,IAAI,WAAW,aAAa,OAAO;CAEnC,MAAM,OAAO,SAAS,SAAS,SAAS;CACxC,IAAI,MAAM,SAAS,aAAa,OAAO;CAEvC,MAAM,OAAO,KAAK,MAAM,KAAK,MAAM,SAAS;CAC5C,IAAI,CAAC,MAAM,OAAO;CAElB,MAAM,OAAO,KAAK;CAClB,MAAM,SAAS,SAAS,kBAAkB,KAAK,WAAW,OAAO;CAKjE,IAAI,QAAQ;EACV,MAAM,EAAE,UAAU,UAAU;EAI5B,IACE,UAAU,OACT,UAAU,wBACT,UAAU,sBACV,UAAU,kBAEZ,OAAO;CAEX;CAEA,IAAI,qBAAqB,MAAM,IAAI,GAAG,OAAO;CAC7C,OAAO,SAAS,YAAY;AAC9B;AAEA,SAAgB,WAAW;CACzB,MAAM,EAAE,MAAM,eAAe,kBAAkB;CAC/C,MAAM,EAAE,UAAU,WAAW,QAAQ;CAErC,MAAM,EAAE,WAAW,kBAAkB,oBAAoB;CAEzD,MAAM,WAAW,iBAAiB,UAAU,QAAQ;EAClD;EACA;CACF,CAAC;CAED,IAAI,CAAC,UACH,OAAO;CAGT,OACE,oBAAC,qBAAD;EAAqB,cAAc;YAGjC,oBAAC,QAAD;GAAQ,MAAK;GAAS,aAAU;aAC9B,oBAAC,eAAD;IAAe,WAAU;cACtB,aAAa,YACV,EAAE,+BAA+B,IACjC,EAAE,gCAAgC;GACzB,CAAA;EACT,CAAA;CACW,CAAA;AAEzB"}

package/dist/features/chat/conversation/message/approval.d.ts

@@ -0,0 +1,2 @@
+import { t as MessageApproval } from "../../../../approval-BODP4NVA.js";
+export { MessageApproval };

package/dist/features/chat/conversation/message/approval.js

@@ -0,0 +1,62 @@
+"use client";
+import { i as useChat } from "../../../../provider-Cps0PPXa.js";
+import { usePart } from "./part.js";
+import { Trans, useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { getToolName } from "ai";
+import { Confirmation, ConfirmationAccepted, ConfirmationAction, ConfirmationActions, ConfirmationRejected, ConfirmationRequest, ConfirmationTitle } from "@chatsdk-dev/ui/molecules/ai/confirmation";
+//#region src/features/chat/conversation/message/approval.tsx
+function MessageApproval() {
+	const { t } = useTranslation("chatsdk_elements");
+	const { status, respondToToolApproval } = useChat();
+	const claimed = usePart("tool");
+	if (!claimed) return null;
+	const toolPart = claimed.part;
+	const approval = toolPart.approval;
+	const approvalId = approval?.id;
+	const showsApproval = toolPart.state === "approval-requested" || toolPart.state === "approval-responded" || toolPart.state === "output-denied" || toolPart.state === "output-available";
+	if (!approvalId || !showsApproval) return null;
+	const title = toolPart.title ?? getToolName(toolPart);
+	const disabled = status === "submitted" || status === "streaming";
+	return /* @__PURE__ */ jsxs(Confirmation, {
+		approval,
+		state: toolPart.state,
+		children: [
+			/* @__PURE__ */ jsx(ConfirmationRequest, { children: /* @__PURE__ */ jsx(ConfirmationTitle, { children: /* @__PURE__ */ jsx(Trans, {
+				i18nKey: "conversation.tool-approval.request-prompt",
+				values: { title },
+				components: { strong: /* @__PURE__ */ jsx("strong", { className: "text-foreground font-semibold" }) }
+			}) }) }),
+			/* @__PURE__ */ jsx(ConfirmationAccepted, { children: /* @__PURE__ */ jsx(ConfirmationTitle, { children: /* @__PURE__ */ jsx(Trans, {
+				i18nKey: "conversation.tool-approval.accepted-note",
+				values: { title },
+				components: { strong: /* @__PURE__ */ jsx("strong", { className: "text-foreground font-semibold" }) }
+			}) }) }),
+			/* @__PURE__ */ jsx(ConfirmationRejected, { children: /* @__PURE__ */ jsx(ConfirmationTitle, { children: /* @__PURE__ */ jsx(Trans, {
+				i18nKey: "conversation.tool-approval.denied-note",
+				values: { title },
+				components: { strong: /* @__PURE__ */ jsx("strong", { className: "text-foreground font-semibold" }) }
+			}) }) }),
+			/* @__PURE__ */ jsxs(ConfirmationActions, { children: [/* @__PURE__ */ jsx(ConfirmationAction, {
+				variant: "outline",
+				disabled,
+				onClick: () => respondToToolApproval({
+					approvalId,
+					approved: false
+				}),
+				children: t("conversation.tool-approval.deny")
+			}), /* @__PURE__ */ jsx(ConfirmationAction, {
+				disabled,
+				onClick: () => respondToToolApproval({
+					approvalId,
+					approved: true
+				}),
+				children: t("conversation.tool-approval.accept")
+			})] })
+		]
+	});
+}
+//#endregion
+export { MessageApproval };
+
+//# sourceMappingURL=approval.js.map

package/dist/features/chat/conversation/message/approval.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"approval.js","names":[],"sources":["../../../../../src/features/chat/conversation/message/approval.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ToolUIPart } from \"ai\";\nimport { getToolName } from \"ai\";\nimport { Trans, useTranslation } from \"react-i18next\";\n\nimport {\n  Confirmation,\n  ConfirmationAccepted,\n  ConfirmationAction,\n  ConfirmationActions,\n  ConfirmationRejected,\n  ConfirmationRequest,\n  ConfirmationTitle,\n} from \"@chatsdk-dev/ui/molecules/ai/confirmation\";\nimport { type ToolPart } from \"@chatsdk-dev/ui/molecules/ai/tool\";\n\nimport { useChat } from \"../../provider/provider\";\nimport { usePart } from \"./part\";\n\n// Approval gates a paused turn — a blocking interaction, not tool-detail chrome.\n// Its own file so it renders even when `Message.Tool` is left out.\nexport function MessageApproval() {\n  const { t } = useTranslation(\"chatsdk_elements\");\n  const { status, respondToToolApproval } = useChat();\n  const claimed = usePart(\"tool\");\n  if (!claimed) return null;\n\n  const toolPart = claimed.part as unknown as ToolPart;\n  const approval = toolPart.approval;\n  const approvalId = approval?.id;\n  // Answered approvals keep rendering as a resolved note (audit trail survives\n  // the persisted-turn reseed and history). Other states (streaming input,\n  // post-approval error) would render an empty Confirmation shell — skip.\n  const showsApproval =\n    toolPart.state === \"approval-requested\" ||\n    toolPart.state === \"approval-responded\" ||\n    toolPart.state === \"output-denied\" ||\n    toolPart.state === \"output-available\";\n  if (!approvalId || !showsApproval) {\n    return null;\n  }\n\n  const title =\n    toolPart.title ?? getToolName(toolPart as unknown as ToolUIPart);\n  // Disable while a turn is in flight (incl. the optimistic flip) to prevent\n  // double-submit.\n  const disabled = status === \"submitted\" || status === \"streaming\";\n\n  return (\n    <Confirmation approval={approval} state={toolPart.state}>\n      <ConfirmationRequest>\n        <ConfirmationTitle>\n          <Trans\n            i18nKey=\"conversation.tool-approval.request-prompt\"\n            values={{ title }}\n            components={{\n              strong: <strong className=\"text-foreground font-semibold\" />,\n            }}\n          />\n        </ConfirmationTitle>\n      </ConfirmationRequest>\n      <ConfirmationAccepted>\n        <ConfirmationTitle>\n          <Trans\n            i18nKey=\"conversation.tool-approval.accepted-note\"\n            values={{ title }}\n            components={{\n              strong: <strong className=\"text-foreground font-semibold\" />,\n            }}\n          />\n        </ConfirmationTitle>\n      </ConfirmationAccepted>\n      <ConfirmationRejected>\n        <ConfirmationTitle>\n          <Trans\n            i18nKey=\"conversation.tool-approval.denied-note\"\n            values={{ title }}\n            components={{\n              strong: <strong className=\"text-foreground font-semibold\" />,\n            }}\n          />\n        </ConfirmationTitle>\n      </ConfirmationRejected>\n      <ConfirmationActions>\n        <ConfirmationAction\n          variant=\"outline\"\n          disabled={disabled}\n          onClick={() => respondToToolApproval({ approvalId, approved: false })}\n        >\n          {t(\"conversation.tool-approval.deny\")}\n        </ConfirmationAction>\n        <ConfirmationAction\n          disabled={disabled}\n          onClick={() => respondToToolApproval({ approvalId, approved: true })}\n        >\n          {t(\"conversation.tool-approval.accept\")}\n        </ConfirmationAction>\n      </ConfirmationActions>\n    </Confirmation>\n  );\n}\n"],"mappings":";;;;;;;;AAsBA,SAAgB,kBAAkB;CAChC,MAAM,EAAE,MAAM,eAAe,kBAAkB;CAC/C,MAAM,EAAE,QAAQ,0BAA0B,QAAQ;CAClD,MAAM,UAAU,QAAQ,MAAM;CAC9B,IAAI,CAAC,SAAS,OAAO;CAErB,MAAM,WAAW,QAAQ;CACzB,MAAM,WAAW,SAAS;CAC1B,MAAM,aAAa,UAAU;CAI7B,MAAM,gBACJ,SAAS,UAAU,wBACnB,SAAS,UAAU,wBACnB,SAAS,UAAU,mBACnB,SAAS,UAAU;CACrB,IAAI,CAAC,cAAc,CAAC,eAClB,OAAO;CAGT,MAAM,QACJ,SAAS,SAAS,YAAY,QAAiC;CAGjE,MAAM,WAAW,WAAW,eAAe,WAAW;CAEtD,OACE,qBAAC,cAAD;EAAwB;EAAU,OAAO,SAAS;YAAlD;GACE,oBAAC,qBAAD,EAAA,UACE,oBAAC,mBAAD,EAAA,UACE,oBAAC,OAAD;IACE,SAAQ;IACR,QAAQ,EAAE,MAAM;IAChB,YAAY,EACV,QAAQ,oBAAC,UAAD,EAAQ,WAAU,gCAAiC,CAAA,EAC7D;GACD,CAAA,EACgB,CAAA,EACA,CAAA;GACrB,oBAAC,sBAAD,EAAA,UACE,oBAAC,mBAAD,EAAA,UACE,oBAAC,OAAD;IACE,SAAQ;IACR,QAAQ,EAAE,MAAM;IAChB,YAAY,EACV,QAAQ,oBAAC,UAAD,EAAQ,WAAU,gCAAiC,CAAA,EAC7D;GACD,CAAA,EACgB,CAAA,EACC,CAAA;GACtB,oBAAC,sBAAD,EAAA,UACE,oBAAC,mBAAD,EAAA,UACE,oBAAC,OAAD;IACE,SAAQ;IACR,QAAQ,EAAE,MAAM;IAChB,YAAY,EACV,QAAQ,oBAAC,UAAD,EAAQ,WAAU,gCAAiC,CAAA,EAC7D;GACD,CAAA,EACgB,CAAA,EACC,CAAA;GACtB,qBAAC,qBAAD,EAAA,UAAA,CACE,oBAAC,oBAAD;IACE,SAAQ;IACE;IACV,eAAe,sBAAsB;KAAE;KAAY,UAAU;IAAM,CAAC;cAEnE,EAAE,iCAAiC;GAClB,CAAA,GACpB,oBAAC,oBAAD;IACY;IACV,eAAe,sBAAsB;KAAE;KAAY,UAAU;IAAK,CAAC;cAElE,EAAE,mCAAmC;GACpB,CAAA,CACD,EAAA,CAAA;EACT;;AAElB"}

package/dist/features/chat/conversation/message/avatar.d.ts

@@ -0,0 +1,2 @@
+import { t as MessageAvatar } from "../../../../avatar-CK5WGu6N.js";
+export { MessageAvatar };

package/dist/features/chat/conversation/message/avatar.js

@@ -0,0 +1,18 @@
+import { useMessage } from "./provider.js";
+import { jsx } from "react/jsx-runtime";
+import { BotIcon, UserIcon } from "lucide-react";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+//#region src/features/chat/conversation/message/avatar.tsx
+function MessageAvatar() {
+	const { message } = useMessage();
+	const isUser = message.role === "user";
+	const isAssistant = message.role === "assistant";
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("flex size-8 shrink-0 items-center justify-center rounded-full border text-xs mt-0.25", isUser ? "bg-primary text-primary-foreground border-primary" : isAssistant ? "bg-zinc-100 text-zinc-600 border-zinc-200 dark:bg-zinc-800 dark:text-zinc-400 dark:border-zinc-700" : "bg-amber-50 text-amber-600 border-amber-200 dark:bg-amber-950 dark:text-amber-400 dark:border-amber-800"),
+		children: isUser ? /* @__PURE__ */ jsx(UserIcon, { className: "size-4" }) : /* @__PURE__ */ jsx(BotIcon, { className: "size-4" })
+	});
+}
+//#endregion
+export { MessageAvatar };
+
+//# sourceMappingURL=avatar.js.map

package/dist/features/chat/conversation/message/avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar.js","names":[],"sources":["../../../../../src/features/chat/conversation/message/avatar.tsx"],"sourcesContent":["import { BotIcon, UserIcon } from \"lucide-react\";\n\nimport { cn } from \"@chatsdk-dev/ui/lib/utils\";\n\nimport { useMessage } from \"./provider\";\n\nexport function MessageAvatar() {\n  const { message } = useMessage();\n\n  const isUser = message.role === \"user\";\n  const isAssistant = message.role === \"assistant\";\n  return (\n    <div\n      className={cn(\n        \"flex size-8 shrink-0 items-center justify-center rounded-full border text-xs mt-0.25\",\n        isUser\n          ? \"bg-primary text-primary-foreground border-primary\"\n          : isAssistant\n            ? \"bg-zinc-100 text-zinc-600 border-zinc-200 dark:bg-zinc-800 dark:text-zinc-400 dark:border-zinc-700\"\n            : \"bg-amber-50 text-amber-600 border-amber-200 dark:bg-amber-950 dark:text-amber-400 dark:border-amber-800\",\n      )}\n    >\n      {isUser ? (\n        <UserIcon className=\"size-4\" />\n      ) : (\n        <BotIcon className=\"size-4\" />\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;AAMA,SAAgB,gBAAgB;CAC9B,MAAM,EAAE,YAAY,WAAW;CAE/B,MAAM,SAAS,QAAQ,SAAS;CAChC,MAAM,cAAc,QAAQ,SAAS;CACrC,OACE,oBAAC,OAAD;EACE,WAAW,GACT,wFACA,SACI,sDACA,cACE,uGACA,yGACR;YAEC,SACC,oBAAC,UAAD,EAAU,WAAU,SAAU,CAAA,IAE9B,oBAAC,SAAD,EAAS,WAAU,SAAU,CAAA;CAE5B,CAAA;AAET"}

package/dist/features/chat/conversation/message/content.d.ts

@@ -0,0 +1,2 @@
+import { t as MessageContent } from "../../../../content-BoiPVwgM.js";
+export { MessageContent };

package/dist/features/chat/conversation/message/content.js

@@ -0,0 +1,11 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { MessageContent as MessageContent$1 } from "@chatsdk-dev/ui/atoms/message";
+//#region src/features/chat/conversation/message/content.tsx
+function MessageContent({ children }) {
+	return /* @__PURE__ */ jsx(MessageContent$1, { children });
+}
+//#endregion
+export { MessageContent };
+
+//# sourceMappingURL=content.js.map

package/dist/features/chat/conversation/message/content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"content.js","names":["UIMessageContent"],"sources":["../../../../../src/features/chat/conversation/message/content.tsx"],"sourcesContent":["\"use client\";\n\nimport { MessageContent as UIMessageContent } from \"@chatsdk-dev/ui/atoms/message\";\n\ninterface ContentProps {\n  children: React.ReactNode;\n}\n\n// The content column beside the avatar: header, bubble(s), footer.\nexport function MessageContent({ children }: ContentProps) {\n  return <UIMessageContent>{children}</UIMessageContent>;\n}\n"],"mappings":";;;;AASA,SAAgB,eAAe,EAAE,YAA0B;CACzD,OAAO,oBAACA,kBAAD,EAAmB,SAA2B,CAAA;AACvD"}

package/dist/features/chat/conversation/message/copy.d.ts

@@ -0,0 +1,2 @@
+import { t as MessageCopy } from "../../../../copy-BPB94kUd.js";
+export { MessageCopy };

package/dist/features/chat/conversation/message/copy.js

@@ -0,0 +1,30 @@
+"use client";
+import { useMessage } from "./provider.js";
+import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CheckIcon, CopyIcon } from "lucide-react";
+import { Tooltip, TooltipContent, TooltipTrigger } from "@chatsdk-dev/ui/atoms/tooltip";
+import { useCopyToClipboard } from "@chatsdk-dev/ui/hooks/use-copy-to-clipboard";
+import { Action } from "@chatsdk-dev/ui/molecules/ai/action";
+//#region src/features/chat/conversation/message/copy.tsx
+function MessageCopy() {
+	const { t } = useTranslation("chatsdk_elements");
+	const { copied, copyToClipboard } = useCopyToClipboard();
+	const { message } = useMessage();
+	const text = message.parts.filter((part) => part.type === "text").map((part) => part.text).join("\n");
+	return /* @__PURE__ */ jsxs(Tooltip, {
+		open: copied,
+		children: [/* @__PURE__ */ jsx(TooltipTrigger, { render: /* @__PURE__ */ jsxs(Action, {
+			onClick: () => copyToClipboard?.(text),
+			label: t("conversation.message.copy"),
+			children: [copied ? /* @__PURE__ */ jsx(CheckIcon, { className: "size-3" }) : /* @__PURE__ */ jsx(CopyIcon, { className: "size-3" }), /* @__PURE__ */ jsx("span", {
+				className: "sr-only",
+				children: t("copied")
+			})]
+		}) }), /* @__PURE__ */ jsx(TooltipContent, { children: t("copied") })]
+	});
+}
+//#endregion
+export { MessageCopy };
+
+//# sourceMappingURL=copy.js.map

package/dist/features/chat/conversation/message/copy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy.js","names":[],"sources":["../../../../../src/features/chat/conversation/message/copy.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon, CopyIcon } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipTrigger,\n} from \"@chatsdk-dev/ui/atoms/tooltip\";\nimport { useCopyToClipboard } from \"@chatsdk-dev/ui/hooks/use-copy-to-clipboard\";\nimport { Action } from \"@chatsdk-dev/ui/molecules/ai/action\";\n\nimport { useMessage } from \"./provider\";\n\nexport function MessageCopy() {\n  const { t } = useTranslation(\"chatsdk_elements\");\n  const { copied, copyToClipboard } = useCopyToClipboard();\n  const { message } = useMessage();\n  const text = message.parts\n    .filter((part) => part.type === \"text\")\n    .map((part) => (part as { text: string }).text)\n    .join(\"\\n\");\n\n  return (\n    <Tooltip open={copied}>\n      <TooltipTrigger\n        render={\n          <Action\n            onClick={() => copyToClipboard?.(text)}\n            label={t(\"conversation.message.copy\")}\n          >\n            {copied ? (\n              <CheckIcon className=\"size-3\" />\n            ) : (\n              <CopyIcon className=\"size-3\" />\n            )}\n            <span className=\"sr-only\">{t(\"copied\")}</span>\n          </Action>\n        }\n      />\n      <TooltipContent>{t(\"copied\")}</TooltipContent>\n    </Tooltip>\n  );\n}\n"],"mappings":";;;;;;;;;AAeA,SAAgB,cAAc;CAC5B,MAAM,EAAE,MAAM,eAAe,kBAAkB;CAC/C,MAAM,EAAE,QAAQ,oBAAoB,mBAAmB;CACvD,MAAM,EAAE,YAAY,WAAW;CAC/B,MAAM,OAAO,QAAQ,MAClB,QAAQ,SAAS,KAAK,SAAS,MAAM,CAAC,CACtC,KAAK,SAAU,KAA0B,IAAI,CAAC,CAC9C,KAAK,IAAI;CAEZ,OACE,qBAAC,SAAD;EAAS,MAAM;YAAf,CACE,oBAAC,gBAAD,EACE,QACE,qBAAC,QAAD;GACE,eAAe,kBAAkB,IAAI;GACrC,OAAO,EAAE,2BAA2B;aAFtC,CAIG,SACC,oBAAC,WAAD,EAAW,WAAU,SAAU,CAAA,IAE/B,oBAAC,UAAD,EAAU,WAAU,SAAU,CAAA,GAEhC,oBAAC,QAAD;IAAM,WAAU;cAAW,EAAE,QAAQ;GAAQ,CAAA,CACvC;KAEX,CAAA,GACD,oBAAC,gBAAD,EAAA,UAAiB,EAAE,QAAQ,EAAkB,CAAA,CACtC;;AAEb"}

package/dist/features/chat/conversation/message/feedback.d.ts

@@ -0,0 +1,2 @@
+import { t as MessageFeedback } from "../../../../feedback-hofC2MHC.js";
+export { MessageFeedback };

package/dist/features/chat/conversation/message/feedback.js

@@ -0,0 +1,36 @@
+"use client";
+import { i as useChat } from "../../../../provider-Cps0PPXa.js";
+import { useMessage } from "./provider.js";
+import { useTranslation } from "react-i18next";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { ThumbsDown, ThumbsUp } from "lucide-react";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { Action } from "@chatsdk-dev/ui/molecules/ai/action";
+//#region src/features/chat/conversation/message/feedback.tsx
+function MessageFeedback() {
+	const { t } = useTranslation("chatsdk_elements");
+	const { message } = useMessage();
+	const { conversation, recordMessageFeedback } = useChat();
+	const active = conversation?.feedback?.[message.id] ?? null;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Action, {
+		label: t("conversation.message.like"),
+		className: cn(active === "positive" && "text-primary"),
+		onClick: () => recordMessageFeedback({
+			messageId: message.id,
+			sentiment: "positive"
+		}),
+		children: /* @__PURE__ */ jsx(ThumbsUp, { className: "size-3 mb-1" })
+	}), /* @__PURE__ */ jsx(Action, {
+		label: t("conversation.message.dislike"),
+		className: cn(active === "negative" && "text-destructive"),
+		onClick: () => recordMessageFeedback({
+			messageId: message.id,
+			sentiment: "negative"
+		}),
+		children: /* @__PURE__ */ jsx(ThumbsDown, { className: "size-3" })
+	})] });
+}
+//#endregion
+export { MessageFeedback };
+
+//# sourceMappingURL=feedback.js.map

package/dist/features/chat/conversation/message/feedback.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"feedback.js","names":[],"sources":["../../../../../src/features/chat/conversation/message/feedback.tsx"],"sourcesContent":["\"use client\";\n\nimport { ThumbsDown, ThumbsUp } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { cn } from \"@chatsdk-dev/ui/lib/utils\";\nimport { Action } from \"@chatsdk-dev/ui/molecules/ai/action\";\n\nimport { useChat } from \"../../provider/provider\";\nimport { useMessage } from \"./provider\";\n\nexport function MessageFeedback() {\n  const { t } = useTranslation(\"chatsdk_elements\");\n  const { message } = useMessage();\n  const { conversation, recordMessageFeedback } = useChat();\n  const active = conversation?.feedback?.[message.id] ?? null;\n\n  return (\n    <>\n      <Action\n        label={t(\"conversation.message.like\")}\n        className={cn(active === \"positive\" && \"text-primary\")}\n        onClick={() =>\n          recordMessageFeedback({\n            messageId: message.id,\n            sentiment: \"positive\",\n          })\n        }\n      >\n        <ThumbsUp className=\"size-3 mb-1\" />\n      </Action>\n      <Action\n        label={t(\"conversation.message.dislike\")}\n        className={cn(active === \"negative\" && \"text-destructive\")}\n        onClick={() =>\n          recordMessageFeedback({\n            messageId: message.id,\n            sentiment: \"negative\",\n          })\n        }\n      >\n        <ThumbsDown className=\"size-3\" />\n      </Action>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;AAWA,SAAgB,kBAAkB;CAChC,MAAM,EAAE,MAAM,eAAe,kBAAkB;CAC/C,MAAM,EAAE,YAAY,WAAW;CAC/B,MAAM,EAAE,cAAc,0BAA0B,QAAQ;CACxD,MAAM,SAAS,cAAc,WAAW,QAAQ,OAAO;CAEvD,OACE,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,QAAD;EACE,OAAO,EAAE,2BAA2B;EACpC,WAAW,GAAG,WAAW,cAAc,cAAc;EACrD,eACE,sBAAsB;GACpB,WAAW,QAAQ;GACnB,WAAW;EACb,CAAC;YAGH,oBAAC,UAAD,EAAU,WAAU,cAAe,CAAA;CAC7B,CAAA,GACR,oBAAC,QAAD;EACE,OAAO,EAAE,8BAA8B;EACvC,WAAW,GAAG,WAAW,cAAc,kBAAkB;EACzD,eACE,sBAAsB;GACpB,WAAW,QAAQ;GACnB,WAAW;EACb,CAAC;YAGH,oBAAC,YAAD,EAAY,WAAU,SAAU,CAAA;CAC1B,CAAA,CACR,EAAA,CAAA;AAEN"}

package/dist/features/chat/conversation/message/footer.d.ts

@@ -0,0 +1,2 @@
+import { t as MessageFooter } from "../../../../footer-BdcVsDmw.js";
+export { MessageFooter };

package/dist/features/chat/conversation/message/footer.js

@@ -0,0 +1,20 @@
+"use client";
+import { useMessage } from "./provider.js";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "@chatsdk-dev/ui/lib/utils";
+import { MessageFooter as MessageFooter$1 } from "@chatsdk-dev/ui/atoms/message";
+//#region src/features/chat/conversation/message/footer.tsx
+function MessageFooter({ children, className }) {
+	const { message, isFirst } = useMessage();
+	const hasText = message.parts.some((part) => part.type === "text" && (part.text?.length ?? 0) > 0);
+	const pendingApproval = message.parts.some((part) => (part.type === "dynamic-tool" || part.type.startsWith("tool-")) && part.state === "approval-requested");
+	if (message.role !== "assistant" || isFirst || !hasText || pendingApproval) return null;
+	return /* @__PURE__ */ jsx(MessageFooter$1, {
+		className: cn("-mt-2", className),
+		children
+	});
+}
+//#endregion
+export { MessageFooter };
+
+//# sourceMappingURL=footer.js.map

package/dist/features/chat/conversation/message/footer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"footer.js","names":["UIMessageFooter"],"sources":["../../../../../src/features/chat/conversation/message/footer.tsx"],"sourcesContent":["\"use client\";\n\nimport { MessageFooter as UIMessageFooter } from \"@chatsdk-dev/ui/atoms/message\";\nimport { cn } from \"@chatsdk-dev/ui/lib/utils\";\n\nimport { useMessage } from \"./provider\";\n\n// Layout + visibility for the per-turn action bar. Composed children\n// (timestamp, copy, feedback) are the features; omit one to drop it on a surface.\nexport function MessageFooter({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  const { message, isFirst } = useMessage();\n  // Show under a completed textual answer; never on the greeting or a paused\n  // approval turn (which ends on the tool part awaiting a response).\n  const hasText = message.parts.some(\n    (part) =>\n      part.type === \"text\" &&\n      ((part as { text?: string }).text?.length ?? 0) > 0,\n  );\n  const pendingApproval = message.parts.some(\n    (part) =>\n      (part.type === \"dynamic-tool\" ||\n        (part.type as string).startsWith(\"tool-\")) &&\n      (part as { state?: string }).state === \"approval-requested\",\n  );\n  if (message.role !== \"assistant\" || isFirst || !hasText || pendingApproval) {\n    return null;\n  }\n\n  // Tuck the action bar against its answer instead of inheriting the\n  // `MessageContent` inter-part gap, so it reads as part of the turn.\n  return (\n    <UIMessageFooter className={cn(\"-mt-2\", className)}>\n      {children}\n    </UIMessageFooter>\n  );\n}\n"],"mappings":";;;;;;AASA,SAAgB,cAAc,EAC5B,UACA,aAIC;CACD,MAAM,EAAE,SAAS,YAAY,WAAW;CAGxC,MAAM,UAAU,QAAQ,MAAM,MAC3B,SACC,KAAK,SAAS,WACZ,KAA2B,MAAM,UAAU,KAAK,CACtD;CACA,MAAM,kBAAkB,QAAQ,MAAM,MACnC,UACE,KAAK,SAAS,kBACZ,KAAK,KAAgB,WAAW,OAAO,MACzC,KAA4B,UAAU,oBAC3C;CACA,IAAI,QAAQ,SAAS,eAAe,WAAW,CAAC,WAAW,iBACzD,OAAO;CAKT,OACE,oBAACA,iBAAD;EAAiB,WAAW,GAAG,SAAS,SAAS;EAC9C;CACc,CAAA;AAErB"}

package/dist/features/chat/conversation/message/frame.d.ts

@@ -0,0 +1,2 @@
+import { t as MessageFrame } from "../../../../frame-D_ce2ErP.js";
+export { MessageFrame };

package/dist/features/chat/conversation/message/frame.js

@@ -0,0 +1,18 @@
+"use client";
+import { useMessage } from "./provider.js";
+import { jsx } from "react/jsx-runtime";
+import { Message } from "@chatsdk-dev/ui/atoms/message";
+//#region src/features/chat/conversation/message/frame.tsx
+function MessageFrame({ children }) {
+	const { message } = useMessage();
+	return /* @__PURE__ */ jsx(Message, {
+		align: message.role === "user" ? "end" : "start",
+		"data-message-id": message.id,
+		"data-role": message.role,
+		children
+	});
+}
+//#endregion
+export { MessageFrame };
+
+//# sourceMappingURL=frame.js.map

package/dist/features/chat/conversation/message/frame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame.js","names":["UIMessage"],"sources":["../../../../../src/features/chat/conversation/message/frame.tsx"],"sourcesContent":["\"use client\";\n\nimport { Message as UIMessage } from \"@chatsdk-dev/ui/atoms/message\";\n\nimport { useMessage } from \"./provider\";\n\ninterface MessageProps {\n  children?: React.ReactNode;\n}\n\nexport function MessageFrame({ children }: MessageProps) {\n  const { message } = useMessage();\n\n  const isUser = message.role === \"user\";\n  return (\n    <UIMessage\n      align={isUser ? \"end\" : \"start\"}\n      data-message-id={message.id}\n      data-role={message.role}\n    >\n      {children}\n    </UIMessage>\n  );\n}\n"],"mappings":";;;;;AAUA,SAAgB,aAAa,EAAE,YAA0B;CACvD,MAAM,EAAE,YAAY,WAAW;CAG/B,OACE,oBAACA,SAAD;EACE,OAHW,QAAQ,SAAS,SAGZ,QAAQ;EACxB,mBAAiB,QAAQ;EACzB,aAAW,QAAQ;EAElB;CACQ,CAAA;AAEf"}

package/dist/features/chat/conversation/message/index.d.ts

@@ -0,0 +1,2 @@
+import { t as index_parts_d_exports } from "./index.parts.js";
+export { index_parts_d_exports as Message };

package/dist/features/chat/conversation/message/index.js

@@ -0,0 +1,2 @@
+import { t as index_parts_exports } from "./index.parts.js";
+export { index_parts_exports as Message };

package/dist/features/chat/conversation/message/index.parts.d.ts

@@ -0,0 +1,22 @@
+import { t as MessageApproval } from "../../../../approval-BODP4NVA.js";
+import { t as MessageAvatar } from "../../../../avatar-CK5WGu6N.js";
+import { t as MessageContent } from "../../../../content-BoiPVwgM.js";
+import { t as MessageCopy } from "../../../../copy-BPB94kUd.js";
+import { t as MessageFeedback } from "../../../../feedback-hofC2MHC.js";
+import { t as MessageFooter } from "../../../../footer-BdcVsDmw.js";
+import { t as MessageFrame } from "../../../../frame-D_ce2ErP.js";
+import { t as MessageParts } from "../../../../part-C8ZA6iZn.js";
+import { n as MessageProvider } from "../../../../provider-CkkKc2aq.js";
+import { t as MessageReasoning } from "../../../../reasoning-BRNu_n6T.js";
+import { t as MessageSources } from "../../../../sources-BXoSxNYc.js";
+import { t as MessageText } from "../../../../text-Cio_Hj_h.js";
+import { t as MessageTimestamp } from "../../../../timestamp-CbU3bLa3.js";
+import { t as MessageTool } from "../../../../tool-DskTWxZb.js";
+
+//#region src/features/chat/conversation/message/index.parts.d.ts
+declare namespace index_parts_d_exports {
+  export { MessageApproval as Approval, MessageAvatar as Avatar, MessageContent as Content, MessageCopy as Copy, MessageFeedback as Feedback, MessageFooter as Footer, MessageFrame as Frame, MessageParts as Parts, MessageProvider as Provider, MessageReasoning as Reasoning, MessageSources as Sources, MessageText as Text, MessageTimestamp as Timestamp, MessageTool as Tool };
+}
+//#endregion
+export { MessageApproval as Approval, MessageAvatar as Avatar, MessageContent as Content, MessageCopy as Copy, MessageFeedback as Feedback, MessageFooter as Footer, MessageFrame as Frame, MessageParts as Parts, MessageProvider as Provider, MessageReasoning as Reasoning, MessageSources as Sources, MessageText as Text, MessageTimestamp as Timestamp, MessageTool as Tool, index_parts_d_exports as t };
+//# sourceMappingURL=index.parts.d.ts.map

package/dist/features/chat/conversation/message/index.parts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.d.ts","names":[],"sources":["../../../../../src/features/chat/conversation/message/index.parts.ts"],"mappings":""}

package/dist/features/chat/conversation/message/index.parts.js

@@ -0,0 +1,36 @@
+import { t as __exportAll } from "../../../../rolldown-runtime-D7D4PA-g.js";
+import { MessageProvider } from "./provider.js";
+import { MessageParts } from "./part.js";
+import { MessageApproval } from "./approval.js";
+import { MessageAvatar } from "./avatar.js";
+import { MessageContent } from "./content.js";
+import { MessageCopy } from "./copy.js";
+import { MessageFeedback } from "./feedback.js";
+import { MessageFooter } from "./footer.js";
+import { MessageFrame } from "./frame.js";
+import { MessageReasoning } from "./reasoning.js";
+import { MessageSources } from "./sources.js";
+import { MessageText } from "./text.js";
+import { MessageTimestamp } from "./timestamp.js";
+import { MessageTool } from "./tool.js";
+//#region src/features/chat/conversation/message/index.parts.ts
+var index_parts_exports = /* @__PURE__ */ __exportAll({
+	Approval: () => MessageApproval,
+	Avatar: () => MessageAvatar,
+	Content: () => MessageContent,
+	Copy: () => MessageCopy,
+	Feedback: () => MessageFeedback,
+	Footer: () => MessageFooter,
+	Frame: () => MessageFrame,
+	Parts: () => MessageParts,
+	Provider: () => MessageProvider,
+	Reasoning: () => MessageReasoning,
+	Sources: () => MessageSources,
+	Text: () => MessageText,
+	Timestamp: () => MessageTimestamp,
+	Tool: () => MessageTool
+});
+//#endregion
+export { MessageApproval as Approval, MessageAvatar as Avatar, MessageContent as Content, MessageCopy as Copy, MessageFeedback as Feedback, MessageFooter as Footer, MessageFrame as Frame, MessageParts as Parts, MessageProvider as Provider, MessageReasoning as Reasoning, MessageSources as Sources, MessageText as Text, MessageTimestamp as Timestamp, MessageTool as Tool, index_parts_exports as t };
+
+//# sourceMappingURL=index.parts.js.map

package/dist/features/chat/conversation/message/index.parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.parts.js","names":[],"sources":["../../../../../src/features/chat/conversation/message/index.parts.ts"],"sourcesContent":["export { MessageApproval as Approval } from \"./approval\";\nexport { MessageAvatar as Avatar } from \"./avatar\";\nexport { MessageContent as Content } from \"./content\";\nexport { MessageCopy as Copy } from \"./copy\";\nexport { MessageFeedback as Feedback } from \"./feedback\";\nexport { MessageFooter as Footer } from \"./footer\";\nexport { MessageFrame as Frame } from \"./frame\";\nexport { MessageParts as Parts } from \"./part\";\nexport { MessageProvider as Provider } from \"./provider\";\nexport { MessageReasoning as Reasoning } from \"./reasoning\";\nexport { MessageSources as Sources } from \"./sources\";\nexport { MessageText as Text } from \"./text\";\nexport { MessageTimestamp as Timestamp } from \"./timestamp\";\nexport { MessageTool as Tool } from \"./tool\";\n"],"mappings":""}

package/dist/features/chat/conversation/message/message.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/features/chat/conversation/message/message.js

@@ -0,0 +1 @@
+export {};

package/dist/features/chat/conversation/message/part.d.ts

@@ -0,0 +1,2 @@
+import { n as PartProvider, r as usePart, t as MessageParts } from "../../../../part-C8ZA6iZn.js";
+export { MessageParts, PartProvider, usePart };