@uipath/apollo-wind 2.66.1 → 2.67.0

package/dist/components/ui/attachment.cjs

@@ -0,0 +1,174 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    AttachmentActions: ()=>AttachmentActions,
+    AttachmentAction: ()=>AttachmentAction,
+    AttachmentGroup: ()=>AttachmentGroup,
+    AttachmentMedia: ()=>AttachmentMedia,
+    AttachmentContent: ()=>AttachmentContent,
+    AttachmentTrigger: ()=>AttachmentTrigger,
+    AttachmentDescription: ()=>AttachmentDescription,
+    AttachmentTitle: ()=>AttachmentTitle,
+    Attachment: ()=>Attachment,
+    attachmentVariants: ()=>attachmentVariants
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_slot_namespaceObject = require("@radix-ui/react-slot");
+const external_class_variance_authority_namespaceObject = require("class-variance-authority");
+const external_react_namespaceObject = require("react");
+const external_button_cjs_namespaceObject = require("./button.cjs");
+const index_cjs_namespaceObject = require("../../lib/index.cjs");
+const attachmentVariants = (0, external_class_variance_authority_namespaceObject.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'
+        }
+    },
+    defaultVariants: {
+        size: 'default',
+        orientation: 'horizontal'
+    }
+});
+const Attachment = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, state = 'done', size = 'default', orientation = 'horizontal', ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: ref,
+        "data-slot": "attachment",
+        "data-state": state,
+        "data-size": size,
+        "data-orientation": orientation,
+        className: (0, index_cjs_namespaceObject.cn)(attachmentVariants({
+            size,
+            orientation
+        }), className),
+        ...props
+    }));
+Attachment.displayName = 'Attachment';
+const attachmentMediaVariants = (0, external_class_variance_authority_namespaceObject.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 [&_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'
+    }
+});
+const AttachmentMedia = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, variant = 'icon', ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: ref,
+        "data-slot": "attachment-media",
+        "data-variant": variant,
+        className: (0, index_cjs_namespaceObject.cn)(attachmentMediaVariants({
+            variant
+        }), className),
+        ...props
+    }));
+AttachmentMedia.displayName = 'AttachmentMedia';
+const AttachmentContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: ref,
+        "data-slot": "attachment-content",
+        className: (0, index_cjs_namespaceObject.cn)('max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1', className),
+        ...props
+    }));
+AttachmentContent.displayName = 'AttachmentContent';
+const AttachmentTitle = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+        ref: ref,
+        "data-slot": "attachment-title",
+        className: (0, index_cjs_namespaceObject.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
+    }));
+AttachmentTitle.displayName = 'AttachmentTitle';
+const AttachmentDescription = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+        ref: ref,
+        "data-slot": "attachment-description",
+        className: (0, index_cjs_namespaceObject.cn)('mt-0.5 block max-w-full min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive/80', className),
+        ...props
+    }));
+AttachmentDescription.displayName = "AttachmentDescription";
+const AttachmentActions = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: ref,
+        "data-slot": "attachment-actions",
+        className: (0, index_cjs_namespaceObject.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
+    }));
+AttachmentActions.displayName = 'AttachmentActions';
+const AttachmentAction = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ variant = 'ghost', size = '3xs', icon = true, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+        ref: ref,
+        "data-slot": "attachment-action",
+        variant: variant,
+        size: size,
+        icon: icon,
+        ...props
+    }));
+AttachmentAction.displayName = 'AttachmentAction';
+const AttachmentTrigger = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, asChild = false, type, ...props }, ref)=>{
+    const Comp = asChild ? react_slot_namespaceObject.Slot : 'button';
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Comp, {
+        ref: ref,
+        "data-slot": "attachment-trigger",
+        type: asChild ? void 0 : type ?? 'button',
+        className: (0, index_cjs_namespaceObject.cn)('absolute inset-0 z-10 outline-none', className),
+        ...props
+    });
+});
+AttachmentTrigger.displayName = 'AttachmentTrigger';
+const AttachmentGroup = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: ref,
+        "data-slot": "attachment-group",
+        className: (0, index_cjs_namespaceObject.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
+    }));
+AttachmentGroup.displayName = 'AttachmentGroup';
+exports.Attachment = __webpack_exports__.Attachment;
+exports.AttachmentAction = __webpack_exports__.AttachmentAction;
+exports.AttachmentActions = __webpack_exports__.AttachmentActions;
+exports.AttachmentContent = __webpack_exports__.AttachmentContent;
+exports.AttachmentDescription = __webpack_exports__.AttachmentDescription;
+exports.AttachmentGroup = __webpack_exports__.AttachmentGroup;
+exports.AttachmentMedia = __webpack_exports__.AttachmentMedia;
+exports.AttachmentTitle = __webpack_exports__.AttachmentTitle;
+exports.AttachmentTrigger = __webpack_exports__.AttachmentTrigger;
+exports.attachmentVariants = __webpack_exports__.attachmentVariants;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "Attachment",
+    "AttachmentAction",
+    "AttachmentActions",
+    "AttachmentContent",
+    "AttachmentDescription",
+    "AttachmentGroup",
+    "AttachmentMedia",
+    "AttachmentTitle",
+    "AttachmentTrigger",
+    "attachmentVariants"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/attachment.d.ts

@@ -0,0 +1,39 @@
+import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import { type ButtonProps } from './button';
+/**
+ * A file or image card for a chat composer or a sent message, ported from shadcn/ui's chat
+ * components. `state` drives the chrome: `idle` is a dashed placeholder, `uploading` and
+ * `processing` shimmer the title, `error` tints it. `AttachmentGroup` scrolls a row of them with
+ * faded edges.
+ */
+declare const attachmentVariants: (props?: ({
+    size?: "default" | "sm" | "xs" | null | undefined;
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type AttachmentState = 'idle' | 'uploading' | 'processing' | 'error' | 'done';
+export interface AttachmentProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof attachmentVariants> {
+    state?: AttachmentState;
+}
+declare const Attachment: React.ForwardRefExoticComponent<AttachmentProps & React.RefAttributes<HTMLDivElement>>;
+declare const attachmentMediaVariants: (props?: ({
+    variant?: "icon" | "image" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface AttachmentMediaProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof attachmentMediaVariants> {
+}
+declare const AttachmentMedia: React.ForwardRefExoticComponent<AttachmentMediaProps & React.RefAttributes<HTMLDivElement>>;
+declare const AttachmentContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const AttachmentTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
+declare const AttachmentDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
+declare const AttachmentActions: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export interface AttachmentActionProps extends ButtonProps {
+}
+/** A `Button` sized for the card: ghost, icon-only and `3xs` unless told otherwise. */
+declare const AttachmentAction: React.ForwardRefExoticComponent<AttachmentActionProps & React.RefAttributes<HTMLButtonElement>>;
+export interface AttachmentTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    asChild?: boolean;
+}
+/** An invisible full-card hit target, so the whole attachment opens or previews on click. */
+declare const AttachmentTrigger: React.ForwardRefExoticComponent<AttachmentTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const AttachmentGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { Attachment, AttachmentGroup, AttachmentMedia, AttachmentContent, AttachmentTitle, AttachmentDescription, AttachmentActions, AttachmentAction, AttachmentTrigger, attachmentVariants, };

package/dist/components/ui/attachment.js

@@ -0,0 +1,113 @@
+import { jsx } from "react/jsx-runtime";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { forwardRef } from "react";
+import { Button } from "./button.js";
+import { cn } from "../../lib/index.js";
+const 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'
+        }
+    },
+    defaultVariants: {
+        size: 'default',
+        orientation: 'horizontal'
+    }
+});
+const Attachment = /*#__PURE__*/ forwardRef(({ className, state = 'done', size = 'default', orientation = 'horizontal', ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "data-slot": "attachment",
+        "data-state": state,
+        "data-size": size,
+        "data-orientation": orientation,
+        className: cn(attachmentVariants({
+            size,
+            orientation
+        }), className),
+        ...props
+    }));
+Attachment.displayName = 'Attachment';
+const 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 [&_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'
+    }
+});
+const AttachmentMedia = /*#__PURE__*/ forwardRef(({ className, variant = 'icon', ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "data-slot": "attachment-media",
+        "data-variant": variant,
+        className: cn(attachmentMediaVariants({
+            variant
+        }), className),
+        ...props
+    }));
+AttachmentMedia.displayName = 'AttachmentMedia';
+const AttachmentContent = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "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
+    }));
+AttachmentContent.displayName = 'AttachmentContent';
+const AttachmentTitle = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("span", {
+        ref: ref,
+        "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
+    }));
+AttachmentTitle.displayName = 'AttachmentTitle';
+const AttachmentDescription = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("span", {
+        ref: ref,
+        "data-slot": "attachment-description",
+        className: cn('mt-0.5 block max-w-full min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive/80', className),
+        ...props
+    }));
+AttachmentDescription.displayName = "AttachmentDescription";
+const AttachmentActions = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "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
+    }));
+AttachmentActions.displayName = 'AttachmentActions';
+const AttachmentAction = /*#__PURE__*/ forwardRef(({ variant = 'ghost', size = '3xs', icon = true, ...props }, ref)=>/*#__PURE__*/ jsx(Button, {
+        ref: ref,
+        "data-slot": "attachment-action",
+        variant: variant,
+        size: size,
+        icon: icon,
+        ...props
+    }));
+AttachmentAction.displayName = 'AttachmentAction';
+const AttachmentTrigger = /*#__PURE__*/ forwardRef(({ className, asChild = false, type, ...props }, ref)=>{
+    const Comp = asChild ? Slot : 'button';
+    return /*#__PURE__*/ jsx(Comp, {
+        ref: ref,
+        "data-slot": "attachment-trigger",
+        type: asChild ? void 0 : type ?? 'button',
+        className: cn('absolute inset-0 z-10 outline-none', className),
+        ...props
+    });
+});
+AttachmentTrigger.displayName = 'AttachmentTrigger';
+const AttachmentGroup = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "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
+    }));
+AttachmentGroup.displayName = 'AttachmentGroup';
+export { Attachment, AttachmentAction, AttachmentActions, AttachmentContent, AttachmentDescription, AttachmentGroup, AttachmentMedia, AttachmentTitle, AttachmentTrigger, attachmentVariants };

package/dist/components/ui/bubble.cjs

@@ -0,0 +1,123 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    Bubble: ()=>Bubble,
+    BubbleContent: ()=>BubbleContent,
+    bubbleVariants: ()=>bubbleVariants,
+    BubbleGroup: ()=>BubbleGroup,
+    BubbleReactions: ()=>BubbleReactions
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_slot_namespaceObject = require("@radix-ui/react-slot");
+const external_class_variance_authority_namespaceObject = require("class-variance-authority");
+const external_react_namespaceObject = require("react");
+const index_cjs_namespaceObject = require("../../lib/index.cjs");
+const BubbleGroup = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: ref,
+        "data-slot": "bubble-group",
+        className: (0, index_cjs_namespaceObject.cn)('flex min-w-0 flex-col gap-2', className),
+        ...props
+    }));
+BubbleGroup.displayName = 'BubbleGroup';
+const bubbleVariants = (0, external_class_variance_authority_namespaceObject.cva)('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', {
+    variants: {
+        variant: {
+            default: '[&>[data-slot=bubble-content]]:bg-primary [&>[data-slot=bubble-content]]:text-primary-foreground',
+            secondary: '[&>[data-slot=bubble-content]]:bg-secondary [&>[data-slot=bubble-content]]:text-secondary-foreground',
+            muted: '[&>[data-slot=bubble-content]]:bg-surface-overlay',
+            outline: '[&>[data-slot=bubble-content]]:border-border [&>[data-slot=bubble-content]]:bg-background',
+            ghost: '[&>[data-slot=bubble-content]]:rounded-none [&>[data-slot=bubble-content]]:border-0 [&>[data-slot=bubble-content]]:bg-transparent [&>[data-slot=bubble-content]]:p-0',
+            destructive: '[&>[data-slot=bubble-content]]:bg-destructive/10 [&>[data-slot=bubble-content]]:text-destructive'
+        }
+    },
+    defaultVariants: {
+        variant: 'default'
+    }
+});
+const Bubble = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ variant = 'default', align = 'start', className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: ref,
+        "data-slot": "bubble",
+        "data-variant": variant,
+        "data-align": align,
+        className: (0, index_cjs_namespaceObject.cn)(bubbleVariants({
+            variant
+        }), className),
+        ...props
+    }));
+Bubble.displayName = 'Bubble';
+const BubbleContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ asChild = false, className, ...props }, ref)=>{
+    const Comp = asChild ? react_slot_namespaceObject.Slot : 'div';
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Comp, {
+        ref: ref,
+        "data-slot": "bubble-content",
+        className: (0, index_cjs_namespaceObject.cn)('w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed break-words group-data-[align=end]/bubble:self-end', className),
+        ...props
+    });
+});
+BubbleContent.displayName = 'BubbleContent';
+const bubbleReactionsVariants = (0, external_class_variance_authority_namespaceObject.cva)('absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-full bg-surface-overlay px-1.5 py-0.5 text-sm ring-2 ring-card', {
+    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'
+    }
+});
+const BubbleReactions = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ side = 'bottom', align = 'end', className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        ref: ref,
+        "data-slot": "bubble-reactions",
+        "data-align": align,
+        "data-side": side,
+        className: (0, index_cjs_namespaceObject.cn)(bubbleReactionsVariants({
+            side,
+            align
+        }), className),
+        ...props
+    }));
+BubbleReactions.displayName = 'BubbleReactions';
+exports.Bubble = __webpack_exports__.Bubble;
+exports.BubbleContent = __webpack_exports__.BubbleContent;
+exports.BubbleGroup = __webpack_exports__.BubbleGroup;
+exports.BubbleReactions = __webpack_exports__.BubbleReactions;
+exports.bubbleVariants = __webpack_exports__.bubbleVariants;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "Bubble",
+    "BubbleContent",
+    "BubbleGroup",
+    "BubbleReactions",
+    "bubbleVariants"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/bubble.d.ts

@@ -0,0 +1,28 @@
+import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+/**
+ * The surface of a chat message, ported from shadcn/ui's chat components. `Bubble` positions and
+ * colours; `BubbleContent` is the padded box the text lives in, so a bubble can also carry
+ * reactions or actions outside that box. Use inside `MessageContent`, or standalone with `align`.
+ */
+declare const BubbleGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const bubbleVariants: (props?: ({
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "muted" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface BubbleProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof bubbleVariants> {
+    /** `end` pins the bubble to the trailing edge when it is not inside an `end`-aligned `Message`. */
+    align?: 'start' | 'end';
+}
+declare const Bubble: React.ForwardRefExoticComponent<BubbleProps & React.RefAttributes<HTMLDivElement>>;
+export interface BubbleContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    asChild?: boolean;
+}
+declare const BubbleContent: React.ForwardRefExoticComponent<BubbleContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const bubbleReactionsVariants: (props?: ({
+    side?: "top" | "bottom" | null | undefined;
+    align?: "end" | "start" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface BubbleReactionsProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof bubbleReactionsVariants> {
+}
+declare const BubbleReactions: React.ForwardRefExoticComponent<BubbleReactionsProps & React.RefAttributes<HTMLDivElement>>;
+export { BubbleGroup, Bubble, BubbleContent, BubbleReactions, bubbleVariants };

package/dist/components/ui/bubble.js

@@ -0,0 +1,77 @@
+import { jsx } from "react/jsx-runtime";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { forwardRef } from "react";
+import { cn } from "../../lib/index.js";
+const BubbleGroup = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "data-slot": "bubble-group",
+        className: cn('flex min-w-0 flex-col gap-2', className),
+        ...props
+    }));
+BubbleGroup.displayName = 'BubbleGroup';
+const bubbleVariants = cva('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', {
+    variants: {
+        variant: {
+            default: '[&>[data-slot=bubble-content]]:bg-primary [&>[data-slot=bubble-content]]:text-primary-foreground',
+            secondary: '[&>[data-slot=bubble-content]]:bg-secondary [&>[data-slot=bubble-content]]:text-secondary-foreground',
+            muted: '[&>[data-slot=bubble-content]]:bg-surface-overlay',
+            outline: '[&>[data-slot=bubble-content]]:border-border [&>[data-slot=bubble-content]]:bg-background',
+            ghost: '[&>[data-slot=bubble-content]]:rounded-none [&>[data-slot=bubble-content]]:border-0 [&>[data-slot=bubble-content]]:bg-transparent [&>[data-slot=bubble-content]]:p-0',
+            destructive: '[&>[data-slot=bubble-content]]:bg-destructive/10 [&>[data-slot=bubble-content]]:text-destructive'
+        }
+    },
+    defaultVariants: {
+        variant: 'default'
+    }
+});
+const Bubble = /*#__PURE__*/ forwardRef(({ variant = 'default', align = 'start', className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "data-slot": "bubble",
+        "data-variant": variant,
+        "data-align": align,
+        className: cn(bubbleVariants({
+            variant
+        }), className),
+        ...props
+    }));
+Bubble.displayName = 'Bubble';
+const BubbleContent = /*#__PURE__*/ forwardRef(({ asChild = false, className, ...props }, ref)=>{
+    const Comp = asChild ? Slot : 'div';
+    return /*#__PURE__*/ jsx(Comp, {
+        ref: ref,
+        "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 break-words group-data-[align=end]/bubble:self-end', className),
+        ...props
+    });
+});
+BubbleContent.displayName = 'BubbleContent';
+const bubbleReactionsVariants = cva('absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-full bg-surface-overlay px-1.5 py-0.5 text-sm ring-2 ring-card', {
+    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'
+    }
+});
+const BubbleReactions = /*#__PURE__*/ forwardRef(({ side = 'bottom', align = 'end', className, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "data-slot": "bubble-reactions",
+        "data-align": align,
+        "data-side": side,
+        className: cn(bubbleReactionsVariants({
+            side,
+            align
+        }), className),
+        ...props
+    }));
+BubbleReactions.displayName = 'BubbleReactions';
+export { Bubble, BubbleContent, BubbleGroup, BubbleReactions, bubbleVariants };