@droppii-org/chat-sdk 0.1.71 → 0.1.73

package/dist/src/components/message/item/index.js

@@ -0,0 +1,155 @@
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import dayjs from "dayjs";
+import clsx from "clsx";
+import { Dropdown, message as toastMessage } from "antd";
+import { MessageStatus, MessageType, } from "@openim/wasm-client-sdk";
+import MessageBubble from "./MessageBubble";
+import { renderBubbleContent } from "./renderMessageContent";
+import { getVisibleNeighbor, isMessageHiddenForViewer, } from "../../../hooks/message/useMessage";
+import { MSG_ITEM_CONTENT_PREFIX, MSG_ITEM_PREFIX } from "../../../constants";
+import { formatTimestamp } from "../../../utils/common";
+import useAuthStore from "../../../store/auth";
+import useConversationStore from "../../../store/conversation";
+import { useMemo, useRef } from "react";
+import { useLongPress } from "ahooks";
+import { Trans, useTranslation } from "react-i18next";
+import MessageStatusIndicator from "./MessageStatusIndicator";
+import { useSendMessage, isMediaResendable, } from "../../../hooks/message/useSendMessage";
+import { Icon } from "../../../components/icon";
+import SystemLogMessageItem from "./SystemLogMessage";
+import { isSystemLogMessageType } from "../../../utils/messageLog";
+import { buildMessageToolboxMenuItems, getCopyableMessageText, isCopyableMessageType, isPinnableMessageType, MessageToolboxActionKey, MESSAGE_TOOLBOX_OVERLAY_CLASSNAME, useMessageToolboxVisibility, } from "../../../components/message/toolbox";
+const MessageAvatar = ({ avatarUrl }) => avatarUrl ? (_jsx("img", { src: avatarUrl, alt: "", className: "h-6 w-6 shrink-0 self-end rounded-full object-cover" })) : (_jsx("div", { className: "flex h-6 w-6 shrink-0 items-center justify-center self-end rounded-full bg-chat-avatar", children: _jsx(Icon, { icon: "droppii-b", size: 14, className: "text-white" }) }));
+const MessageItem = ({ message, allMessages, isGroupChat = false, forceHideTip = false, contextMenuOpen, onContextMenuOpenChange, onRevokeMessage, onQuoteMessage, onPressQuoteMessage, onPinMessage, onUnpinMessage, enableLongPress = false, }) => {
+    var _a;
+    const { t } = useTranslation();
+    const { resendMessage } = useSendMessage();
+    const userID = useAuthStore((state) => state.userID);
+    const isCrm = useAuthStore((state) => state.isCrm);
+    const conversationData = useConversationStore((state) => state.conversationData);
+    const { isDeliveredForUi, isRevocable, isMine } = useMessageToolboxVisibility(message, userID);
+    const contextMenuItems = useMemo(() => {
+        if ((message === null || message === void 0 ? void 0 : message.contentType) === MessageType.RevokeMessage ||
+            isSystemLogMessageType(message === null || message === void 0 ? void 0 : message.contentType)) {
+            return [];
+        }
+        const closeToolbox = () => onContextMenuOpenChange === null || onContextMenuOpenChange === void 0 ? void 0 : onContextMenuOpenChange(false);
+        const actions = [];
+        if (isDeliveredForUi && onQuoteMessage) {
+            actions.push({
+                key: MessageToolboxActionKey.REPLY,
+                label: t("context_menu_reply"),
+                icon: "arrow-reply-o",
+                onClick: () => onQuoteMessage(message),
+            });
+        }
+        if (isDeliveredForUi &&
+            isPinnableMessageType(message === null || message === void 0 ? void 0 : message.contentType) &&
+            onPinMessage &&
+            onUnpinMessage) {
+            const isMessagePinned = Boolean(message === null || message === void 0 ? void 0 : message.isPinned);
+            actions.push({
+                key: isMessagePinned
+                    ? MessageToolboxActionKey.UNPIN
+                    : MessageToolboxActionKey.PIN,
+                label: isMessagePinned ? t("context_menu_unpin") : t("context_menu_pin"),
+                icon: isMessagePinned ? "thumbtack-off-o" : "thumbtack-o",
+                onClick: () => {
+                    if (isMessagePinned) {
+                        onUnpinMessage(message);
+                    }
+                    else {
+                        onPinMessage(message);
+                    }
+                    closeToolbox();
+                },
+            });
+        }
+        if (isDeliveredForUi && isCopyableMessageType(message === null || message === void 0 ? void 0 : message.contentType)) {
+            actions.push({
+                key: MessageToolboxActionKey.COPY_MESSAGE,
+                label: t("context_menu_copy_message"),
+                icon: "copy-o",
+                onClick: () => {
+                    navigator.clipboard.writeText(getCopyableMessageText(message));
+                    toastMessage.success(t("copy_message_success"));
+                    closeToolbox();
+                },
+            });
+        }
+        if (isRevocable && onRevokeMessage) {
+            actions.push({
+                key: MessageToolboxActionKey.REVOKE,
+                label: t("context_menu_revoke"),
+                icon: "trash-o",
+                danger: true,
+                onClick: () => onRevokeMessage((message === null || message === void 0 ? void 0 : message.clientMsgID) || ""),
+            });
+        }
+        return buildMessageToolboxMenuItems(actions);
+    }, [
+        isDeliveredForUi,
+        isRevocable,
+        t,
+        onRevokeMessage,
+        message,
+        onQuoteMessage,
+        onPinMessage,
+        onUnpinMessage,
+        onContextMenuOpenChange,
+    ]);
+    const bubbleWrapperRef = useRef(null);
+    useLongPress(() => onContextMenuOpenChange === null || onContextMenuOpenChange === void 0 ? void 0 : onContextMenuOpenChange(true), enableLongPress ? bubbleWrapperRef : undefined, { delay: 500 });
+    const showSenderInfo = useMemo(() => {
+        var _a, _b, _c;
+        try {
+            const isChatSupport = (_c = (_b = (_a = JSON.parse((conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex) || "{}")) === null || _a === void 0 ? void 0 : _a.sessionInfo) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.botId;
+            return Boolean(isChatSupport && isCrm && (message === null || message === void 0 ? void 0 : message.sendID) !== userID);
+        }
+        catch (_d) {
+            console.log("Failed to parse conversationData.ex");
+            return false;
+        }
+    }, [conversationData === null || conversationData === void 0 ? void 0 : conversationData.ex, isCrm, message === null || message === void 0 ? void 0 : message.sendID, userID]);
+    const isInternalMessage = Boolean(message === null || message === void 0 ? void 0 : message.isInternal);
+    const isSystemLogMessage = isSystemLogMessageType(message === null || message === void 0 ? void 0 : message.contentType);
+    const hasContextMenu = contextMenuItems.length > 0;
+    const isLatestMine = ((_a = allMessages.find((m) => m.sendID === userID)) === null || _a === void 0 ? void 0 : _a.clientMsgID) ===
+        message.clientMsgID;
+    const previousMessage = getVisibleNeighbor(allMessages, message, "prev");
+    const nextMessage = getVisibleNeighbor(allMessages, message, "next");
+    const prevSameUser = (previousMessage === null || previousMessage === void 0 ? void 0 : previousMessage.sendID) === (message === null || message === void 0 ? void 0 : message.sendID);
+    const nextSameUser = (nextMessage === null || nextMessage === void 0 ? void 0 : nextMessage.sendID) === (message === null || message === void 0 ? void 0 : message.sendID);
+    const showTimeBreak = !previousMessage ||
+        !dayjs(message.sendTime).isSame(previousMessage.sendTime, "days");
+    const showPeerInfo = isGroupChat || showSenderInfo;
+    const showAvatar = showPeerInfo && !isMine && !nextSameUser;
+    const showSenderName = showPeerInfo && !isMine && !prevSameUser;
+    const showTip = forceHideTip ? false : !nextSameUser;
+    if (isMessageHiddenForViewer(message, isCrm)) {
+        return null;
+    }
+    const messageContainerProps = {
+        className: "flex flex-col gap-2 py-1 px-3 sm:px-4 min-w-0",
+        id: `${MSG_ITEM_PREFIX}${message === null || message === void 0 ? void 0 : message.clientMsgID}`,
+    };
+    const timeBreakNode = showTimeBreak ? (_jsx("div", { className: "flex justify-center", children: _jsx("span", { className: "rounded-full bg-neutral-100 px-2 py-1 text-center text-xs text-gray-600", children: formatTimestamp(message.sendTime, { hasTime: true }) }) })) : null;
+    if (isSystemLogMessage) {
+        return (_createElement("div", Object.assign({}, messageContainerProps, { key: message === null || message === void 0 ? void 0 : message.clientMsgID }),
+            timeBreakNode,
+            _jsx(SystemLogMessageItem, { message: message })));
+    }
+    const bubbleNode = (_jsx(MessageBubble, { isMine: isMine, isInternal: isInternalMessage, senderName: message === null || message === void 0 ? void 0 : message.senderNickname, showSenderName: showSenderName, showTip: showTip, id: `${MSG_ITEM_CONTENT_PREFIX}${message === null || message === void 0 ? void 0 : message.clientMsgID}`, content: renderBubbleContent(message, onPressQuoteMessage) }));
+    const showPinnedBadge = Boolean(message === null || message === void 0 ? void 0 : message.isPinned) && Boolean(onPinMessage);
+    const pinnedBadgeNode = showPinnedBadge ? (_jsx("span", { "data-testid": "message-pinned-badge", className: clsx("absolute -top-2.5 z-[1] flex h-[22px] w-[26px] items-center justify-center rounded-full border border-white bg-gray-25", isMine ? "left-0" : "right-0"), children: _jsx(Icon, { icon: "thumbtack-b", size: 12, className: "text-primary-400" }) })) : null;
+    const wrappedBubble = hasContextMenu ? (_jsx(Dropdown, { menu: { items: contextMenuItems }, trigger: ["contextMenu"], open: contextMenuOpen, onOpenChange: onContextMenuOpenChange, overlayClassName: MESSAGE_TOOLBOX_OVERLAY_CLASSNAME, children: _jsxs("div", { ref: bubbleWrapperRef, className: "relative min-w-0", children: [bubbleNode, pinnedBadgeNode] }) })) : (_jsxs("div", { className: "relative min-w-0", children: [bubbleNode, pinnedBadgeNode] }));
+    return (_createElement("div", Object.assign({}, messageContainerProps, { key: message === null || message === void 0 ? void 0 : message.clientMsgID }),
+        timeBreakNode,
+        _jsxs("div", { className: clsx("flex min-w-0 items-end gap-1", isMine ? "justify-end pl-12 pr-3" : "justify-start pl-3 pr-12"), children: [!isMine &&
+                    showPeerInfo &&
+                    (showAvatar ? (_jsx(MessageAvatar, { avatarUrl: message === null || message === void 0 ? void 0 : message.senderFaceUrl })) : (_jsx("div", { className: "h-6 w-6 shrink-0 self-end" }))), _jsxs("div", { className: clsx("flex min-w-0 max-w-[75%] flex-col gap-1", isMine ? "items-end" : "items-start"), children: [_jsxs("div", { className: clsx("flex items-end gap-1.5", showPinnedBadge && "mt-1.5"), children: [isMine && (_jsx(MessageStatusIndicator, { message: message, isLatest: isLatestMine })), wrappedBubble] }), isMine && message.status === MessageStatus.Failed && (_jsx("span", { className: "mt-1 text-xs text-red-500", children: isMediaResendable(message) ? (_jsx(Trans, { i18nKey: "message_send_failed", components: {
+                                    bold: (_jsx("strong", { className: "cursor-pointer", onClick: () => resendMessage(message) })),
+                                } })) : (t("message_send_failed_no_retry")) }))] })] })));
+};
+export default MessageItem;

package/dist/src/components/message/item/mediaSize.d.ts

@@ -0,0 +1,16 @@
+export interface ImageMessageMinStyleOptions {
+    imageWidth?: number;
+    imageHeight?: number;
+    snapshotHeight?: number;
+}
+export declare const getImageMessageMinStyle: ({ imageWidth, imageHeight, snapshotHeight, }: ImageMessageMinStyleOptions) => {
+    minHeight: string;
+    minWidth: string;
+    width: number;
+};
+export declare const getVideoMessageMinStyle: ({ imageWidth, imageHeight, snapshotHeight, }: ImageMessageMinStyleOptions) => {
+    minHeight: string;
+    minWidth: string;
+    width: number;
+};
+//# sourceMappingURL=mediaSize.d.ts.map

package/dist/src/components/message/item/mediaSize.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mediaSize.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/item/mediaSize.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,2BAA2B;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,uBAAuB,GAAI,8CAIrC,2BAA2B;;;;CAmB7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,iDArBjC,2BAA2B;;;;CAqBgC,CAAC"}

package/dist/src/components/message/item/mediaSize.js

@@ -0,0 +1,20 @@
+const IMAGE_MAX_WIDTH = 200;
+export const getImageMessageMinStyle = ({ imageWidth, imageHeight, snapshotHeight, }) => {
+    if (!imageWidth || !imageHeight || imageWidth <= 0 || imageHeight <= 0) {
+        return {
+            minHeight: `${IMAGE_MAX_WIDTH}px`,
+            minWidth: `${IMAGE_MAX_WIDTH}px`,
+            width: IMAGE_MAX_WIDTH,
+        };
+    }
+    const snapshotMaxHeight = snapshotHeight !== null && snapshotHeight !== void 0 ? snapshotHeight : imageHeight;
+    const displayWidth = Math.min(imageWidth, IMAGE_MAX_WIDTH);
+    const aspectHeight = displayWidth * (imageHeight / imageWidth);
+    const displayHeight = Math.min(aspectHeight, snapshotMaxHeight);
+    return {
+        minHeight: `${displayHeight}px`,
+        minWidth: `${displayWidth}px`,
+        width: displayWidth,
+    };
+};
+export const getVideoMessageMinStyle = getImageMessageMinStyle;

package/dist/src/components/message/item/renderMessageContent.d.ts

@@ -0,0 +1,4 @@
+import { MessageItem as MessageItemType } from "@openim/wasm-client-sdk";
+export declare const renderMessageByType: (message: MessageItemType) => import("react/jsx-runtime").JSX.Element;
+export declare const renderBubbleContent: (message: MessageItemType, onPressQuoteMessage?: (clientMsgID: string) => void) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=renderMessageContent.d.ts.map

package/dist/src/components/message/item/renderMessageContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderMessageContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/item/renderMessageContent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,IAAI,eAAe,EAAe,MAAM,yBAAyB,CAAC;AAYtF,eAAO,MAAM,mBAAmB,GAAI,SAAS,eAAe,4CAyB3D,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAC9B,SAAS,eAAe,EACxB,sBAAsB,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,4CAwBpD,CAAC"}

package/dist/src/components/message/item/renderMessageContent.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { MessageType } from "@openim/wasm-client-sdk";
+import TextMessageItem from "./TextMessage";
+import ImageMessageItem from "./ImageMessage";
+import FileMessageItem from "./FileMessage";
+import VideoMessageItem from "./VideoMessage";
+import MergeImageMessageItem from "./MergeImageMessage";
+import UrlTextMessageItem from "./UrlTextMessage";
+import RevokeMessageItem from "./RevokeMessage";
+import QuoteMessageItem from "./QuoteMessage";
+import SystemLogMessageItem from "./SystemLogMessage";
+import CustomMessageItem from "./CustomMessage";
+export const renderMessageByType = (message) => {
+    switch (message === null || message === void 0 ? void 0 : message.contentType) {
+        case MessageType.TextMessage:
+        case MessageType.QuoteMessage:
+            return _jsx(TextMessageItem, { message: message });
+        case MessageType.PictureMessage:
+            return _jsx(ImageMessageItem, { message: message });
+        case MessageType.FileMessage:
+            return _jsx(FileMessageItem, { message: message });
+        case MessageType.VideoMessage:
+            return _jsx(VideoMessageItem, { message: message });
+        case MessageType.MergeMessage:
+            return _jsx(MergeImageMessageItem, { message: message });
+        case MessageType.UrlTextMessage:
+            return _jsx(UrlTextMessageItem, { message: message });
+        case MessageType.LogTextMessage:
+            return _jsx(SystemLogMessageItem, { message: message });
+        case MessageType.RevokeMessage:
+            return _jsx(RevokeMessageItem, {});
+        case MessageType.CustomMessage:
+            return _jsx(CustomMessageItem, { message: message });
+        default:
+            return _jsx(TextMessageItem, { message: message });
+    }
+};
+export const renderBubbleContent = (message, onPressQuoteMessage) => {
+    if (message === null || message === void 0 ? void 0 : message.quoteElem) {
+        return (_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx(QuoteMessageItem, { message: message, onPressQuoteMessage: onPressQuoteMessage }), renderMessageByType(message)] }));
+    }
+    if ((message === null || message === void 0 ? void 0 : message.contentType) === MessageType.MergeMessage) {
+        return (_jsxs(_Fragment, { children: [_jsx(MergeImageMessageItem, { message: message }), (message === null || message === void 0 ? void 0 : message.textElem) && _jsx(TextMessageItem, { message: message })] }));
+    }
+    return renderMessageByType(message);
+};

package/dist/src/components/message/item/textStyle.d.ts

@@ -0,0 +1,2 @@
+export declare const MESSAGE_TEXT_CLASS = "text-[16px] leading-[160%] tracking-[0.16px] text-gray-900";
+//# sourceMappingURL=textStyle.d.ts.map

package/dist/src/components/message/item/textStyle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textStyle.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/item/textStyle.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,kBAAkB,+DAC+B,CAAC"}

package/dist/src/components/message/item/textStyle.js

@@ -0,0 +1 @@
+export const MESSAGE_TEXT_CLASS = "text-[16px] leading-[160%] tracking-[0.16px] text-gray-900";

package/dist/src/components/message/reply/ReplyPreviewBar.d.ts

@@ -0,0 +1,3 @@
+export declare const ReplyPreviewBar: () => import("react/jsx-runtime").JSX.Element | null;
+export default ReplyPreviewBar;
+//# sourceMappingURL=ReplyPreviewBar.d.ts.map

package/dist/src/components/message/reply/ReplyPreviewBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReplyPreviewBar.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/reply/ReplyPreviewBar.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,eAAe,sDAuC3B,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/src/components/message/reply/ReplyPreviewBar.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { Icon } from "../../../components/icon";
+import useAuthStore from "../../../store/auth";
+import useConversationStore from "../../../store/conversation";
+import { ReplyQuoteContent } from "./ReplyQuoteContent";
+export const ReplyPreviewBar = () => {
+    const { t } = useTranslation();
+    const quotedMessage = useConversationStore((state) => state.quotedMessage);
+    const setQuotedMessage = useConversationStore((state) => state.setQuotedMessage);
+    const userID = useAuthStore((state) => state.userID);
+    const handleClearQuotedMessage = () => {
+        setQuotedMessage(null);
+    };
+    if (!quotedMessage)
+        return null;
+    const isMe = quotedMessage.sendID === userID;
+    const senderName = isMe
+        ? t("your_self")
+        : quotedMessage.senderNickname || "";
+    return (_jsxs("div", { "data-testid": "reply-preview-bar", className: "flex h-[59px] w-full shrink-0 items-center bg-gray-200/10 px-2 py-1", children: [_jsx(ReplyQuoteContent, { message: quotedMessage, title: t("reply_to", { name: senderName }) }), _jsx("button", { type: "button", onClick: handleClearQuotedMessage, "aria-label": t("cancel"), "data-testid": "reply-preview-bar-close", className: "flex h-4 w-4 shrink-0 items-center justify-center", children: _jsx(Icon, { icon: "close-o", size: 16, className: "text-gray-600" }) })] }));
+};
+export default ReplyPreviewBar;

package/dist/src/components/message/reply/ReplyPreviewMedia.d.ts

@@ -0,0 +1,7 @@
+import { MessageItem } from "@openim/wasm-client-sdk";
+interface ReplyPreviewMediaProps {
+    message: MessageItem;
+}
+declare const ReplyPreviewMedia: ({ message }: ReplyPreviewMediaProps) => import("react/jsx-runtime").JSX.Element | null;
+export default ReplyPreviewMedia;
+//# sourceMappingURL=ReplyPreviewMedia.d.ts.map

package/dist/src/components/message/reply/ReplyPreviewMedia.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReplyPreviewMedia.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/reply/ReplyPreviewMedia.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAe,MAAM,yBAAyB,CAAC;AAKnE,UAAU,sBAAsB;IAC9B,OAAO,EAAE,WAAW,CAAC;CACtB;AAED,QAAA,MAAM,iBAAiB,GAAI,aAAa,sBAAsB,mDAoD7D,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/src/components/message/reply/ReplyPreviewMedia.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MessageType } from "@openim/wasm-client-sdk";
+import { documentIcon } from "../../../assets/svg";
+import { Icon } from "../../../components/icon";
+import { parseUrlMetadata } from "../../../utils/common";
+const ReplyPreviewMedia = ({ message }) => {
+    var _a, _b, _c, _d, _e, _f;
+    if (message.contentType === MessageType.FileMessage) {
+        return (_jsx("div", { className: "flex h-6 w-6 shrink-0 items-center justify-center overflow-hidden [&>svg]:h-6 [&>svg]:w-6", children: documentIcon }));
+    }
+    if (message.contentType === MessageType.PictureMessage) {
+        const imageUrl = ((_b = (_a = message.pictureElem) === null || _a === void 0 ? void 0 : _a.sourcePicture) === null || _b === void 0 ? void 0 : _b.url) ||
+            ((_d = (_c = message.pictureElem) === null || _c === void 0 ? void 0 : _c.snapshotPicture) === null || _d === void 0 ? void 0 : _d.url);
+        if (!imageUrl)
+            return null;
+        return (_jsx("img", { src: imageUrl, alt: "", className: "h-[42px] w-[42px] shrink-0 rounded-lg object-cover" }));
+    }
+    if (message.contentType === MessageType.VideoMessage) {
+        const posterUrl = (_e = message.videoElem) === null || _e === void 0 ? void 0 : _e.snapshotUrl;
+        return (_jsxs("div", { className: "relative h-[42px] w-[42px] shrink-0 overflow-hidden rounded-lg bg-gray-900", children: [posterUrl && (_jsx("img", { src: posterUrl, alt: "", className: "h-full w-full object-cover" })), _jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: _jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-black/60", children: _jsx(Icon, { icon: "play-o", size: 12, className: "text-white" }) }) })] }));
+    }
+    if (message.contentType === MessageType.UrlTextMessage) {
+        const imageUrl = (_f = parseUrlMetadata(message.ex)) === null || _f === void 0 ? void 0 : _f.image;
+        if (!imageUrl)
+            return null;
+        return (_jsx("img", { src: imageUrl, alt: "", className: "h-[42px] w-[42px] shrink-0 rounded-lg object-cover" }));
+    }
+    return null;
+};
+export default ReplyPreviewMedia;

package/dist/src/components/message/reply/ReplyQuoteContent.d.ts

@@ -0,0 +1,9 @@
+import { MessageItem, MessageType } from "@openim/wasm-client-sdk";
+export declare const hasReplyMediaPreview: (contentType: MessageType) => boolean;
+interface ReplyQuoteContentProps {
+    message: MessageItem;
+    title?: string;
+}
+export declare const ReplyQuoteContent: ({ message, title, }: ReplyQuoteContentProps) => import("react/jsx-runtime").JSX.Element;
+export default ReplyQuoteContent;
+//# sourceMappingURL=ReplyQuoteContent.d.ts.map

package/dist/src/components/message/reply/ReplyQuoteContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReplyQuoteContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/reply/ReplyQuoteContent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AASnE,eAAO,MAAM,oBAAoB,GAAI,aAAa,WAAW,YACb,CAAC;AAEjD,UAAU,sBAAsB;IAC9B,OAAO,EAAE,WAAW,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,iBAAiB,GAAI,qBAG/B,sBAAsB,4CA2BxB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/src/components/message/reply/ReplyQuoteContent.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { MessageType } from "@openim/wasm-client-sdk";
+import { generateContentBasedOnMessageType } from "../../../utils/common";
+import ReplyPreviewMedia from "./ReplyPreviewMedia";
+const TEXT_LIKE_MESSAGE_TYPES = [
+    MessageType.TextMessage,
+    MessageType.QuoteMessage,
+];
+export const hasReplyMediaPreview = (contentType) => !TEXT_LIKE_MESSAGE_TYPES.includes(contentType);
+export const ReplyQuoteContent = ({ message, title = "", }) => {
+    var _a, _b, _c, _d;
+    const { t } = useTranslation();
+    const hasMedia = hasReplyMediaPreview(message.contentType);
+    return (_jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-0.5 pr-2 self-stretch", children: [_jsx("div", { className: "w-[3px] shrink-0 self-stretch rounded bg-gray-cool-200" }), hasMedia && _jsx(ReplyPreviewMedia, { message: message }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center py-1 pl-2", children: [_jsx("p", { className: "truncate text-[14px] font-medium leading-[160%] text-gray-900", children: title }), _jsx("p", { className: "truncate text-[13px] leading-[160%] text-gray-400", children: generateContentBasedOnMessageType(message.contentType, ((_a = message.textElem) === null || _a === void 0 ? void 0 : _a.content) || ((_b = message.quoteElem) === null || _b === void 0 ? void 0 : _b.text), t, {
+                            duration: (_c = message.videoElem) === null || _c === void 0 ? void 0 : _c.duration,
+                            fileName: (_d = message.fileElem) === null || _d === void 0 ? void 0 : _d.fileName,
+                        }, message.customElem) })] })] }));
+};
+export default ReplyQuoteContent;

package/dist/src/components/message/toolbox/MessageToolboxMenu.d.ts

@@ -0,0 +1,5 @@
+import type { MenuProps } from "antd";
+import { MessageToolboxAction } from "./types";
+export declare const MESSAGE_TOOLBOX_OVERLAY_CLASSNAME: string;
+export declare const buildMessageToolboxMenuItems: (actions: MessageToolboxAction[]) => NonNullable<MenuProps["items"]>;
+//# sourceMappingURL=MessageToolboxMenu.d.ts.map

package/dist/src/components/message/toolbox/MessageToolboxMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageToolboxMenu.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/toolbox/MessageToolboxMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,MAAM,CAAC;AAEtC,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAE/C,eAAO,MAAM,iCAAiC,QAS7C,CAAC;AA0BF,eAAO,MAAM,4BAA4B,GACvC,SAAS,oBAAoB,EAAE,KAC9B,WAAW,CAAC,SAAS,CAAC,OAAO,CAAC,CAO5B,CAAC"}

package/dist/src/components/message/toolbox/MessageToolboxMenu.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import { Icon } from "../../../components/icon";
+export const MESSAGE_TOOLBOX_OVERLAY_CLASSNAME = clsx("[&_.ant-dropdown-menu]:min-w-[200px]", "[&_.ant-dropdown-menu]:rounded-2xl", "[&_.ant-dropdown-menu]:p-0", "[&_.ant-dropdown-menu]:py-2", "[&_.ant-dropdown-menu]:shadow-message-toolbox", "[&_.ant-dropdown-menu-item]:rounded-none", "[&_.ant-dropdown-menu-item]:!px-4", "[&_.ant-dropdown-menu-item]:!py-1.5");
+const ToolboxMenuRow = ({ icon, label, danger = false }) => (_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Icon, { icon: icon, size: 24, className: danger ? "text-danger-400" : "text-gray-900" }), _jsx("span", { className: clsx("text-base font-medium", danger ? "text-danger-400" : "text-gray-900"), children: label })] }));
+export const buildMessageToolboxMenuItems = (actions) => actions.map((action) => ({
+    key: action.key,
+    label: (_jsx(ToolboxMenuRow, { icon: action.icon, label: action.label, danger: action.danger })),
+    onClick: action.onClick,
+}));

package/dist/src/components/message/toolbox/getCopyableMessageText.d.ts

@@ -0,0 +1,4 @@
+import { MessageItem as MessageItemType, MessageType } from "@openim/wasm-client-sdk";
+export declare const isCopyableMessageType: (contentType?: MessageType) => boolean;
+export declare const getCopyableMessageText: (message: MessageItemType) => string;
+//# sourceMappingURL=getCopyableMessageText.d.ts.map

package/dist/src/components/message/toolbox/getCopyableMessageText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getCopyableMessageText.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/toolbox/getCopyableMessageText.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,IAAI,eAAe,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAUtF,eAAO,MAAM,qBAAqB,GAAI,cAAc,WAAW,KAAG,OACH,CAAC;AAEhE,eAAO,MAAM,sBAAsB,GAAI,SAAS,eAAe,KAAG,MAuBjE,CAAC"}

package/dist/src/components/message/toolbox/getCopyableMessageText.js

@@ -0,0 +1,28 @@
+import { MessageType } from "@openim/wasm-client-sdk";
+import { htmlHasFormatting, stripHtml } from "../../../utils/common";
+const COPYABLE_MESSAGE_TYPES = [
+    MessageType.TextMessage,
+    MessageType.QuoteMessage,
+    MessageType.UrlTextMessage,
+];
+export const isCopyableMessageType = (contentType) => !!contentType && COPYABLE_MESSAGE_TYPES.includes(contentType);
+export const getCopyableMessageText = (message) => {
+    var _a, _b, _c, _d, _e, _f, _g;
+    let extendMessageInfo = null;
+    try {
+        extendMessageInfo = JSON.parse((message === null || message === void 0 ? void 0 : message.ex) || "{}");
+    }
+    catch (_h) {
+        extendMessageInfo = {};
+    }
+    const richHtmlContent = ((_b = (_a = extendMessageInfo === null || extendMessageInfo === void 0 ? void 0 : extendMessageInfo.messageInfo) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.content) || "";
+    if (richHtmlContent && htmlHasFormatting(richHtmlContent)) {
+        return stripHtml(richHtmlContent);
+    }
+    return (((_c = message === null || message === void 0 ? void 0 : message.textElem) === null || _c === void 0 ? void 0 : _c.content) ||
+        ((_d = message === null || message === void 0 ? void 0 : message.quoteElem) === null || _d === void 0 ? void 0 : _d.text) ||
+        ((_e = message === null || message === void 0 ? void 0 : message.urlTextElem) === null || _e === void 0 ? void 0 : _e.content) ||
+        stripHtml(richHtmlContent) ||
+        ((_g = (_f = message === null || message === void 0 ? void 0 : message.urlTextElem) === null || _f === void 0 ? void 0 : _f.urls) === null || _g === void 0 ? void 0 : _g[0]) ||
+        "");
+};

package/dist/src/components/message/toolbox/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./types";
+export * from "./MessageToolboxMenu";
+export * from "./useMessageToolboxVisibility";
+export * from "./getCopyableMessageText";
+export * from "./isPinnableMessageType";
+//# sourceMappingURL=index.d.ts.map

package/dist/src/components/message/toolbox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/toolbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,sBAAsB,CAAC;AACrC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC"}

package/dist/src/components/message/toolbox/index.js

@@ -0,0 +1,5 @@
+export * from "./types";
+export * from "./MessageToolboxMenu";
+export * from "./useMessageToolboxVisibility";
+export * from "./getCopyableMessageText";
+export * from "./isPinnableMessageType";

package/dist/src/components/message/toolbox/isPinnableMessageType.d.ts

@@ -0,0 +1,3 @@
+import { MessageType } from "@openim/wasm-client-sdk";
+export declare const isPinnableMessageType: (contentType?: MessageType) => boolean;
+//# sourceMappingURL=isPinnableMessageType.d.ts.map

package/dist/src/components/message/toolbox/isPinnableMessageType.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"isPinnableMessageType.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/toolbox/isPinnableMessageType.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAYtD,eAAO,MAAM,qBAAqB,GAAI,cAAc,WAAW,YACY,CAAC"}

package/dist/src/components/message/toolbox/isPinnableMessageType.js

@@ -0,0 +1,11 @@
+import { MessageType } from "@openim/wasm-client-sdk";
+const PINNABLE_MESSAGE_TYPES = [
+    MessageType.TextMessage,
+    MessageType.QuoteMessage,
+    MessageType.UrlTextMessage,
+    MessageType.PictureMessage,
+    MessageType.VideoMessage,
+    MessageType.FileMessage,
+    MessageType.MergeMessage
+];
+export const isPinnableMessageType = (contentType) => contentType !== undefined && PINNABLE_MESSAGE_TYPES.includes(contentType);

package/dist/src/components/message/toolbox/types.d.ts

@@ -0,0 +1,17 @@
+export declare const MessageToolboxActionKey: {
+    readonly REPLY: "REPLY";
+    readonly PIN: "PIN";
+    readonly UNPIN: "UNPIN";
+    readonly VIEW_ORIGINAL: "VIEW_ORIGINAL";
+    readonly COPY_MESSAGE: "COPY_MESSAGE";
+    readonly REVOKE: "REVOKE";
+};
+export type MessageToolboxActionKey = (typeof MessageToolboxActionKey)[keyof typeof MessageToolboxActionKey];
+export interface MessageToolboxAction {
+    key: MessageToolboxActionKey;
+    label: string;
+    icon: string;
+    danger?: boolean;
+    onClick: () => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/src/components/message/toolbox/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/toolbox/types.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,uBAAuB;;;;;;;CAO1B,CAAC;AAEX,MAAM,MAAM,uBAAuB,GACjC,CAAC,OAAO,uBAAuB,CAAC,CAAC,MAAM,OAAO,uBAAuB,CAAC,CAAC;AAEzE,MAAM,WAAW,oBAAoB;IACnC,GAAG,EAAE,uBAAuB,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB"}

package/dist/src/components/message/toolbox/types.js

@@ -0,0 +1,8 @@
+export const MessageToolboxActionKey = {
+    REPLY: "REPLY",
+    PIN: "PIN",
+    UNPIN: "UNPIN",
+    VIEW_ORIGINAL: "VIEW_ORIGINAL",
+    COPY_MESSAGE: "COPY_MESSAGE",
+    REVOKE: "REVOKE",
+};

package/dist/src/components/message/toolbox/useMessageToolboxVisibility.d.ts

@@ -0,0 +1,9 @@
+import { MessageItem as MessageItemType } from "@openim/wasm-client-sdk";
+interface MessageToolboxVisibility {
+    isDeliveredForUi: boolean;
+    isMine: boolean;
+    isRevocable: boolean;
+}
+export declare const useMessageToolboxVisibility: (message: MessageItemType, userID?: string) => MessageToolboxVisibility;
+export {};
+//# sourceMappingURL=useMessageToolboxVisibility.d.ts.map

package/dist/src/components/message/toolbox/useMessageToolboxVisibility.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMessageToolboxVisibility.d.ts","sourceRoot":"","sources":["../../../../../src/components/message/toolbox/useMessageToolboxVisibility.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,WAAW,IAAI,eAAe,EAE/B,MAAM,yBAAyB,CAAC;AAIjC,UAAU,wBAAwB;IAChC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,2BAA2B,GACtC,SAAS,eAAe,EACxB,SAAS,MAAM,KACd,wBAcoB,CAAC"}

package/dist/src/components/message/toolbox/useMessageToolboxVisibility.js

@@ -0,0 +1,15 @@
+import { useMemo } from "react";
+import dayjs from "dayjs";
+import { MessageStatus, } from "@openim/wasm-client-sdk";
+const REVOKE_WINDOW_DAYS = 1;
+export const useMessageToolboxVisibility = (message, userID) => useMemo(() => {
+    const isMine = (message === null || message === void 0 ? void 0 : message.sendID) === userID;
+    const isOlderThanRevokeWindow = dayjs().diff(dayjs(message === null || message === void 0 ? void 0 : message.sendTime), "days", true) >= REVOKE_WINDOW_DAYS;
+    const isDeliveredForUi = (message === null || message === void 0 ? void 0 : message.status) !== MessageStatus.Sending &&
+        (message === null || message === void 0 ? void 0 : message.status) !== MessageStatus.Failed;
+    return {
+        isDeliveredForUi,
+        isMine,
+        isRevocable: isMine && isDeliveredForUi && !isOlderThanRevokeWindow,
+    };
+}, [userID, message]);

package/dist/src/components/rich-text-editor/RichTextEditor.d.ts

@@ -0,0 +1,12 @@
+import { UploadFile } from "antd";
+interface RichTextEditorProps {
+    initialHtml?: string;
+    placeholder?: string;
+    onChange?: (html: string, plainText: string) => void;
+    onFilesChange?: (files: UploadFile[]) => void;
+    minHeight?: string;
+    showMediaUpload?: boolean;
+}
+export default function RichTextEditor({ initialHtml, placeholder, onChange, onFilesChange, minHeight, showMediaUpload, }: RichTextEditorProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=RichTextEditor.d.ts.map

package/dist/src/components/rich-text-editor/RichTextEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichTextEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/rich-text-editor/RichTextEditor.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AA0ClC,UAAU,mBAAmB;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,WAAW,EACX,WAAW,EACX,QAAQ,EACR,aAAa,EACb,SAAmB,EACnB,eAAsB,GACvB,EAAE,mBAAmB,2CA6DrB"}