//
A robust message thread and bubble presentation system with avatar placement, alignment configurations, and reaction widgets.
bun add xiod-ui1import {2 MessageGroup,3 Message,4 MessageAvatar,5 MessageContent,6 MessageHeader,7 MessageFooter,8 Bubble,9 BubbleContent,10 BubbleReactions11} from "xiod-ui/message";1<Message>2 <MessageContent>3 <MessageHeader>4 </MessageHeader>5 <MessageGroup>6 </MessageGroup>7 <MessageAvatar />8 <Bubble />9 <BubbleContent />10 <BubbleReactions />11 <MessageFooter>12 </MessageFooter>13 </MessageContent>14</Message>| Prop | Type | Default | Description |
|---|---|---|---|
align | "start"| "end"| undefined | start |
| Prop | Type | Default | Description |
|---|---|---|---|
align | "start"| "end"| undefined | start | |
variant | "default"| "secondary"| "destructive"| "ghost"| "outline"| "muted"| "tinted"| null| undefined | default |
| Prop | Type | Default | Description |
|---|---|---|---|
render | ReactElement<unknown, string| JSXElementConstructor<any>>| ComponentRenderFn<HTMLProps, {}>| undefined | - | Allows you to replace the component's HTML element with a different tag, or compose it with another component. Accepts a `ReactElement` or a function that returns the element to render. |
| Prop | Type | Default | Description |
|---|---|---|---|
align | "start"| "end"| null| undefined | end | |
side | "top"| "bottom"| null| undefined | bottom |