@droppii-org/chat-sdk 0.1.73 → 0.1.75

package/dist/src/components/conversation-detail/ConversationDetailHeader.js

@@ -1,19 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useTranslation } from "react-i18next";
-import { Icon } from "../../components/icon";
-import ConversationPeerAvatar from "../../components/conversation-inbox/ConversationPeerAvatar";
-import ConversationInboxTitle from "../../components/conversation-inbox/ConversationInboxTitle";
-import { resolveConversationDisplayName, resolvePeerBadgeLabel, } from "../../utils/conversation";
-import { useConversationAvatarUrl } from "../../hooks/conversation/useConversationAvatarUrl";
-const HeaderIconButton = ({ icon, onClick, testId, }) => (_jsx("button", { type: "button", onClick: onClick, "data-testid": testId, className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-primary-400", children: _jsx(Icon, { icon: icon, size: 24 }) }));
-const ConversationDetailHeader = ({ conversation, onBack, }) => {
-    const { t } = useTranslation("conversation-inbox");
-    const displayName = resolveConversationDisplayName(conversation, t);
-    const avatarUrl = useConversationAvatarUrl(conversation);
-    const peerType = conversation.peerType;
-    const badgeLabel = resolvePeerBadgeLabel(peerType, t);
-    const subtitle = t("thread_detail.profile_hint");
-    return (_jsxs("div", { "data-testid": "conversation-detail-header", className: "flex w-full cursor-default items-center border-b border-gray-25 bg-white p-2 shadow-inset-gray-divider", children: [_jsx(HeaderIconButton, { icon: "arrow-left-o", onClick: onBack, testId: "conversation-detail-back" }), _jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2 px-1", "data-testid": "conversation-detail-profile", children: [_jsx(ConversationPeerAvatar, { peerType: peerType, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(ConversationInboxTitle, { peerType: peerType, displayName: displayName }), _jsx("p", { className: "truncate text-[10px] font-normal leading-[160%] tracking-[0.1px] text-gray-600 [font-feature-settings:'liga'_off,'clig'_off]", children: subtitle })] })] })] }));
-};
-export default ConversationDetailHeader;

package/dist/src/components/conversation-detail/ConversationDetailInput.d.ts

@@ -1,10 +0,0 @@
-import type { MoreOptionConfig } from "../../constants/moreOption";
-export interface ConversationDetailInputProps {
-    placeholder?: string;
-    onSendMessage?: (text: string) => void;
-    onInputChange?: (value: string) => void;
-    moreOptions?: MoreOptionConfig[];
-}
-declare const ConversationDetailInput: ({ placeholder, onSendMessage, onInputChange, moreOptions, }: ConversationDetailInputProps) => import("react/jsx-runtime").JSX.Element;
-export default ConversationDetailInput;
-//# sourceMappingURL=ConversationDetailInput.d.ts.map

package/dist/src/components/conversation-detail/ConversationDetailInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ConversationDetailInput.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/ConversationDetailInput.tsx"],"names":[],"mappings":"AA2BA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAK/D,MAAM,WAAW,4BAA4B;IAC3C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,gBAAgB,EAAE,CAAC;CAClC;AAED,QAAA,MAAM,uBAAuB,GAAI,6DAK9B,4BAA4B,4CA8Y9B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/dist/src/components/conversation-detail/ConversationDetailInput.js

@@ -1,259 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { useBoolean } from "ahooks";
-import clsx from "clsx";
-import { Icon } from "../../components/icon";
-import { useSendMessage } from "../../hooks/message/useSendMessage";
-import useAuthStore from "../../store/auth";
-import useConversationStore from "../../store/conversation";
-import useMessageDraftStore from "../../store/messageDraft";
-import { resolveConversationAvatarUrl, resolveConversationDisplayName, } from "../../utils/conversation";
-import { emit } from "../../utils/events";
-import { extractLinkUrls } from "../../utils/link";
-import { useFetchUrlMetadata } from "../../hooks/common/useFetchUrlMetadata";
-import { processAndValidateDocuments, processAndValidateFiles, } from "../../utils/fileValidation";
-import { FilePreviewList } from "../../components/message/footer/FilePreview";
-import LinkInputPreview from "../../components/message/footer/LinkInputPreview";
-import { ReplyPreviewBar } from "../../components/message/reply/ReplyPreviewBar";
-import ConversationMoreOptionPanel from "./ConversationMoreOptionPanel";
-const MAX_LINES = 5;
-const CONTAINER_MIN_HEIGHT = 48;
-const ConversationDetailInput = ({ placeholder, onSendMessage, onInputChange, moreOptions, }) => {
-    const { t } = useTranslation("conversation-inbox");
-    const { t: tCommon } = useTranslation("common");
-    const conversationData = useConversationStore((state) => state.conversationData);
-    const selectedConversationId = useConversationStore((state) => state.selectedConversationId);
-    const conversationId = selectedConversationId || (conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationID) || "";
-    const isConversationReady = !!conversationData && (!!conversationData.userID || !!conversationData.groupID);
-    const sendMessageOptions = useMemo(() => ({
-        scrollEvent: "CONVERSATION_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM",
-        resolveOfflinePushMeta: () => ({
-            title: conversationData
-                ? resolveConversationDisplayName(conversationData, t)
-                : "Droppii Chat",
-            icon: (conversationData && resolveConversationAvatarUrl(conversationData)) ||
-                "",
-            conversationId: (conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationID) || "",
-        }),
-    }), [conversationData, t]);
-    const { sendMergeMessage } = useSendMessage(sendMessageOptions);
-    const userID = useAuthStore((state) => state.userID);
-    const setDraft = useMessageDraftStore((state) => state.setDraft);
-    const clearDraft = useMessageDraftStore((state) => state.clearDraft);
-    const containerRef = useRef(null);
-    const textareaRef = useRef(null);
-    const mediaInputRef = useRef(null);
-    const documentInputRef = useRef(null);
-    const [value, setValue] = useState("");
-    const [listUploadFiles, setListUploadFiles] = useState([]);
-    const [isVideoLoading, setIsVideoLoading] = useState(false);
-    const [isFocused, setIsFocused] = useState(false);
-    const [isSending, setIsSending] = useState(false);
-    const [previewDismissed, setPreviewDismissed] = useState(false);
-    const [isMoreOptionOpen, { setFalse: closeMoreOption, toggle: toggleMoreOption },] = useBoolean(false);
-    const previewUrl = useMemo(() => {
-        const urls = extractLinkUrls(value);
-        return urls.length === 1 ? urls[0] : null;
-    }, [value]);
-    const showLinkPreview = !!previewUrl && !previewDismissed;
-    const { data: previewMetadata } = useFetchUrlMetadata(previewUrl !== null && previewUrl !== void 0 ? previewUrl : "", showLinkPreview);
-    useEffect(() => {
-        setPreviewDismissed(false);
-    }, [previewUrl]);
-    const hasFiles = listUploadFiles.length > 0;
-    const canSend = (value.trim().length > 0 || hasFiles) &&
-        !isSending &&
-        isConversationReady &&
-        !isVideoLoading;
-    const getTextareaHeights = useCallback(() => {
-        const textarea = textareaRef.current;
-        if (!textarea)
-            return null;
-        const lineHeight = parseFloat(window.getComputedStyle(textarea).lineHeight);
-        return {
-            lineHeight,
-            maxHeight: lineHeight * MAX_LINES,
-        };
-    }, []);
-    const adjustTextareaHeight = useCallback(() => {
-        const textarea = textareaRef.current;
-        const heights = getTextareaHeights();
-        if (!textarea || !heights)
-            return;
-        textarea.style.height = `${heights.lineHeight}px`;
-        const scrollHeight = textarea.scrollHeight;
-        const nextHeight = Math.min(Math.max(scrollHeight, heights.lineHeight), heights.maxHeight);
-        textarea.style.height = `${nextHeight}px`;
-        textarea.style.overflowY =
-            scrollHeight > heights.maxHeight ? "auto" : "hidden";
-    }, [getTextareaHeights]);
-    useEffect(() => {
-        closeMoreOption();
-        setListUploadFiles([]);
-        setIsVideoLoading(false);
-    }, [conversationId, userID, closeMoreOption]);
-    useEffect(() => {
-        var _a;
-        if (!conversationId || !userID) {
-            setValue("");
-            return;
-        }
-        const draft = (_a = useMessageDraftStore.getState().drafts[`${userID}:${conversationId}`]) !== null && _a !== void 0 ? _a : "";
-        setValue(draft);
-        requestAnimationFrame(adjustTextareaHeight);
-    }, [conversationId, userID, adjustTextareaHeight]);
-    useEffect(() => {
-        adjustTextareaHeight();
-    }, [value, adjustTextareaHeight]);
-    useEffect(() => {
-        if (!isFocused)
-            return;
-        const handlePointerDown = (event) => {
-            var _a, _b;
-            if ((_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target))
-                return;
-            (_b = textareaRef.current) === null || _b === void 0 ? void 0 : _b.blur();
-        };
-        document.addEventListener("pointerdown", handlePointerDown);
-        return () => document.removeEventListener("pointerdown", handlePointerDown);
-    }, [isFocused]);
-    useEffect(() => {
-        const viewport = window.visualViewport;
-        if (!viewport)
-            return;
-        const handleViewportChange = () => {
-            if (document.activeElement === textareaRef.current) {
-                emit("CONVERSATION_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM");
-            }
-        };
-        viewport.addEventListener("resize", handleViewportChange);
-        return () => viewport.removeEventListener("resize", handleViewportChange);
-    }, []);
-    const handleMediaInputChange = useCallback((event) => {
-        var _a;
-        const files = Array.from((_a = event.target.files) !== null && _a !== void 0 ? _a : []);
-        if (files.length === 0)
-            return;
-        const validFiles = processAndValidateFiles(files, {
-            t: tCommon,
-            currentUploadedFiles: listUploadFiles,
-        });
-        if (validFiles.length > 0) {
-            setListUploadFiles((prev) => [...prev, ...validFiles]);
-            const hasVideo = validFiles.some((f) => { var _a; return (_a = f.originFileObj) === null || _a === void 0 ? void 0 : _a.type.startsWith("video/"); });
-            if (hasVideo)
-                setIsVideoLoading(true);
-        }
-        event.target.value = "";
-    }, [tCommon, listUploadFiles]);
-    const handleDocumentInputChange = useCallback((event) => {
-        var _a;
-        const files = Array.from((_a = event.target.files) !== null && _a !== void 0 ? _a : []);
-        if (files.length === 0)
-            return;
-        const validFiles = processAndValidateDocuments(files, tCommon);
-        if (validFiles.length > 0) {
-            setListUploadFiles((prev) => [...prev, ...validFiles]);
-        }
-        event.target.value = "";
-    }, [tCommon]);
-    const handleRemoveFile = useCallback((uid) => {
-        setListUploadFiles((prev) => prev.filter((f) => f.uid !== uid));
-        setIsVideoLoading(false);
-    }, []);
-    const handleChange = (nextValue) => {
-        setValue(nextValue);
-        if (conversationId && userID) {
-            setDraft(userID, conversationId, nextValue);
-        }
-        onInputChange === null || onInputChange === void 0 ? void 0 : onInputChange(nextValue);
-    };
-    const resetComposer = () => {
-        setValue("");
-        setListUploadFiles([]);
-        setIsVideoLoading(false);
-        setPreviewDismissed(false);
-        if (conversationId && userID) {
-            clearDraft(userID, conversationId);
-        }
-        requestAnimationFrame(adjustTextareaHeight);
-    };
-    const handleSend = async () => {
-        const text = value.trim();
-        if ((!text && !hasFiles) || isSending)
-            return;
-        const filesToSend = listUploadFiles;
-        const urlMetadata = showLinkPreview && previewUrl && previewMetadata
-            ? {
-                url: previewUrl,
-                title: previewMetadata.title,
-                description: previewMetadata.description,
-                image: previewMetadata.image,
-            }
-            : undefined;
-        resetComposer();
-        setIsSending(true);
-        try {
-            if (onSendMessage) {
-                onSendMessage(text);
-            }
-            else {
-                await sendMergeMessage({
-                    plainText: text,
-                    richText: "",
-                    files: filesToSend,
-                    isInternal: false,
-                    urlMetadata,
-                });
-            }
-        }
-        catch (error) {
-            console.error("handleSend", error);
-        }
-        finally {
-            setIsSending(false);
-        }
-    };
-    const handleFocus = () => {
-        setIsFocused(true);
-        closeMoreOption();
-        emit("CONVERSATION_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM");
-    };
-    const handleBlur = () => {
-        setIsFocused(false);
-    };
-    const handleToggleMoreOption = () => {
-        var _a;
-        if (!isMoreOptionOpen) {
-            (_a = textareaRef.current) === null || _a === void 0 ? void 0 : _a.blur();
-        }
-        toggleMoreOption();
-    };
-    const insertNewline = (textarea) => {
-        const { selectionStart, selectionEnd } = textarea;
-        const nextValue = value.slice(0, selectionStart) + "\n" + value.slice(selectionEnd);
-        handleChange(nextValue);
-        requestAnimationFrame(() => {
-            textarea.selectionStart = selectionStart + 1;
-            textarea.selectionEnd = selectionStart + 1;
-            adjustTextareaHeight();
-        });
-    };
-    const handleKeyDown = (event) => {
-        if (event.key !== "Enter")
-            return;
-        if (event.shiftKey) {
-            event.preventDefault();
-            insertNewline(event.currentTarget);
-            return;
-        }
-        event.preventDefault();
-        void handleSend();
-    };
-    return (_jsxs("div", { ref: containerRef, "data-testid": "conversation-detail-input", className: "flex w-full shrink-0 flex-col bg-chat-bubble-neutral/[0.05]", children: [_jsx("input", { ref: mediaInputRef, type: "file", accept: "image/jpeg,image/png,image/jpg,video/*", multiple: true, className: "hidden", onChange: handleMediaInputChange }), _jsx("input", { ref: documentInputRef, type: "file", accept: ".pdf,.doc,.docx", multiple: true, className: "hidden", onChange: handleDocumentInputChange }), _jsx(ReplyPreviewBar, {}), listUploadFiles.length > 0 && (_jsx(FilePreviewList, { files: listUploadFiles, onRemove: (file) => handleRemoveFile(file.uid), onVideoReady: () => setIsVideoLoading(false) })), showLinkPreview && previewUrl && (_jsx(LinkInputPreview, { url: previewUrl, onRemove: () => setPreviewDismissed(true) })), _jsxs("div", { className: "flex items-end gap-3 px-3 py-2", children: [_jsx("div", { className: "flex shrink-0 items-center", children: _jsx("button", { type: "button", onClick: handleToggleMoreOption, "aria-label": t("thread_detail.more_option.toggle"), "aria-expanded": isMoreOptionOpen, "data-testid": "conversation-detail-more-option-toggle", className: "flex py-3 items-center justify-center rounded-full", children: isMoreOptionOpen ? (_jsx(Icon, { icon: "close-circle-b", size: 24, className: "text-primary-400" })) : (_jsx(Icon, { icon: "plus-circle-o", size: 24, className: "text-gray-900" })) }) }), _jsx("div", { className: clsx("flex min-w-0 flex-1 overflow-hidden rounded-xl border bg-white transition-shadow", isFocused
-                            ? "border-primary-200 shadow-primary-focus"
-                            : "border-gray-50"), style: { minHeight: CONTAINER_MIN_HEIGHT }, children: _jsx("div", { className: "flex min-w-0 flex-[1_0_0] items-center gap-2 self-stretch px-3 py-1", children: _jsx("textarea", { ref: textareaRef, value: value, rows: 1, onChange: (event) => handleChange(event.target.value), onFocus: handleFocus, onBlur: handleBlur, onKeyDown: handleKeyDown, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : t("thread_detail.input_placeholder"), "data-testid": "conversation-detail-message-input", className: "conversation-message-input-scrollbar min-h-0 min-w-0 flex-1 resize-none appearance-none border-0 bg-transparent p-0 text-[16px] leading-[1.6] tracking-[0.16px] text-black outline-none ring-0 placeholder:text-gray-400 focus:border-0 focus:outline-none focus:ring-0" }) }) }), _jsx("div", { className: "flex shrink-0 items-center pb-1", children: _jsx("button", { type: "button", onClick: () => void handleSend(), disabled: !canSend, "data-testid": "conversation-detail-send", className: clsx("flex h-10 w-10 items-center justify-center rounded-full", canSend ? "bg-chat-send" : "bg-chat-send opacity-25"), children: _jsx(Icon, { icon: "send-b", size: 20, className: "text-white" }) }) })] }), isMoreOptionOpen && (_jsx(ConversationMoreOptionPanel, { disabled: !isConversationReady, options: moreOptions, onTriggerMediaInput: () => { var _a; return (_a = mediaInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, onTriggerDocumentInput: () => { var _a; return (_a = documentInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); } }))] }));
-};
-export default ConversationDetailInput;

package/dist/src/components/conversation-detail/ConversationMessageList.d.ts

@@ -1,7 +0,0 @@
-import { type ReactNode } from "react";
-export interface ConversationMessageListProps {
-    bottomSlot?: ReactNode;
-}
-declare const ConversationMessageList: ({ bottomSlot }: ConversationMessageListProps) => import("react/jsx-runtime").JSX.Element;
-export default ConversationMessageList;
-//# sourceMappingURL=ConversationMessageList.d.ts.map

package/dist/src/components/conversation-detail/ConversationMessageList.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ConversationMessageList.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/ConversationMessageList.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAoC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAkBzE,MAAM,WAAW,4BAA4B;IAC3C,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED,QAAA,MAAM,uBAAuB,GAAI,gBAAgB,4BAA4B,4CAuL5E,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/dist/src/components/conversation-detail/ConversationMessageList.js

@@ -1,97 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from "react";
-import { Empty, Spin, message as toastMessage } from "antd";
-import { useEventListener } from "ahooks";
-import { useTranslation } from "react-i18next";
-import { useChatContext } from "../../context/ChatContext";
-import MessageInfiniteScroll from "../../components/message/MessageInfiniteScroll";
-import { useMessage } from "../../hooks/message/useMessage";
-import { useMessageListScroll } from "../../hooks/message/useMessageListScroll";
-import { usePinMessage } from "../../hooks/message/usePinMessage";
-import { useRevokeMessage } from "../../hooks/message/useRevokeMessage";
-import useConversationStore from "../../store/conversation";
-import useAuthStore from "../../store/auth";
-import { isGroupChat as resolveIsGroupChat } from "../../utils/conversation";
-import emitter from "../../utils/events";
-import MessageItem from "../../components/message/item";
-import PinLimitModal from "./PinLimitModal";
-const ConversationMessageList = ({ bottomSlot }) => {
-    const { t } = useTranslation("conversation-inbox");
-    const { t: tCommon } = useTranslation();
-    const { user } = useChatContext();
-    const authUserID = useAuthStore((state) => state.userID);
-    const conversation = useConversationStore((state) => state.conversationData);
-    const selectedConversationId = useConversationStore((state) => state.selectedConversationId);
-    const setQuotedMessage = useConversationStore((state) => state.setQuotedMessage);
-    const searchClientMsgID = useConversationStore((state) => state.searchClientMsgID);
-    const setSearchClientMsgID = useConversationStore((state) => state.setSearchClientMsgID);
-    const conversationId = selectedConversationId || (conversation === null || conversation === void 0 ? void 0 : conversation.conversationID) || "";
-    const isGroupChat = conversation ? resolveIsGroupChat(conversation) : false;
-    const messageController = useMessage(conversationId, searchClientMsgID, true, true);
-    const { scrollRef, loadMoreOldMessage, handleInfiniteScroll, scrollToBottomIfAtBottom, scrollToMessage, } = useMessageListScroll(Object.assign({ conversationId, userId: (user === null || user === void 0 ? void 0 : user.userID) || authUserID }, messageController));
-    const { loadState, moreOldLoading } = messageController;
-    const isMessageLoading = !conversationId || loadState.initLoading;
-    const [openToolboxMessageId, setOpenToolboxMessageId] = useState(null);
-    const closeToolbox = useCallback(() => setOpenToolboxMessageId(null), []);
-    const { pinMessage, unpinMessage } = usePinMessage();
-    const pinnedTotalCount = useConversationStore((state) => state.pinnedTotalCount);
-    const pinnedRemainingCount = useConversationStore((state) => state.pinnedRemainingCount);
-    const [pinLimitModalOpen, setPinLimitModalOpen] = useState(false);
-    const handlePinMessage = useCallback(async (message) => {
-        if (pinnedRemainingCount <= 0 && pinnedTotalCount > 0) {
-            setPinLimitModalOpen(true);
-            return;
-        }
-        try {
-            await pinMessage(conversationId, message.clientMsgID);
-            toastMessage.success(tCommon("pin_message_success"));
-        }
-        catch (_a) {
-            toastMessage.error(tCommon("pin_message_failed"));
-        }
-    }, [conversationId, pinMessage, pinnedRemainingCount, pinnedTotalCount, tCommon]);
-    const handleUnpinMessage = useCallback(async (message) => {
-        try {
-            await unpinMessage(conversationId, message.clientMsgID);
-            toastMessage.success(tCommon("unpin_message_success"));
-        }
-        catch (_a) {
-            toastMessage.error(tCommon("unpin_message_failed"));
-        }
-    }, [conversationId, unpinMessage, tCommon]);
-    const { revokeMessage } = useRevokeMessage();
-    const handleRevokeMessage = useCallback(async (clientMsgID) => {
-        closeToolbox();
-        try {
-            await revokeMessage(conversationId, clientMsgID);
-            toastMessage.success(tCommon("revoke_message_success"));
-        }
-        catch (_a) {
-            toastMessage.error(tCommon("revoke_message_failed"));
-        }
-    }, [closeToolbox, conversationId, revokeMessage, tCommon]);
-    const onPressQuoteMessage = useCallback((clientMsgID) => {
-        const hasMessage = loadState.messageList.some((msg) => msg.clientMsgID === clientMsgID);
-        if (hasMessage) {
-            scrollToMessage(clientMsgID);
-        }
-        else {
-            setSearchClientMsgID(clientMsgID);
-        }
-    }, [scrollToMessage, loadState.messageList, setSearchClientMsgID]);
-    useEffect(() => {
-        emitter.on("CONVERSATION_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM", scrollToBottomIfAtBottom);
-        emitter.on("CHAT_LIST_SCROLL_TO_MESSAGE", scrollToMessage);
-        return () => {
-            emitter.off("CONVERSATION_CHAT_SCROLL_TO_BOTTOM_IF_AT_BOTTOM", scrollToBottomIfAtBottom);
-            emitter.off("CHAT_LIST_SCROLL_TO_MESSAGE", scrollToMessage);
-        };
-    }, [scrollToBottomIfAtBottom, scrollToMessage]);
-    useEventListener("scroll", closeToolbox, {
-        target: scrollRef,
-        enable: !!openToolboxMessageId,
-    });
-    return (_jsxs("div", { "data-testid": "conversation-message-list", className: "relative flex min-h-0 min-w-0 flex-1 flex-col overflow-x-hidden bg-white", children: [isMessageLoading ? (_jsx("div", { className: "flex flex-1 items-center justify-center py-12", children: _jsx(Spin, {}) })) : (_jsxs(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableConversationMessagesDiv", loadState: loadState, moreOldLoading: moreOldLoading, onLoadMoreOld: loadMoreOldMessage, onScroll: handleInfiniteScroll, containerClassName: "h-full", empty: _jsx("div", { className: "flex flex-1 items-center justify-center py-12", children: _jsx(Empty, { description: t("empty.no_messages") }) }), children: [bottomSlot, loadState.messageList.map((message, index, array) => (_jsx(MessageItem, { message: message, allMessages: array, isGroupChat: isGroupChat, forceHideTip: index === 0 && !!bottomSlot, contextMenuOpen: openToolboxMessageId === message.clientMsgID, onContextMenuOpenChange: (open) => setOpenToolboxMessageId(open ? message.clientMsgID : null), onQuoteMessage: setQuotedMessage, onRevokeMessage: handleRevokeMessage, onPressQuoteMessage: onPressQuoteMessage, onPinMessage: handlePinMessage, onUnpinMessage: handleUnpinMessage, enableLongPress: true }, message.clientMsgID)))] })), _jsx(PinLimitModal, { open: pinLimitModalOpen, max: pinnedTotalCount, onClose: () => setPinLimitModalOpen(false) })] }));
-};
-export default ConversationMessageList;

package/dist/src/components/conversation-detail/ConversationMoreOptionItem.d.ts

@@ -1,8 +0,0 @@
-import type { MoreOptionConfig } from "../../constants/moreOption";
-export interface ConversationMoreOptionItemProps {
-    option: MoreOptionConfig;
-    onSelect: (option: MoreOptionConfig) => void;
-}
-declare const ConversationMoreOptionItem: ({ option, onSelect }: ConversationMoreOptionItemProps) => import("react/jsx-runtime").JSX.Element;
-export default ConversationMoreOptionItem;
-//# sourceMappingURL=ConversationMoreOptionItem.d.ts.map

package/dist/src/components/conversation-detail/ConversationMoreOptionItem.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ConversationMoreOptionItem.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/ConversationMoreOptionItem.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAI/D,MAAM,WAAW,+BAA+B;IAC9C,MAAM,EAAE,gBAAgB,CAAC;IACzB,QAAQ,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAC9C;AAED,QAAA,MAAM,0BAA0B,GAAI,sBAAsB,+BAA+B,4CA+BxF,CAAC;AAEF,eAAe,0BAA0B,CAAC"}

package/dist/src/components/conversation-detail/ConversationMoreOptionItem.js

@@ -1,19 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
-import { useTranslation } from "react-i18next";
-import { Icon } from "../../components/icon";
-const ICON_SIZE = 24;
-const ConversationMoreOptionItem = ({ option, onSelect }) => {
-    const { t } = useTranslation("conversation-inbox");
-    const label = t(option.labelKey);
-    const handleClick = () => {
-        if (!option.enabled)
-            return;
-        onSelect(option);
-    };
-    return (_jsxs("button", { type: "button", onClick: handleClick, disabled: !option.enabled, "aria-label": label, "data-testid": `more-option-${option.labelKey}`, className: clsx("flex flex-col items-center gap-1 rounded-xl px-1 transition-colors", option.enabled
-            ? "active:bg-chat-bubble-neutral/[0.08]"
-            : "cursor-not-allowed opacity-40"), children: [_jsx("span", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-gray-200/10", children: _jsx(Icon, { icon: option.icon, size: ICON_SIZE, className: "text-gray-900" }) }), _jsx("span", { className: "line-clamp-2 text-center text-[12px] leading-[1.4] text-gray-900", children: label })] }));
-};
-export default ConversationMoreOptionItem;

package/dist/src/components/conversation-detail/ConversationMoreOptionPanel.d.ts

@@ -1,11 +0,0 @@
-import { MoreOptionConfig } from "../../constants/moreOption";
-export interface ConversationMoreOptionPanelProps {
-    disabled?: boolean;
-    options?: MoreOptionConfig[];
-    onSelectOption?: (option: MoreOptionConfig) => void;
-    onTriggerMediaInput?: () => void;
-    onTriggerDocumentInput?: () => void;
-}
-declare const ConversationMoreOptionPanel: ({ disabled, options, onSelectOption, onTriggerMediaInput, onTriggerDocumentInput, }: ConversationMoreOptionPanelProps) => import("react/jsx-runtime").JSX.Element;
-export default ConversationMoreOptionPanel;
-//# sourceMappingURL=ConversationMoreOptionPanel.d.ts.map

package/dist/src/components/conversation-detail/ConversationMoreOptionPanel.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ConversationMoreOptionPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/ConversationMoreOptionPanel.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,gBAAgB,EAEjB,MAAM,wBAAwB,CAAC;AAGhC,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC7B,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACpD,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IACjC,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;CACrC;AAED,QAAA,MAAM,2BAA2B,GAAI,qFAMlC,gCAAgC,4CAkClC,CAAC;AAEF,eAAe,2BAA2B,CAAC"}

package/dist/src/components/conversation-detail/ConversationMoreOptionPanel.js

@@ -1,24 +0,0 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback } from "react";
-import { MORE_OPTIONS, MoreOptionKey, } from "../../constants/moreOption";
-import ConversationMoreOptionItem from "./ConversationMoreOptionItem";
-const ConversationMoreOptionPanel = ({ disabled = false, options = MORE_OPTIONS, onSelectOption, onTriggerMediaInput, onTriggerDocumentInput, }) => {
-    const handleSelectOption = useCallback((option) => {
-        if (option.key === MoreOptionKey.Media) {
-            onTriggerMediaInput === null || onTriggerMediaInput === void 0 ? void 0 : onTriggerMediaInput();
-            return;
-        }
-        if (option.key === MoreOptionKey.Document) {
-            onTriggerDocumentInput === null || onTriggerDocumentInput === void 0 ? void 0 : onTriggerDocumentInput();
-            return;
-        }
-        if (option.onSelect) {
-            option.onSelect();
-            return;
-        }
-        onSelectOption === null || onSelectOption === void 0 ? void 0 : onSelectOption(option);
-    }, [onSelectOption, onTriggerMediaInput, onTriggerDocumentInput]);
-    return (_jsx("div", { "data-testid": "conversation-more-option-panel", className: "grid grid-cols-4 gap-y-5 bg-white py-5", children: options.map((option) => (_jsx(ConversationMoreOptionItem, { option: Object.assign(Object.assign({}, option), { enabled: option.enabled && !disabled }), onSelect: handleSelectOption }, option.key))) }));
-};
-export default ConversationMoreOptionPanel;

package/dist/src/components/conversation-detail/PinLimitModal.d.ts

@@ -1,8 +0,0 @@
-interface PinLimitModalProps {
-    open: boolean;
-    max: number;
-    onClose: () => void;
-}
-declare const PinLimitModal: ({ open, max, onClose }: PinLimitModalProps) => import("react/jsx-runtime").JSX.Element;
-export default PinLimitModal;
-//# sourceMappingURL=PinLimitModal.d.ts.map

package/dist/src/components/conversation-detail/PinLimitModal.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"PinLimitModal.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/PinLimitModal.tsx"],"names":[],"mappings":"AAGA,UAAU,kBAAkB;IAC1B,IAAI,EAAE,OAAO,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,aAAa,GAAI,wBAAwB,kBAAkB,4CAkChE,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/src/components/conversation-detail/PinLimitModal.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Modal, Button } from "antd";
-import { useTranslation } from "react-i18next";
-const PinLimitModal = ({ open, max, onClose }) => {
-    const { t } = useTranslation();
-    return (_jsx(Modal, { open: open, onCancel: onClose, footer: null, centered: true, width: 400, children: _jsxs("div", { className: "flex flex-col gap-2 pt-2", role: "alertdialog", "aria-label": t("pin_limit_modal_title"), children: [_jsx("p", { className: "text-lg font-semibold text-gray-900", children: t("pin_limit_modal_title") }), _jsx("p", { className: "text-base text-gray-600", children: t("pin_limit_modal_description", { max }) }), _jsx(Button, { type: "primary", size: "large", block: true, className: "mt-2 !border-primary-400 !bg-primary-400 !text-white hover:!border-primary-300 hover:!bg-primary-300", onClick: onClose, children: t("pin_limit_modal_confirm") })] }) }));
-};
-export default PinLimitModal;

package/dist/src/components/conversation-detail/PinnedMessageBar.d.ts

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

package/dist/src/components/conversation-detail/PinnedMessageBar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"PinnedMessageBar.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/PinnedMessageBar.tsx"],"names":[],"mappings":"AAgHA,QAAA,MAAM,gBAAgB,sDAyFrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/src/components/conversation-detail/PinnedMessageBar.js

@@ -1,102 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from "react";
-import clsx from "clsx";
-import { useTranslation } from "react-i18next";
-import { MessageType } from "@openim/wasm-client-sdk";
-import { Icon } from "../../components/icon";
-import { documentIcon } from "../../assets/svg";
-import useAuthStore from "../../store/auth";
-import useConversationStore from "../../store/conversation";
-import { usePinnedMessages } from "../../hooks/message/usePinnedMessages";
-import { parseUrlMetadata } from "../../utils/common";
-import PinnedMessagesPanel from "./PinnedMessagesPanel";
-const PINNED_SUBTITLE_KEY_BY_TYPE = {
-    [MessageType.UrlTextMessage]: "pinned_from_link",
-    [MessageType.PictureMessage]: "pinned_from_image",
-    [MessageType.MergeMessage]: "pinned_from_image",
-    [MessageType.VideoMessage]: "pinned_from_video",
-    [MessageType.FileMessage]: "pinned_from_file",
-};
-const TITLE_LESS_MESSAGE_TYPES = [
-    MessageType.PictureMessage,
-    MessageType.MergeMessage,
-    MessageType.VideoMessage,
-];
-const getPinnedMessageTitle = (message) => {
-    var _a, _b, _c, _d, _e;
-    switch (message.contentType) {
-        case MessageType.UrlTextMessage: {
-            const urlMetadata = parseUrlMetadata(message.ex);
-            return ((urlMetadata === null || urlMetadata === void 0 ? void 0 : urlMetadata.title) ||
-                ((_a = message.urlTextElem) === null || _a === void 0 ? void 0 : _a.content) ||
-                ((_b = message.textElem) === null || _b === void 0 ? void 0 : _b.content) ||
-                "");
-        }
-        case MessageType.FileMessage:
-            return ((_c = message.fileElem) === null || _c === void 0 ? void 0 : _c.fileName) || "";
-        default:
-            return ((_d = message.textElem) === null || _d === void 0 ? void 0 : _d.content) || ((_e = message.quoteElem) === null || _e === void 0 ? void 0 : _e.text) || "";
-    }
-};
-const PinnedMessageThumbnail = ({ message }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-    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 ||
-        message.contentType === MessageType.MergeMessage) {
-        const firstSubMessage = (_b = (_a = message.mergeElem) === null || _a === void 0 ? void 0 : _a.multiMessage) === null || _b === void 0 ? void 0 : _b[0];
-        const imageUrl = ((_d = (_c = firstSubMessage === null || firstSubMessage === void 0 ? void 0 : firstSubMessage.pictureElem) === null || _c === void 0 ? void 0 : _c.snapshotPicture) === null || _d === void 0 ? void 0 : _d.url) ||
-            ((_f = (_e = firstSubMessage === null || firstSubMessage === void 0 ? void 0 : firstSubMessage.pictureElem) === null || _e === void 0 ? void 0 : _e.sourcePicture) === null || _f === void 0 ? void 0 : _f.url) ||
-            ((_h = (_g = message.pictureElem) === null || _g === void 0 ? void 0 : _g.snapshotPicture) === null || _h === void 0 ? void 0 : _h.url) ||
-            ((_k = (_j = message.pictureElem) === null || _j === void 0 ? void 0 : _j.sourcePicture) === null || _k === void 0 ? void 0 : _k.url);
-        if (!imageUrl)
-            return null;
-        return (_jsx("img", { src: imageUrl, alt: "", className: "h-[51px] w-[51px] shrink-0 object-cover" }));
-    }
-    if (message.contentType === MessageType.VideoMessage) {
-        const posterUrl = (_l = message.videoElem) === null || _l === void 0 ? void 0 : _l.snapshotUrl;
-        return (_jsxs("div", { className: "relative h-[51px] w-[51px] shrink-0 overflow-hidden 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 = (_m = parseUrlMetadata(message.ex)) === null || _m === void 0 ? void 0 : _m.image;
-        if (!imageUrl) {
-            return (_jsx("div", { className: "flex h-[51px] w-[51px] shrink-0 items-center justify-center", children: _jsx(Icon, { icon: "link-alt-o", size: 24, className: "text-primary-400" }) }));
-        }
-        return (_jsx("img", { src: imageUrl, alt: "", className: "h-[51px] w-[51px] shrink-0 object-cover" }));
-    }
-    return null;
-};
-const PinnedMessageBar = () => {
-    const { t } = useTranslation();
-    const userID = useAuthStore((state) => state.userID);
-    const conversation = useConversationStore((state) => state.conversationData);
-    const selectedConversationId = useConversationStore((state) => state.selectedConversationId);
-    const conversationId = selectedConversationId || (conversation === null || conversation === void 0 ? void 0 : conversation.conversationID) || "";
-    const { pinnedMessageList, pinnedTotalCount } = usePinnedMessages(conversationId);
-    const [isPanelOpen, setIsPanelOpen] = useState(false);
-    const latestPinnedMessage = pinnedMessageList[0];
-    if (!latestPinnedMessage)
-        return null;
-    const isMe = latestPinnedMessage.sendID === userID;
-    const senderName = isMe
-        ? t("your_self")
-        : latestPinnedMessage.senderNickname || t("message_sender_unnamed");
-    const isRevoked = latestPinnedMessage.contentType === MessageType.RevokeMessage;
-    const subtitleKey = PINNED_SUBTITLE_KEY_BY_TYPE[latestPinnedMessage.contentType] ||
-        "pinned_from_text";
-    const title = isRevoked
-        ? t("revoked")
-        : getPinnedMessageTitle(latestPinnedMessage);
-    const showTitle = !TITLE_LESS_MESSAGE_TYPES.includes(latestPinnedMessage.contentType) &&
-        Boolean(title);
-    const hasThumbnail = !isRevoked &&
-        latestPinnedMessage.contentType !== MessageType.TextMessage &&
-        latestPinnedMessage.contentType !== MessageType.QuoteMessage;
-    const hasFlushThumbnail = hasThumbnail &&
-        latestPinnedMessage.contentType !== MessageType.FileMessage;
-    const remainingPinnedCount = pinnedTotalCount - 1;
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { "data-testid": "pinned-message-bar", role: "button", tabIndex: 0, onClick: () => setIsPanelOpen(true), className: clsx("flex w-full shrink-0 cursor-pointer items-center gap-3 bg-gray-cool-25 pr-3", hasFlushThumbnail ? "py-0 pl-0" : "py-1 pl-3"), children: [hasThumbnail && (_jsx(PinnedMessageThumbnail, { message: latestPinnedMessage })), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center", children: [showTitle && (_jsx("p", { className: "truncate text-sm font-medium leading-[160%] text-gray-900", children: title })), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Icon, { icon: "thumbtack-b", size: 12, className: "text-primary-400" }), _jsx("p", { className: "truncate text-[13px] leading-[160%] text-gray-600", children: t(subtitleKey, { name: senderName }) })] })] }), _jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [remainingPinnedCount > 0 && (_jsxs("span", { className: "flex min-w-[26px] items-center justify-center rounded-full border-2 border-white bg-gradient-danger-light px-1 text-xs font-bold leading-[160%] text-white", children: ["+", remainingPinnedCount] })), _jsx(Icon, { icon: "angle-down-o", size: 20, className: "text-gray-600" })] })] }), _jsx(PinnedMessagesPanel, { open: isPanelOpen, onClose: () => setIsPanelOpen(false) })] }));
-};
-export default PinnedMessageBar;