@agents24/chat-react 0.1.7 → 0.1.9

package/dist/ui/index.js

@@ -0,0 +1,734 @@
+import {
+  useStreamingText
+} from "../chunk-EWZO4QJI.js";
+import {
+  cn
+} from "../chunk-UU7OXHL3.js";
+
+// src/ui/adapters.ts
+import * as React from "react";
+
+// src/ui/attachment.tsx
+import { cva } from "class-variance-authority";
+import { Slot } from "@radix-ui/react-slot";
+import { jsx } from "react/jsx-runtime";
+var attachmentVariants = cva(
+  "group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-xl border bg-card text-card-foreground transition-colors focus-within:ring-1 focus-within:ring-ring/50 has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive/30 data-[state=idle]:border-dashed",
+  {
+    variants: {
+      size: {
+        default: "gap-2 text-sm has-data-[slot=attachment-content]:px-2.5 has-data-[slot=attachment-content]:py-2 has-data-[slot=attachment-media]:p-2",
+        sm: "gap-2.5 text-xs has-data-[slot=attachment-content]:px-2 has-data-[slot=attachment-content]:py-1.5 has-data-[slot=attachment-media]:p-1.5",
+        xs: "gap-1.5 rounded-lg text-xs has-data-[slot=attachment-content]:px-1.5 has-data-[slot=attachment-content]:py-1 has-data-[slot=attachment-media]:p-1"
+      },
+      orientation: {
+        horizontal: "min-w-40 items-center",
+        vertical: "w-24 flex-col has-data-[slot=attachment-content]:w-30"
+      }
+    }
+  }
+);
+function Attachment({
+  className,
+  state = "done",
+  size = "default",
+  orientation = "horizontal",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "attachment",
+      "data-state": state,
+      "data-size": size,
+      "data-orientation": orientation,
+      className: cn(attachmentVariants({ size, orientation }), className),
+      ...props
+    }
+  );
+}
+var attachmentMediaVariants = cva(
+  "relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-lg bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[size=sm]/attachment:w-8 group-data-[size=xs]/attachment:w-7 group-data-[size=xs]/attachment:rounded-md group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5",
+  {
+    variants: {
+      variant: {
+        icon: "",
+        image: "opacity-60 group-data-[state=done]/attachment:opacity-100 group-data-[state=idle]/attachment:opacity-100 *:[img]:aspect-square *:[img]:w-full *:[img]:object-cover"
+      }
+    },
+    defaultVariants: {
+      variant: "icon"
+    }
+  }
+);
+function AttachmentMedia({
+  className,
+  variant = "icon",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "attachment-media",
+      "data-variant": variant,
+      className: cn(attachmentMediaVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+function AttachmentContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "attachment-content",
+      className: cn(
+        "max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AttachmentTitle({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "data-slot": "attachment-title",
+      className: cn(
+        "block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AttachmentDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "data-slot": "attachment-description",
+      className: cn(
+        "mt-0.5 block min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive/80",
+        "max-w-full",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AttachmentActions({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "attachment-actions",
+      className: cn(
+        "relative z-20 flex shrink-0 items-center group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:right-3 group-data-[orientation=vertical]/attachment:gap-1",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AttachmentAction({
+  className,
+  type = "button",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      "data-slot": "attachment-action",
+      type,
+      className: cn(
+        "inline-flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AttachmentTrigger({
+  className,
+  asChild = false,
+  type,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "attachment-trigger",
+      type: asChild ? void 0 : type ?? "button",
+      className: cn("absolute inset-0 z-10 outline-none", className),
+      ...props
+    }
+  );
+}
+function AttachmentGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "attachment-group",
+      className: cn(
+        "flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 scrollbar-none gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/ui/bubble.tsx
+import { cva as cva2 } from "class-variance-authority";
+import { Slot as Slot2 } from "@radix-ui/react-slot";
+import { jsx as jsx2 } from "react/jsx-runtime";
+function BubbleGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx2(
+    "div",
+    {
+      "data-slot": "bubble-group",
+      className: cn("flex min-w-0 flex-col gap-2", className),
+      ...props
+    }
+  );
+}
+var bubbleVariants = cva2(
+  "group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full",
+  {
+    variants: {
+      variant: {
+        default: "*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80",
+        secondary: "*:data-[slot=bubble-content]:bg-secondary *:data-[slot=bubble-content]:text-secondary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)]",
+        muted: "*:data-[slot=bubble-content]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]",
+        tinted: "*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.93_calc(c*0.4)_h)] *:data-[slot=bubble-content]:text-foreground dark:*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.3_calc(c*0.4)_h)] [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.88_calc(c*0.5)_h)] dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.35_calc(c*0.5)_h)]",
+        outline: "*:data-[slot=bubble-content]:border-border *:data-[slot=bubble-content]:bg-background [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-input/30",
+        ghost: "border-none *:data-[slot=bubble-content]:rounded-none *:data-[slot=bubble-content]:bg-transparent *:data-[slot=bubble-content]:p-0 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted/50",
+        destructive: "*:data-[slot=bubble-content]:bg-destructive/10 *:data-[slot=bubble-content]:text-destructive dark:*:data-[slot=bubble-content]:bg-destructive/20 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/20 dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/30"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Bubble({
+  variant = "default",
+  align = "start",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    "div",
+    {
+      "data-slot": "bubble",
+      "data-variant": variant,
+      "data-align": align,
+      className: cn(bubbleVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+function BubbleContent({
+  asChild = false,
+  className,
+  ...props
+}) {
+  const Comp = asChild ? Slot2 : "div";
+  return /* @__PURE__ */ jsx2(
+    Comp,
+    {
+      "data-slot": "bubble-content",
+      className: cn(
+        "w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var bubbleReactionsVariants = cva2(
+  "absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-full bg-muted px-1.5 py-0.5 text-sm ring-3 ring-card has-[button]:p-0",
+  {
+    variants: {
+      side: {
+        top: "top-0 -translate-y-3/4",
+        bottom: "bottom-0 translate-y-3/4"
+      },
+      align: {
+        start: "left-3",
+        end: "right-3"
+      }
+    },
+    defaultVariants: {
+      side: "bottom",
+      align: "end"
+    }
+  }
+);
+function BubbleReactions({
+  side = "bottom",
+  align = "end",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    "div",
+    {
+      "data-slot": "bubble-reactions",
+      "data-align": align,
+      "data-side": side,
+      className: cn(bubbleReactionsVariants({ side, align }), className),
+      ...props
+    }
+  );
+}
+
+// src/ui/message.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function MessageGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      "data-slot": "message-group",
+      className: cn("flex min-w-0 flex-col gap-2", className),
+      ...props
+    }
+  );
+}
+function Message({
+  className,
+  align = "start",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      "data-slot": "message",
+      "data-align": align,
+      className: cn(
+        "group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function MessageAvatar({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      "data-slot": "message-avatar",
+      className: cn(
+        "flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-muted group-has-data-[slot=message-footer]/message:-translate-y-8",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function MessageContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      "data-slot": "message-content",
+      className: cn(
+        "flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function MessageHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      "data-slot": "message-header",
+      className: cn(
+        "flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function MessageFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      "data-slot": "message-footer",
+      className: cn(
+        "flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/ui/adapters.ts
+function ChatMessage(input) {
+  const { className, from, align, ...props } = input;
+  const isUser = from === "user";
+  const isRtl = props.dir === "rtl";
+  const resolvedAlign = align || "start";
+  const messageProps = Object.assign({}, props);
+  messageProps.align = resolvedAlign;
+  messageProps.className = cn(
+    "group flex w-full flex-col gap-2 overflow-visible",
+    isUser ? cn("is-user max-w-[80%] justify-end", isRtl ? "mr-auto" : "ml-auto") : "is-assistant max-w-full",
+    className
+  );
+  return React.createElement(Message, messageProps);
+}
+function ChatMessageContent({
+  className,
+  ...props
+}) {
+  return React.createElement(BubbleContent, {
+    className: cn(
+      "flex w-full max-w-full min-w-0 flex-col gap-2 text-sm",
+      "group-[.is-user]:w-fit group-[.is-user]:overflow-visible group-[.is-user]:rounded-lg group-[.is-user]:bg-secondary group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-foreground",
+      "group-[.is-assistant]:w-full group-[.is-assistant]:max-w-full group-[.is-assistant]:overflow-hidden group-[.is-assistant]:text-foreground",
+      props.dir === "rtl" ? "group-[.is-assistant]:pr-0" : "group-[.is-assistant]:pl-0",
+      props.dir === "rtl" ? "group-[.is-user]:mr-auto" : "group-[.is-user]:ml-auto",
+      className
+    ),
+    ...props
+  });
+}
+function ChatMessageActions({
+  className,
+  ...props
+}) {
+  return React.createElement("div", {
+    className: cn("flex items-center gap-1", className),
+    "data-slot": "message-actions",
+    ...props
+  });
+}
+function ChatMessageAction({
+  children,
+  className,
+  label,
+  tooltip,
+  type = "button",
+  ...props
+}) {
+  const tooltipLabel = typeof tooltip === "string" ? tooltip : void 0;
+  return React.createElement(
+    "button",
+    {
+      "aria-label": label || tooltipLabel,
+      className: cn(
+        "inline-flex size-8 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+        className
+      ),
+      title: tooltipLabel,
+      type,
+      ...props
+    },
+    children,
+    React.createElement(
+      "span",
+      { className: "sr-only" },
+      label || tooltipLabel
+    )
+  );
+}
+function ChatAttachment({
+  data,
+  onRemove,
+  orientation,
+  ...props
+}) {
+  const mediaType = data.mediaType || data.contentType || String(data.type || "application/octet-stream");
+  const filename = data.filename || data.name || "Attachment";
+  const isImage = mediaType.startsWith("image/") && Boolean(data.url);
+  return React.createElement(
+    Attachment,
+    {
+      orientation: orientation || (isImage ? "vertical" : "horizontal"),
+      ...props
+    },
+    React.createElement(
+      AttachmentMedia,
+      { variant: isImage ? "image" : "icon" },
+      isImage ? React.createElement("img", {
+        alt: filename,
+        className: "size-full object-cover",
+        src: data.url
+      }) : React.createElement(
+        "span",
+        { "aria-hidden": "true", className: "text-sm" },
+        filename.slice(0, 1).toUpperCase()
+      )
+    ),
+    React.createElement(
+      AttachmentContent,
+      null,
+      React.createElement(AttachmentTitle, null, filename),
+      React.createElement(AttachmentDescription, null, mediaType)
+    ),
+    onRemove ? React.createElement(
+      "button",
+      {
+        "aria-label": "Remove attachment",
+        className: "relative z-20 mr-1 inline-flex size-6 shrink-0 items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground",
+        onClick: (event) => {
+          event.stopPropagation();
+          onRemove();
+        },
+        type: "button"
+      },
+      React.createElement("span", { "aria-hidden": "true" }, "x")
+    ) : null
+  );
+}
+function ChatAttachments({
+  children,
+  className,
+  ...props
+}) {
+  if (!children) return null;
+  return React.createElement(
+    AttachmentGroup,
+    {
+      className: cn(
+        props.dir === "rtl" ? "mr-auto" : "ml-auto",
+        "w-fit flex-wrap overflow-visible",
+        className
+      ),
+      ...props
+    },
+    children
+  );
+}
+
+// src/ui/marker.tsx
+import { cva as cva3 } from "class-variance-authority";
+import { Slot as Slot3 } from "@radix-ui/react-slot";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var markerVariants = cva3(
+  "group/marker relative flex min-h-4 w-full items-center gap-2 text-left text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground",
+  {
+    variants: {
+      variant: {
+        default: "",
+        separator: "before:mr-1 before:h-px before:min-w-0 before:flex-1 before:bg-border after:ml-1 after:h-px after:min-w-0 after:flex-1 after:bg-border",
+        border: "border-b border-border pb-2"
+      }
+    }
+  }
+);
+function Marker({
+  className,
+  variant = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot3 : "div";
+  return /* @__PURE__ */ jsx4(
+    Comp,
+    {
+      "data-slot": "marker",
+      "data-variant": variant,
+      className: cn(markerVariants({ variant, className })),
+      ...props
+    }
+  );
+}
+function MarkerIcon({ className, ...props }) {
+  return /* @__PURE__ */ jsx4(
+    "span",
+    {
+      "data-slot": "marker-icon",
+      "aria-hidden": "true",
+      className: cn(
+        "size-4 shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function MarkerContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx4(
+    "span",
+    {
+      "data-slot": "marker-content",
+      className: cn(
+        "min-w-0 wrap-break-word group-data-[variant=separator]/marker:flex-none group-data-[variant=separator]/marker:text-center *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/ui/message-response.tsx
+import * as React2 from "react";
+import { defaultRehypePlugins, Streamdown } from "streamdown";
+import { Fragment, jsx as jsx5 } from "react/jsx-runtime";
+var BLOCK_MARKDOWN_TAGS = /* @__PURE__ */ new Set([
+  "blockquote",
+  "div",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "hr",
+  "ol",
+  "pre",
+  "table",
+  "ul"
+]);
+function isMultilineCodeNode(node) {
+  return node?.tagName === "code" && node.position?.start?.line !== void 0 && node.position?.end?.line !== void 0 && node.position.start.line !== node.position.end.line;
+}
+function hasBlockMarkdownChild(child) {
+  if (!React2.isValidElement(child)) {
+    return false;
+  }
+  if (typeof child.type === "string" && BLOCK_MARKDOWN_TAGS.has(child.type)) {
+    return true;
+  }
+  const props = child.props;
+  if (BLOCK_MARKDOWN_TAGS.has(props.node?.tagName || "") || isMultilineCodeNode(props.node)) {
+    return true;
+  }
+  return React2.Children.toArray(props.children).some(hasBlockMarkdownChild);
+}
+function MessageMarkdownParagraph({
+  children,
+  ...props
+}) {
+  const domProps = { ...props };
+  delete domProps.node;
+  const childArray = React2.Children.toArray(children).filter(
+    (child) => child !== null && child !== ""
+  );
+  const isImageOnly = childArray.length === 1 && React2.isValidElement(childArray[0]) && childArray[0].props.node?.tagName === "img";
+  if (isImageOnly) {
+    return /* @__PURE__ */ jsx5(Fragment, { children });
+  }
+  if (childArray.some(hasBlockMarkdownChild)) {
+    return /* @__PURE__ */ jsx5("div", { ...domProps, children });
+  }
+  return /* @__PURE__ */ jsx5("p", { ...domProps, children });
+}
+var MESSAGE_RESPONSE_COMPONENTS = {
+  p: MessageMarkdownParagraph
+};
+var streamdownDefaultRehypePlugins = defaultRehypePlugins || {};
+var streamdownHardenPlugin = Array.isArray(
+  streamdownDefaultRehypePlugins.harden
+) ? streamdownDefaultRehypePlugins.harden[0] : streamdownDefaultRehypePlugins.harden;
+var MESSAGE_RESPONSE_REHYPE_PLUGINS = [
+  ...Object.entries(streamdownDefaultRehypePlugins).filter(([key]) => key !== "harden").map(([, plugin]) => plugin),
+  ...streamdownHardenPlugin ? [
+    [
+      streamdownHardenPlugin,
+      {
+        allowDataImages: true,
+        allowedImagePrefixes: ["*"],
+        allowedLinkPrefixes: ["*"],
+        allowedProtocols: ["*", "reshet:", "source:"],
+        defaultOrigin: void 0
+      }
+    ]
+  ] : []
+];
+var MessageResponse = React2.memo(
+  ({
+    children,
+    className,
+    components,
+    rehypePlugins,
+    streaming = false,
+    streamingId,
+    ...props
+  }) => {
+    const text = typeof children === "string" || typeof children === "number" ? String(children) : "";
+    const streamingText = useStreamingText({
+      charsPerSecond: 120,
+      id: streamingId || text,
+      isStreaming: streaming && text.length > 0,
+      maxCatchupChars: 32,
+      text
+    });
+    const streamdownComponents = React2.useMemo(
+      () => ({ ...MESSAGE_RESPONSE_COMPONENTS, ...components }),
+      [components]
+    );
+    return /* @__PURE__ */ jsx5(
+      Streamdown,
+      {
+        className: cn("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0", className),
+        components: streamdownComponents,
+        rehypePlugins: rehypePlugins || MESSAGE_RESPONSE_REHYPE_PLUGINS,
+        ...props,
+        children: text ? streamingText.displayedText : children
+      }
+    );
+  },
+  (prevProps, nextProps) => prevProps.children === nextProps.children && prevProps.className === nextProps.className && prevProps.streaming === nextProps.streaming && prevProps.streamingId === nextProps.streamingId && prevProps.components === nextProps.components
+);
+MessageResponse.displayName = "MessageResponse";
+export {
+  Attachment,
+  AttachmentAction,
+  AttachmentActions,
+  AttachmentContent,
+  AttachmentDescription,
+  AttachmentGroup,
+  AttachmentMedia,
+  AttachmentTitle,
+  AttachmentTrigger,
+  Bubble,
+  BubbleContent,
+  BubbleGroup,
+  BubbleReactions,
+  ChatAttachment,
+  ChatAttachments,
+  ChatMessage,
+  ChatMessageAction,
+  ChatMessageActions,
+  ChatMessageContent,
+  Marker,
+  MarkerContent,
+  MarkerIcon,
+  ChatMessage as Message,
+  ChatMessageAction as MessageAction,
+  ChatMessageActions as MessageActions,
+  ChatAttachment as MessageAttachment,
+  ChatAttachments as MessageAttachments,
+  MessageAvatar,
+  ChatMessageContent as MessageContent,
+  MessageFooter,
+  MessageGroup,
+  MessageHeader,
+  MessageResponse,
+  Message as ShadcnMessage,
+  MessageContent as ShadcnMessageContent,
+  attachmentMediaVariants,
+  attachmentVariants,
+  bubbleVariants,
+  cn,
+  markerVariants
+};
+//# sourceMappingURL=index.js.map