42 lines
899 B
TypeScript
42 lines
899 B
TypeScript
import type { MessageBlockProps } from "$/types/MessageTypes";
|
|
import clsx from "clsx";
|
|
import { forwardRef } from "react";
|
|
|
|
|
|
const MessageBlock = forwardRef<HTMLDivElement, MessageBlockProps>(({
|
|
className,
|
|
outline = "sm",
|
|
rounded = "lg",
|
|
...messageProps
|
|
}, ref ) => {
|
|
return (
|
|
<div
|
|
data-testid="mattrixwv-message-block"
|
|
className={clsx(
|
|
className,
|
|
"px-4 py-2",
|
|
{
|
|
"border-0": outline === "none",
|
|
"border": outline === "sm",
|
|
"border-2": outline === "md",
|
|
"border-3": outline === "lg"
|
|
},
|
|
{
|
|
"rounded-none": rounded === "none",
|
|
"rounded-xs": rounded === "xs",
|
|
"rounded-sm": rounded === "sm",
|
|
"rounded-md": rounded === "md",
|
|
"rounded-lg": rounded === "lg",
|
|
"rounded-xl": rounded === "xl"
|
|
}
|
|
)}
|
|
ref={ref}
|
|
{...messageProps}
|
|
/>
|
|
);
|
|
});
|
|
|
|
MessageBlock.displayName = "MessageBlock";
|
|
|
|
export default MessageBlock;
|