185 lines
9.0 KiB
JavaScript
185 lines
9.0 KiB
JavaScript
const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
|
|
const require_CopilotChatConfigurationProvider = require('../../providers/CopilotChatConfigurationProvider.cjs');
|
|
const require_button = require('../ui/button.cjs');
|
|
const require_tooltip = require('../ui/tooltip.cjs');
|
|
const require_slots = require('../../lib/slots.cjs');
|
|
let react = require("react");
|
|
let tailwind_merge = require("tailwind-merge");
|
|
let lucide_react = require("lucide-react");
|
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
|
|
//#region src/components/chat/CopilotChatUserMessage.tsx
|
|
function flattenUserMessageContent(content) {
|
|
if (!content) return "";
|
|
if (typeof content === "string") return content;
|
|
return content.map((part) => {
|
|
if (part && typeof part === "object" && "type" in part && part.type === "text" && typeof part.text === "string") return part.text;
|
|
return "";
|
|
}).filter((text) => text.length > 0).join("\n");
|
|
}
|
|
function CopilotChatUserMessage({ message, onEditMessage, branchIndex, numberOfBranches, onSwitchToBranch, additionalToolbarItems, messageRenderer, toolbar, copyButton, editButton, branchNavigation, children, className, ...props }) {
|
|
const flattenedContent = (0, react.useMemo)(() => flattenUserMessageContent(message.content), [message.content]);
|
|
const BoundMessageRenderer = require_slots.renderSlot(messageRenderer, CopilotChatUserMessage.MessageRenderer, { content: flattenedContent });
|
|
const BoundCopyButton = require_slots.renderSlot(copyButton, CopilotChatUserMessage.CopyButton, { onClick: async () => {
|
|
if (flattenedContent) try {
|
|
await navigator.clipboard.writeText(flattenedContent);
|
|
} catch (err) {
|
|
console.error("Failed to copy message:", err);
|
|
}
|
|
} });
|
|
const BoundEditButton = require_slots.renderSlot(editButton, CopilotChatUserMessage.EditButton, { onClick: () => onEditMessage?.({ message }) });
|
|
const BoundBranchNavigation = require_slots.renderSlot(branchNavigation, CopilotChatUserMessage.BranchNavigation, {
|
|
currentBranch: branchIndex,
|
|
numberOfBranches,
|
|
onSwitchToBranch,
|
|
message
|
|
});
|
|
const showBranchNavigation = numberOfBranches && numberOfBranches > 1 && onSwitchToBranch;
|
|
const BoundToolbar = require_slots.renderSlot(toolbar, CopilotChatUserMessage.Toolbar, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
className: "cpk:flex cpk:items-center cpk:gap-1 cpk:justify-end",
|
|
children: [
|
|
additionalToolbarItems,
|
|
BoundCopyButton,
|
|
onEditMessage && BoundEditButton,
|
|
showBranchNavigation && BoundBranchNavigation
|
|
]
|
|
}) });
|
|
if (children) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
"data-copilotkit": true,
|
|
style: { display: "contents" },
|
|
children: children({
|
|
messageRenderer: BoundMessageRenderer,
|
|
toolbar: BoundToolbar,
|
|
copyButton: BoundCopyButton,
|
|
editButton: BoundEditButton,
|
|
branchNavigation: BoundBranchNavigation,
|
|
message,
|
|
branchIndex,
|
|
numberOfBranches,
|
|
additionalToolbarItems
|
|
})
|
|
});
|
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
"data-copilotkit": true,
|
|
"data-testid": "copilot-user-message",
|
|
className: (0, tailwind_merge.twMerge)("copilotKitMessage copilotKitUserMessage cpk:flex cpk:flex-col cpk:items-end cpk:group cpk:pt-10", className),
|
|
"data-message-id": message.id,
|
|
...props,
|
|
children: [BoundMessageRenderer, BoundToolbar]
|
|
});
|
|
}
|
|
(function(_CopilotChatUserMessage) {
|
|
_CopilotChatUserMessage.Container = ({ children, className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
className: (0, tailwind_merge.twMerge)("cpk:flex cpk:flex-col cpk:items-end cpk:group", className),
|
|
...props,
|
|
children
|
|
});
|
|
_CopilotChatUserMessage.MessageRenderer = ({ content, className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
className: (0, tailwind_merge.twMerge)("cpk:prose cpk:dark:prose-invert cpk:bg-muted cpk:relative cpk:max-w-[80%] cpk:rounded-[18px] cpk:px-4 cpk:py-1.5 cpk:data-[multiline]:py-3 cpk:inline-block cpk:whitespace-pre-wrap", className),
|
|
children: content
|
|
});
|
|
_CopilotChatUserMessage.Toolbar = ({ className, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
"data-testid": "copilot-user-toolbar",
|
|
className: (0, tailwind_merge.twMerge)("cpk:w-full cpk:bg-transparent cpk:flex cpk:items-center cpk:justify-end cpk:-mr-[5px] cpk:mt-[4px] cpk:invisible cpk:group-hover:visible", className),
|
|
...props
|
|
});
|
|
const ToolbarButton = _CopilotChatUserMessage.ToolbarButton = ({ title, children, className, ...props }) => {
|
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_tooltip.Tooltip, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.TooltipTrigger, {
|
|
asChild: true,
|
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
|
|
type: "button",
|
|
variant: "assistantMessageToolbarButton",
|
|
"aria-label": title,
|
|
className: (0, tailwind_merge.twMerge)(className),
|
|
...props,
|
|
children
|
|
})
|
|
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_tooltip.TooltipContent, {
|
|
side: "bottom",
|
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: title })
|
|
})] });
|
|
};
|
|
_CopilotChatUserMessage.CopyButton = ({ className, title, onClick, ...props }) => {
|
|
const labels = require_CopilotChatConfigurationProvider.useCopilotChatConfiguration()?.labels ?? require_CopilotChatConfigurationProvider.CopilotChatDefaultLabels;
|
|
const [copied, setCopied] = (0, react.useState)(false);
|
|
const handleClick = (event) => {
|
|
setCopied(true);
|
|
setTimeout(() => setCopied(false), 2e3);
|
|
if (onClick) onClick(event);
|
|
};
|
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolbarButton, {
|
|
"data-testid": "copilot-user-copy-button",
|
|
title: title || labels.userMessageToolbarCopyMessageLabel,
|
|
onClick: handleClick,
|
|
className,
|
|
...props,
|
|
children: copied ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Check, { className: "cpk:size-[18px]" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Copy, { className: "cpk:size-[18px]" })
|
|
});
|
|
};
|
|
_CopilotChatUserMessage.EditButton = ({ className, title, ...props }) => {
|
|
const labels = require_CopilotChatConfigurationProvider.useCopilotChatConfiguration()?.labels ?? require_CopilotChatConfigurationProvider.CopilotChatDefaultLabels;
|
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolbarButton, {
|
|
"data-testid": "copilot-edit-button",
|
|
title: title || labels.userMessageToolbarEditMessageLabel,
|
|
className,
|
|
...props,
|
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Edit, { className: "cpk:size-[18px]" })
|
|
});
|
|
};
|
|
_CopilotChatUserMessage.BranchNavigation = ({ className, currentBranch = 0, numberOfBranches = 1, onSwitchToBranch, message, ...props }) => {
|
|
if (!numberOfBranches || numberOfBranches <= 1 || !onSwitchToBranch) return null;
|
|
const canGoPrev = currentBranch > 0;
|
|
const canGoNext = currentBranch < numberOfBranches - 1;
|
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
"data-testid": "copilot-branch-navigation",
|
|
className: (0, tailwind_merge.twMerge)("cpk:flex cpk:items-center cpk:gap-1", className),
|
|
...props,
|
|
children: [
|
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
|
|
type: "button",
|
|
variant: "assistantMessageToolbarButton",
|
|
onClick: () => onSwitchToBranch?.({
|
|
branchIndex: currentBranch - 1,
|
|
numberOfBranches,
|
|
message
|
|
}),
|
|
disabled: !canGoPrev,
|
|
className: "cpk:h-6 cpk:w-6 cpk:p-0",
|
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronLeft, { className: "cpk:size-[20px]" })
|
|
}),
|
|
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
|
|
className: "cpk:text-sm cpk:text-muted-foreground cpk:px-0 cpk:font-medium",
|
|
children: [
|
|
currentBranch + 1,
|
|
"/",
|
|
numberOfBranches
|
|
]
|
|
}),
|
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
|
|
type: "button",
|
|
variant: "assistantMessageToolbarButton",
|
|
onClick: () => onSwitchToBranch?.({
|
|
branchIndex: currentBranch + 1,
|
|
numberOfBranches,
|
|
message
|
|
}),
|
|
disabled: !canGoNext,
|
|
className: "cpk:h-6 cpk:w-6 cpk:p-0",
|
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRight, { className: "cpk:size-[20px]" })
|
|
})
|
|
]
|
|
});
|
|
};
|
|
})(CopilotChatUserMessage || (CopilotChatUserMessage = {}));
|
|
CopilotChatUserMessage.Container.displayName = "CopilotChatUserMessage.Container";
|
|
CopilotChatUserMessage.MessageRenderer.displayName = "CopilotChatUserMessage.MessageRenderer";
|
|
CopilotChatUserMessage.Toolbar.displayName = "CopilotChatUserMessage.Toolbar";
|
|
CopilotChatUserMessage.ToolbarButton.displayName = "CopilotChatUserMessage.ToolbarButton";
|
|
CopilotChatUserMessage.CopyButton.displayName = "CopilotChatUserMessage.CopyButton";
|
|
CopilotChatUserMessage.EditButton.displayName = "CopilotChatUserMessage.EditButton";
|
|
CopilotChatUserMessage.BranchNavigation.displayName = "CopilotChatUserMessage.BranchNavigation";
|
|
var CopilotChatUserMessage_default = CopilotChatUserMessage;
|
|
|
|
//#endregion
|
|
exports.default = CopilotChatUserMessage_default;
|
|
//# sourceMappingURL=CopilotChatUserMessage.cjs.map
|