@droppii-org/chat-sdk 0.3.8 → 0.4.0

package/dist/components/conversation-detail/bot/BotInactiveNotice.js

@@ -5,6 +5,6 @@ import { Icon } from "../../../components/icon";
 const ICON_SIZE = 16;
 const BotInactiveNotice = () => {
     const { t } = useTranslation("conversation-inbox");
-    return (_jsxs("div", { "data-testid": "conversation-bot-inactive-notice", className: "flex w-full items-center justify-center gap-1 bg-white px-4 py-1", children: [_jsx(Icon, { icon: "info-circle-o", size: ICON_SIZE, className: "shrink-0 text-gray-900" }), _jsx("span", { className: "text-[12px] font-normal leading-[1.6] text-gray-900", children: t("thread_detail.bot.inactive_notice") })] }));
+    return (_jsxs("div", { "data-testid": "conversation-bot-inactive-notice", "data-cp-name": "BotInactiveNotice", className: "flex w-full items-center justify-center gap-1 bg-white px-4 py-1", children: [_jsx(Icon, { icon: "info-circle-o", size: ICON_SIZE, className: "shrink-0 text-gray-900" }), _jsx("span", { className: "text-[12px] font-normal leading-[1.6] text-gray-900", children: t("thread_detail.bot.inactive_notice") })] }));
 };
 export default BotInactiveNotice;

package/dist/components/conversation-detail/bot/BotMenuSheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BotMenuSheet.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/bot/BotMenuSheet.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAI5D,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;CAC3C;AAED,QAAA,MAAM,YAAY,GAAI,+CAMnB,iBAAiB,4CAiEnB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"BotMenuSheet.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/bot/BotMenuSheet.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAI5D,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;CAC3C;AAED,QAAA,MAAM,YAAY,GAAI,+CAMnB,iBAAiB,4CAkEnB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/conversation-detail/bot/BotMenuSheet.js

@@ -13,7 +13,7 @@ const BotMenuSheet = ({ open, items, disabled, onClose, onSelect, }) => {
         onSelect(item);
         onClose();
     };
-    return (_jsx(Drawer, { open: open, onClose: onClose, placement: "bottom", closeIcon: false, height: "auto", styles: {
+    return (_jsx(Drawer, { open: open, onClose: onClose, placement: "bottom", closeIcon: false, height: "auto", "data-cp-name": "BotMenuSheet", styles: {
             body: { padding: "16px 16px 32px" },
             mask: { backgroundColor: "rgba(0, 0, 0, 0.8)" },
             content: { background: "transparent", boxShadow: "none" },

package/dist/components/conversation-detail/bot/BotStartButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BotStartButton.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/bot/BotStartButton.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,cAAc,GAAI,8BAA8B,mBAAmB,4CAkBxE,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"BotStartButton.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/bot/BotStartButton.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,cAAc,GAAI,8BAA8B,mBAAmB,4CAmBxE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/conversation-detail/bot/BotStartButton.js

@@ -4,7 +4,7 @@ import clsx from "clsx";
 import { Icon } from "../../../components/icon";
 const ICON_SIZE = 20;
 const BotStartButton = ({ label, onClick, disabled }) => {
-    return (_jsxs("button", { type: "button", onClick: onClick, disabled: disabled, className: clsx("flex h-12 w-full items-center justify-center gap-2 rounded-lg", "text-[16px] font-medium leading-[1.6] text-white transition-colors", disabled
+    return (_jsxs("button", { type: "button", onClick: onClick, disabled: disabled, "data-cp-name": "BotStartButton", className: clsx("flex h-12 w-full items-center justify-center gap-2 rounded-lg", "text-[16px] font-medium leading-[1.6] text-white transition-colors", disabled
             ? "cursor-not-allowed bg-primary-400/60"
             : "bg-primary-400 active:bg-primary-400/90"), children: [_jsx(Icon, { icon: "chat-square-o", size: ICON_SIZE, className: "text-white" }), _jsx("span", { children: label })] }));
 };

package/dist/components/conversation-detail/bot/BotSuggest.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BotSuggest.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/bot/BotSuggest.tsx"],"names":[],"mappings":"AAiCA,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,QAAA,MAAM,UAAU,GAAI,oEAMjB,eAAe,mDA6BjB,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"BotSuggest.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/bot/BotSuggest.tsx"],"names":[],"mappings":"AAkCA,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,QAAA,MAAM,UAAU,GAAI,oEAMjB,eAAe,mDA8BjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/conversation-detail/bot/BotSuggest.js

@@ -4,11 +4,11 @@ import clsx from "clsx";
 import { useTranslation } from "react-i18next";
 import { Icon } from "../../../components/icon";
 const CHIP_ICON_SIZE = 14;
-const SuggestChip = ({ disabled, icon, label, testId, onClick }) => (_jsxs("button", { type: "button", disabled: disabled, onClick: onClick, "data-testid": testId, className: clsx("flex h-7 shrink-0 items-center gap-1 rounded-lg bg-gray-25 px-3", "text-[12px] font-[510] leading-[1.6] tracking-[0.12px] text-gray-900 transition-colors", disabled && "cursor-not-allowed opacity-60"), children: [icon && _jsx(Icon, { icon: icon, size: CHIP_ICON_SIZE, className: "text-gray-900" }), _jsx("span", { className: "whitespace-nowrap", children: label })] }));
+const SuggestChip = ({ disabled, icon, label, testId, onClick }) => (_jsxs("button", { type: "button", disabled: disabled, onClick: onClick, "data-testid": testId, "data-cp-name": "SuggestChip", className: clsx("flex h-7 shrink-0 items-center gap-1 rounded-lg bg-gray-25 px-3", "text-[12px] font-[510] leading-[1.6] tracking-[0.12px] text-gray-900 transition-colors", disabled && "cursor-not-allowed opacity-60"), children: [icon && _jsx(Icon, { icon: icon, size: CHIP_ICON_SIZE, className: "text-gray-900" }), _jsx("span", { className: "whitespace-nowrap", children: label })] }));
 const BotSuggest = ({ disabled, showRestart = true, showMenuTrigger = true, onRestart, onOpenMenu, }) => {
     const { t } = useTranslation("conversation-inbox");
     if (!showRestart && !showMenuTrigger)
         return null;
-    return (_jsxs("div", { "data-testid": "conversation-bot-suggest", className: "flex w-full items-center gap-2 overflow-x-auto bg-chat-bubble-neutral/[0.05] px-2 pt-2", children: [showRestart && (_jsx(SuggestChip, { disabled: disabled, icon: "arrow-reload-o", label: t("thread_detail.bot.restart"), onClick: onRestart })), showMenuTrigger && (_jsx(SuggestChip, { disabled: disabled, label: t("thread_detail.bot.menu.trigger"), testId: "conversation-bot-suggest-menu-trigger", onClick: onOpenMenu }))] }));
+    return (_jsxs("div", { "data-testid": "conversation-bot-suggest", "data-cp-name": "BotSuggest", className: "flex w-full items-center gap-2 overflow-x-auto bg-chat-bubble-neutral/[0.05] px-2 pt-2", children: [showRestart && (_jsx(SuggestChip, { disabled: disabled, icon: "arrow-reload-o", label: t("thread_detail.bot.restart"), onClick: onRestart })), showMenuTrigger && (_jsx(SuggestChip, { disabled: disabled, label: t("thread_detail.bot.menu.trigger"), testId: "conversation-bot-suggest-menu-trigger", onClick: onOpenMenu }))] }));
 };
 export default BotSuggest;

package/dist/components/conversation-detail/bot/CsSessionConfirmModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CsSessionConfirmModal.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/bot/CsSessionConfirmModal.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,QAAA,MAAM,qBAAqB,GAAI,yCAK5B,0BAA0B,4CA2D5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"CsSessionConfirmModal.d.ts","sourceRoot":"","sources":["../../../../src/components/conversation-detail/bot/CsSessionConfirmModal.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,QAAA,MAAM,qBAAqB,GAAI,yCAK5B,0BAA0B,4CA4D5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/conversation-detail/bot/CsSessionConfirmModal.js

@@ -4,7 +4,7 @@ import { Modal, Button } from "antd";
 import { Trans, useTranslation } from "react-i18next";
 const CsSessionConfirmModal = ({ open, loading, onCancel, onConfirm, }) => {
     const { t } = useTranslation("conversation-inbox");
-    return (_jsx(Modal, { open: open, onCancel: onCancel, footer: null, closable: false, centered: true, forceRender: true, width: 400, maskClosable: !loading, keyboard: !loading, styles: {
+    return (_jsx(Modal, { open: open, onCancel: onCancel, footer: null, closable: false, centered: true, "data-cp-name": "CsSessionConfirmModal", forceRender: true, width: 400, maskClosable: !loading, keyboard: !loading, styles: {
             content: { padding: 0, overflow: "hidden" },
             body: { padding: 0 },
         }, children: _jsxs("div", { role: "alertdialog", "aria-label": t("thread_detail.bot.cs_confirm.title"), className: "flex flex-col", children: [_jsx("div", { className: "border-b border-gray-25 p-4", children: _jsx("p", { className: "text-[18px] font-bold leading-[1.6] text-center text-gray-900", children: t("thread_detail.bot.cs_confirm.title") }) }), _jsx("p", { className: "p-4 text-[16px] leading-[1.6] text-gray-900", children: _jsx(Trans, { t: t, i18nKey: "thread_detail.bot.cs_confirm.body", components: { bold: _jsx("strong", { className: "font-bold" }) } }) }), _jsx("div", { className: "border-t border-gray-25" }), _jsxs("div", { className: "flex gap-2 p-4", children: [_jsx(Button, { className: "h-12 flex-1 !rounded-lg !border-gray-25 !bg-gray-25 !text-[16px] !font-medium !text-gray-900", onClick: onCancel, disabled: loading, children: t("thread_detail.bot.cs_confirm.cancel") }), _jsx(Button, { type: "primary", className: "h-12 flex-1 !rounded-lg !border-danger-400 !bg-danger-400 !text-[16px] !font-medium !text-white hover:!border-danger-300 hover:!bg-danger-300", onClick: onConfirm, loading: loading, children: t("thread_detail.bot.cs_confirm.confirm") })] })] }) }));

package/dist/components/conversation-inbox/ConversationInboxHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationInboxHeader.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxHeader.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,uBAAuB,+CAkB5B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"ConversationInboxHeader.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxHeader.tsx"],"names":[],"mappings":"AAIA,QAAA,MAAM,uBAAuB,+CAmB5B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/dist/components/conversation-inbox/ConversationInboxHeader.js

@@ -3,6 +3,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
 const ConversationInboxHeader = () => {
     const { t } = useTranslation("conversation-inbox");
-    return (_jsx("div", { "data-testid": "conversation-inbox-header", className: "flex w-full flex-col border-b border-gray-100 bg-white", children: _jsx("div", { className: "flex h-12 items-end px-3", children: _jsxs("div", { className: "flex h-full flex-col items-center justify-end px-3", children: [_jsx("span", { className: "pb-1.5 text-center text-[16px] font-bold leading-[160%] tracking-[0.16px] text-primary-400", children: t("tabs.messages") }), _jsx("span", { className: "h-[3px] w-full rounded-t bg-primary-400" })] }) }) }));
+    return (_jsx("div", { "data-testid": "conversation-inbox-header", "data-cp-name": "ConversationInboxHeader", className: "flex w-full flex-col border-b border-gray-100 bg-white", children: _jsx("div", { className: "flex h-12 items-end px-3", children: _jsxs("div", { className: "flex h-full flex-col items-center justify-end px-3", children: [_jsx("span", { className: "pb-1.5 text-center text-[16px] font-bold leading-[160%] tracking-[0.16px] text-primary-400", children: t("tabs.messages") }), _jsx("span", { className: "h-[3px] w-full rounded-t bg-primary-400" })] }) }) }));
 };
 export default ConversationInboxHeader;

package/dist/components/conversation-inbox/ConversationInboxItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationInboxItem.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxItem.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAkBjE,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,oBAAoB,CAAC;IAC3B,OAAO,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CAC/C;AAQD,QAAA,MAAM,qBAAqB,GAAI,mBAAmB,0BAA0B,4CA4E3E,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"ConversationInboxItem.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxItem.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAmBjE,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,oBAAoB,CAAC;IAC3B,OAAO,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CAC/C;AAQD,QAAA,MAAM,qBAAqB,GAAI,mBAAmB,0BAA0B,4CA+E3E,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/conversation-inbox/ConversationInboxItem.js

@@ -9,6 +9,7 @@ import { useConversationAvatarUrl } from "../../hooks/conversation/useConversati
 import { useIsJoinedGroup } from "../../hooks/session/useIsJoinedGroup";
 import { isConversationMuted } from "../../hooks/session/useMuteConversation";
 import ThreadCard from "../../components/conversation/ThreadCard";
+import MentionIndicatorIcon from "../../components/conversation/MentionIndicatorIcon";
 import SwipeableRow from "../../components/conversation/SwipeableRow";
 import { SWIPE_ACTION_WIDTH } from "../../components/conversation/SwipeActionButton";
 import { Icon } from "../../components/icon";
@@ -35,7 +36,7 @@ const ConversationInboxItem = ({ item, onClick }) => {
     const isMuted = isConversationMuted(item.recvMsgOpt);
     const { isJoined } = useIsJoinedGroup(item.groupID);
     const hasLostGroupAccess = Boolean(item.groupID) && isJoined !== true;
-    const threadCard = (_jsx(ThreadCard, { testId: "conversation-inbox-thread-card", onClick: () => onClick(item), unreadCount: unreadCount, time: latestMessageTime, preview: latestMessagePreview, muteIndicator: isMuted ? (_jsx(Icon, { icon: "bell-off-b", size: 16, "aria-label": t("thread_card.mute.muted_icon_label"), className: "shrink-0 text-gray-400" })) : null, avatar: _jsx(ConversationPeerAvatar, { peerType: item.peerType, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), title: _jsx(ConversationInboxTitle, { peerType: item.peerType, displayName: displayName, hasUnread: unreadCount > 0 }) }));
+    const threadCard = (_jsx(ThreadCard, { testId: "conversation-inbox-thread-card", onClick: () => onClick(item), unreadCount: unreadCount, time: latestMessageTime, preview: latestMessagePreview, mentionIndicator: _jsx(MentionIndicatorIcon, { groupAtType: item.groupAtType }), muteIndicator: isMuted ? (_jsx(Icon, { icon: "bell-off-b", size: 16, "aria-label": t("thread_card.mute.muted_icon_label"), className: "shrink-0 text-gray-400" })) : null, avatar: _jsx(ConversationPeerAvatar, { peerType: item.peerType, displayName: displayName, avatarUrl: avatarUrl, badgeLabel: badgeLabel }), title: _jsx(ConversationInboxTitle, { peerType: item.peerType, displayName: displayName, hasUnread: unreadCount > 0 }) }));
     if (hasLostGroupAccess) {
         return threadCard;
     }

package/dist/components/conversation-inbox/ConversationInboxList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationInboxList.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxList.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAMjE,MAAM,WAAW,0BAA0B;IACzC,KAAK,EAAE,oBAAoB,EAAE,CAAC;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACvD;AAYD,QAAA,MAAM,qBAAqB,GAAI,oFAO5B,0BAA0B,4CA+E5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"ConversationInboxList.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxList.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAMjE,MAAM,WAAW,0BAA0B;IACzC,KAAK,EAAE,oBAAoB,EAAE,CAAC;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;CACvD;AAYD,QAAA,MAAM,qBAAqB,GAAI,oFAO5B,0BAA0B,4CAgF5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/conversation-inbox/ConversationInboxList.js

@@ -32,6 +32,6 @@ const ConversationInboxList = ({ items, isLoading, isFetchingNextPage, hasNextPa
     if (isLoading) {
         return (_jsx("div", { "data-testid": "conversation-inbox-thread-list", className: "flex flex-1 items-center justify-center py-12", children: _jsx(Spin, {}) }));
     }
-    return (_jsx("div", { id: "scrollableConversationThreadsDiv", "data-testid": "conversation-inbox-thread-list", className: "min-h-0 w-full flex-1 overflow-auto", children: _jsx(InfiniteScroll, { dataLength: items.length, next: handleEndReached, hasMore: hasNextPage, loader: isFetchingNextPage ? _jsx(FooterSkeleton, {}) : null, scrollableTarget: "scrollableConversationThreadsDiv", children: items.length === 0 ? (_jsx("div", { className: "flex items-center justify-center py-12", children: _jsx(Empty, { image: _jsx(Icon, { icon: "chat-square-b", size: 80, className: "text-gray-300" }), description: t("empty.no_conversations") }) })) : (items.map((item) => (_jsx(ConversationInboxItem, { item: item, onClick: handleSelectThread }, item.conversationID)))) }) }));
+    return (_jsx("div", { id: "scrollableConversationThreadsDiv", "data-testid": "conversation-inbox-thread-list", "data-cp-name": "ConversationInboxList", className: "min-h-0 w-full flex-1 overflow-auto", children: _jsx(InfiniteScroll, { dataLength: items.length, next: handleEndReached, hasMore: hasNextPage, loader: isFetchingNextPage ? _jsx(FooterSkeleton, {}) : null, scrollableTarget: "scrollableConversationThreadsDiv", children: items.length === 0 ? (_jsx("div", { className: "flex items-center justify-center py-12", children: _jsx(Empty, { image: _jsx(Icon, { icon: "chat-square-b", size: 80, className: "text-gray-300" }), description: t("empty.no_conversations") }) })) : (items.map((item) => (_jsx(ConversationInboxItem, { item: item, onClick: handleSelectThread }, item.conversationID)))) }) }));
 };
 export default ConversationInboxList;

package/dist/components/conversation-inbox/ConversationInboxTitle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationInboxTitle.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxTitle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAEhD,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,QAAQ,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,sBAAsB,GAAI,uCAI7B,2BAA2B,4CAmB7B,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"ConversationInboxTitle.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationInboxTitle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAEhD,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,QAAQ,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,sBAAsB,GAAI,uCAI7B,2BAA2B,4CAsB7B,CAAC;AAEF,eAAe,sBAAsB,CAAC"}

package/dist/components/conversation-inbox/ConversationInboxTitle.js

@@ -3,5 +3,5 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
 import { Icon } from "../../components/icon";
 import { PeerType } from "../../types/conversation";
-const ConversationInboxTitle = ({ peerType, displayName, hasUnread = false, }) => (_jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [peerType === PeerType.GROUP && (_jsx(Icon, { icon: "user-two-b", size: 12, className: "shrink-0 text-black" })), peerType === PeerType.BOT && (_jsx("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center rounded-full bg-black text-white", children: _jsx(Icon, { icon: "droppii-b", size: 8 }) })), _jsx("span", { className: clsx("min-w-0 truncate text-[16px] leading-[160%] text-black [font-feature-settings:'liga'_off,'clig'_off]", hasUnread ? "font-bold tracking-[0.16px]" : "font-[510]"), children: displayName })] }));
+const ConversationInboxTitle = ({ peerType, displayName, hasUnread = false, }) => (_jsxs("div", { className: "flex min-w-0 items-center gap-1", "data-cp-name": "ConversationInboxTitle", children: [peerType === PeerType.GROUP && (_jsx(Icon, { icon: "user-two-b", size: 12, className: "shrink-0 text-black" })), peerType === PeerType.BOT && (_jsx("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center rounded-full bg-black text-white", children: _jsx(Icon, { icon: "droppii-b", size: 8 }) })), _jsx("span", { className: clsx("min-w-0 truncate text-[16px] leading-[160%] text-black [font-feature-settings:'liga'_off,'clig'_off]", hasUnread ? "font-bold tracking-[0.16px]" : "font-[510]"), children: displayName })] }));
 export default ConversationInboxTitle;

package/dist/components/conversation-inbox/ConversationPeerAvatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationPeerAvatar.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationPeerAvatar.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGhD,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,QAAQ,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,sBAAsB,GAAI,mDAK7B,2BAA2B,4CAyB7B,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"ConversationPeerAvatar.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/ConversationPeerAvatar.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGhD,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,QAAQ,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,sBAAsB,GAAI,mDAK7B,2BAA2B,4CA4B7B,CAAC;AAEF,eAAe,sBAAsB,CAAC"}

package/dist/components/conversation-inbox/ConversationPeerAvatar.js

@@ -5,6 +5,6 @@ import { Avatar } from "antd";
 import { resolvePeerBadgeColor } from "../../utils/conversation";
 const ConversationPeerAvatar = ({ peerType, displayName, avatarUrl, badgeLabel, }) => {
     const badge = badgeLabel ? (_jsx("span", { className: clsx("absolute -bottom-px -right-px flex h-[17px] items-center justify-center gap-2 rounded-md border border-white px-1 text-[10px] font-semibold leading-3 text-white shadow-badge-inset", resolvePeerBadgeColor(peerType)), children: badgeLabel })) : null;
-    return (_jsxs("div", { className: "relative h-12 w-12 shrink-0", children: [_jsx(Avatar, { size: 48, src: avatarUrl || undefined, alt: displayName, className: "uppercase", children: (displayName === null || displayName === void 0 ? void 0 : displayName.charAt(0)) || "A" }), badge] }));
+    return (_jsxs("div", { className: "relative h-12 w-12 shrink-0", "data-cp-name": "ConversationPeerAvatar", children: [_jsx(Avatar, { size: 48, src: avatarUrl || undefined, alt: displayName, className: "uppercase", children: (displayName === null || displayName === void 0 ? void 0 : displayName.charAt(0)) || "A" }), badge] }));
 };
 export default ConversationPeerAvatar;

package/dist/components/conversation-inbox/MuteConversationConfirmModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MuteConversationConfirmModal.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/MuteConversationConfirmModal.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,iCAAiC;IAChD,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,QAAA,MAAM,4BAA4B,GAAI,yCAKnC,iCAAiC,4CAmEnC,CAAC;AAEF,eAAe,4BAA4B,CAAC"}
+{"version":3,"file":"MuteConversationConfirmModal.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-inbox/MuteConversationConfirmModal.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,iCAAiC;IAChD,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,QAAA,MAAM,4BAA4B,GAAI,yCAKnC,iCAAiC,4CAoEnC,CAAC;AAEF,eAAe,4BAA4B,CAAC"}

package/dist/components/conversation-inbox/MuteConversationConfirmModal.js

@@ -5,7 +5,7 @@ import { Trans, useTranslation } from "react-i18next";
 import { images } from "../../constants/images";
 const MuteConversationConfirmModal = ({ open, loading, onCancel, onConfirm, }) => {
     const { t } = useTranslation("conversation-inbox");
-    return (_jsx(Modal, { open: open, onCancel: onCancel, footer: null, closable: false, centered: true, width: 400, maskClosable: !loading, keyboard: !loading, styles: {
+    return (_jsx(Modal, { "data-cp-name": "MuteConversationConfirmModal", open: open, onCancel: onCancel, footer: null, closable: false, centered: true, width: 400, maskClosable: !loading, keyboard: !loading, styles: {
             content: { padding: 0, overflow: "hidden" },
             body: { padding: 0 },
         }, children: _jsxs("div", { role: "alertdialog", "aria-label": t("thread_card.mute.confirm_title"), className: "flex flex-col", children: [_jsx("div", { className: "border-b border-gray-25 p-4", children: _jsx("p", { className: "text-center text-[18px] font-bold leading-[1.6] text-gray-900", children: t("thread_card.mute.confirm_title") }) }), _jsx("div", { className: "flex items-center justify-center p-4", children: _jsx("img", { src: images.muteNotificationWarning, alt: "", "aria-hidden": "true", className: "h-[144px] w-[120px]" }) }), _jsx("p", { className: "px-4 pb-4 text-[16px] leading-[1.6] text-gray-900", children: _jsx(Trans, { t: t, i18nKey: "thread_card.mute.confirm_desc", components: { bold: _jsx("strong", { className: "font-bold" }) } }) }), _jsx("div", { className: "border-t border-gray-25" }), _jsxs("div", { className: "flex gap-2 p-4", children: [_jsx(Button, { className: "h-12 flex-1 !rounded-lg !border-gray-25 !bg-gray-25 !text-[16px] !font-medium !text-gray-900", onClick: onCancel, disabled: loading, children: t("thread_card.mute.confirm_secondary") }), _jsx(Button, { type: "primary", className: "h-12 flex-1 !rounded-lg !border-primary-400 !bg-primary-400 !text-[16px] !font-medium !text-white hover:!border-primary-300 hover:!bg-primary-300", onClick: onConfirm, loading: loading, children: t("thread_card.mute.confirm_primary") })] })] }) }));

package/dist/components/group/AddMemberModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AddMemberModal.d.ts","sourceRoot":"","sources":["../../../src/components/group/AddMemberModal.tsx"],"names":[],"mappings":"AAaA,UAAU,mBAAmB;IAC3B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,GAAI,6BAIrB,mBAAmB,4CA4LrB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"AddMemberModal.d.ts","sourceRoot":"","sources":["../../../src/components/group/AddMemberModal.tsx"],"names":[],"mappings":"AAaA,UAAU,mBAAmB;IAC3B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,GAAI,6BAIrB,mBAAmB,4CA6LrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/group/AddMemberModal.js

@@ -61,7 +61,7 @@ const AddMemberModal = ({ open, groupID, onClose, }) => {
             message.error(errorMessage);
         }
     };
-    return (_jsx(Modal, { centered: true, open: open, onCancel: handleClose, footer: null, title: t("add_member.title"), getContainer: false, forceRender: true, children: _jsxs("div", { className: "flex flex-col gap-3 pt-2", children: [_jsx(Input, { value: search, onChange: (event) => setSearch(event.target.value), placeholder: t("create_group.search_member_placeholder"), prefix: _jsx(Icon, { icon: "search-o", size: 16, className: "text-gray-400" }) }), _jsxs("div", { className: "flex items-center justify-between px-1", children: [_jsx("span", { className: "text-sm text-gray-500", children: t("create_group.selected_count", { count: selectedMembers.length }) }), selectedMembers.length > 0 && (_jsx("button", { type: "button", className: "text-sm text-primary-400 hover:text-primary-500 hover:underline", onClick: handleClearAll, children: t("create_group.clear_all") }))] }), selectedMembers.length > 0 && (_jsx("div", { className: "flex flex-wrap gap-2", children: selectedMembers.map((member) => (_jsxs("span", { className: "flex items-center gap-1.5 rounded-full bg-gray-100 pl-1 pr-2 py-1", children: [_jsx(Avatar, { src: member.avatar, size: 20, className: "shrink-0", children: member.displayName.charAt(0) || "A" }), _jsx("span", { className: "max-w-[120px] truncate text-sm text-gray-900", children: formatMemberLabel(member.displayName, member.username) }), _jsx(Icon, { icon: "close-b", size: 12, className: "shrink-0 cursor-pointer text-gray-400", onClick: () => handleRemoveMember(member.userID) })] }, member.userID))) })), _jsx("div", { className: "max-h-72 overflow-y-auto", onScroll: handleListScroll, children: isLoading ? (_jsx("div", { className: "flex items-center justify-center py-6", children: _jsx(Spin, {}) })) : accounts.length === 0 ? (_jsx(Empty, { description: t("create_group.no_member_found") })) : (_jsxs(_Fragment, { children: [accounts.map((account) => {
+    return (_jsx(Modal, { "data-cp-name": "AddMemberModal", centered: true, open: open, onCancel: handleClose, footer: null, title: t("add_member.title"), getContainer: false, forceRender: true, children: _jsxs("div", { className: "flex flex-col gap-3 pt-2", children: [_jsx(Input, { value: search, onChange: (event) => setSearch(event.target.value), placeholder: t("create_group.search_member_placeholder"), prefix: _jsx(Icon, { icon: "search-o", size: 16, className: "text-gray-400" }) }), _jsxs("div", { className: "flex items-center justify-between px-1", children: [_jsx("span", { className: "text-sm text-gray-500", children: t("create_group.selected_count", { count: selectedMembers.length }) }), selectedMembers.length > 0 && (_jsx("button", { type: "button", className: "text-sm text-primary-400 hover:text-primary-500 hover:underline", onClick: handleClearAll, children: t("create_group.clear_all") }))] }), selectedMembers.length > 0 && (_jsx("div", { className: "flex flex-wrap gap-2", children: selectedMembers.map((member) => (_jsxs("span", { className: "flex items-center gap-1.5 rounded-full bg-gray-100 pl-1 pr-2 py-1", children: [_jsx(Avatar, { src: member.avatar, size: 20, className: "shrink-0", children: member.displayName.charAt(0) || "A" }), _jsx("span", { className: "max-w-[120px] truncate text-sm text-gray-900", children: formatMemberLabel(member.displayName, member.username) }), _jsx(Icon, { icon: "close-b", size: 12, className: "shrink-0 cursor-pointer text-gray-400", onClick: () => handleRemoveMember(member.userID) })] }, member.userID))) })), _jsx("div", { className: "max-h-72 overflow-y-auto", onScroll: handleListScroll, children: isLoading ? (_jsx("div", { className: "flex items-center justify-center py-6", children: _jsx(Spin, {}) })) : accounts.length === 0 ? (_jsx(Empty, { description: t("create_group.no_member_found") })) : (_jsxs(_Fragment, { children: [accounts.map((account) => {
                                 const isSelected = selectedIds.has(account.userID);
                                 return (_jsxs("div", { className: "flex cursor-pointer items-center gap-3 rounded-lg px-3 py-3 transition-colors duration-150 hover:bg-[#f5f5f5]", onClick: () => toggleMember(account), children: [_jsx(Avatar, { src: account.avatar, size: 40, className: "shrink-0", children: account.displayName.charAt(0) || "A" }), _jsx("span", { className: "flex-1 truncate text-base font-medium text-gray-900", children: formatMemberLabel(account.displayName, account.username) }), _jsx("span", { className: clsx("flex h-4 w-4 shrink-0 items-center justify-center rounded border", isSelected
                                                 ? "border-primary-400 bg-primary-400"

package/dist/components/group/CreateGroupForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CreateGroupForm.d.ts","sourceRoot":"","sources":["../../../src/components/group/CreateGroupForm.tsx"],"names":[],"mappings":"AAeA,UAAU,oBAAoB;IAC5B,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,QAAA,MAAM,eAAe,GAAI,YAAY,oBAAoB,4CAsNxD,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"CreateGroupForm.d.ts","sourceRoot":"","sources":["../../../src/components/group/CreateGroupForm.tsx"],"names":[],"mappings":"AAeA,UAAU,oBAAoB;IAC5B,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAED,QAAA,MAAM,eAAe,GAAI,YAAY,oBAAoB,4CAqNxD,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/group/CreateGroupForm.js

@@ -97,9 +97,7 @@ const CreateGroupForm = ({ onDone }) => {
             description: t("create_group.privacy_public_desc"),
         },
     ], [t]);
-    return (_jsxs("div", { className: "flex max-h-[70vh] flex-col", children: [_jsxs("div", { className: "flex flex-col overflow-y-auto pr-1", children: [_jsxs("div", { className: "flex items-center gap-4 py-6", children: [_jsx(Upload, { accept: "image/jpeg, image/png, image/jpg", showUploadList: false, beforeUpload: handleAvatarSelect, children: _jsxs("div", { className: "relative flex h-20 w-20 shrink-0 cursor-pointer items-center justify-center rounded-2xl bg-primary-50", children: [avatarPreviewUrl ? (
-                                        // eslint-disable-next-line @next/next/no-img-element
-                                        _jsx("img", { src: avatarPreviewUrl, alt: "", className: clsx("h-full w-full rounded-2xl object-cover", isAvatarUploading && "opacity-50") })) : (_jsx(Icon, { icon: "user-three-b", size: 32, className: "text-primary-400" })), isAvatarUploading && (_jsx("span", { className: "absolute inset-0 flex items-center justify-center rounded-2xl bg-black/10", children: _jsx("span", { className: "h-5 w-5 animate-spin rounded-full border-2 border-white border-t-transparent" }) })), _jsx("span", { className: "absolute -bottom-1 -right-1 flex h-7 w-7 items-center justify-center rounded-full bg-gray-500", children: _jsx(Icon, { icon: "camera-b", size: 14, className: "text-white" }) })] }) }), _jsx(Input, { size: "large", value: groupName, onChange: (event) => setGroupName(event.target.value.slice(0, GROUP_NAME_MAX_LENGTH)), maxLength: GROUP_NAME_MAX_LENGTH, placeholder: t("create_group.name_placeholder"), className: "flex-1 text-base" })] }), _jsxs("div", { className: "flex flex-col gap-3 border-t border-gray-100 py-6", children: [_jsx("span", { className: "text-xs font-semibold uppercase tracking-wide text-gray-400", children: t("create_group.privacy_label") }), _jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: privacyOptions.map((option) => (_jsxs("button", { type: "button", onClick: () => setIsPublic(option.value), className: clsx("rounded-xl border-2 p-4 text-left transition-colors", isPublic === option.value
+    return (_jsxs("div", { className: "flex max-h-[70vh] flex-col", "data-cp-name": "CreateGroupForm", children: [_jsxs("div", { className: "flex flex-col overflow-y-auto pr-1", children: [_jsxs("div", { className: "flex items-center gap-4 py-6", children: [_jsx(Upload, { accept: "image/jpeg, image/png, image/jpg", showUploadList: false, beforeUpload: handleAvatarSelect, children: _jsxs("div", { className: "relative flex h-20 w-20 shrink-0 cursor-pointer items-center justify-center rounded-2xl bg-primary-50", children: [avatarPreviewUrl ? (_jsx("img", { src: avatarPreviewUrl, alt: "", className: clsx("h-full w-full rounded-2xl object-cover", isAvatarUploading && "opacity-50") })) : (_jsx(Icon, { icon: "user-three-b", size: 32, className: "text-primary-400" })), isAvatarUploading && (_jsx("span", { className: "absolute inset-0 flex items-center justify-center rounded-2xl bg-black/10", children: _jsx("span", { className: "h-5 w-5 animate-spin rounded-full border-2 border-white border-t-transparent" }) })), _jsx("span", { className: "absolute -bottom-1 -right-1 flex h-7 w-7 items-center justify-center rounded-full bg-gray-500", children: _jsx(Icon, { icon: "camera-b", size: 14, className: "text-white" }) })] }) }), _jsx(Input, { size: "large", value: groupName, onChange: (event) => setGroupName(event.target.value.slice(0, GROUP_NAME_MAX_LENGTH)), maxLength: GROUP_NAME_MAX_LENGTH, placeholder: t("create_group.name_placeholder"), className: "flex-1 text-base" })] }), _jsxs("div", { className: "flex flex-col gap-3 border-t border-gray-100 py-6", children: [_jsx("span", { className: "text-xs font-semibold uppercase tracking-wide text-gray-400", children: t("create_group.privacy_label") }), _jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: privacyOptions.map((option) => (_jsxs("button", { type: "button", onClick: () => setIsPublic(option.value), className: clsx("rounded-xl border-2 p-4 text-left transition-colors", isPublic === option.value
                                         ? "border-primary-400 bg-primary-50"
                                         : "border-gray-200 bg-white"), children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Icon, { icon: option.icon, size: 18, className: isPublic === option.value
                                                         ? "text-primary-400"

package/dist/components/group/GroupMemberPicker.js

@@ -35,7 +35,7 @@ const GroupMemberPicker = ({ selectedMembers, onChangeSelectedMembers, }) => {
     const handleClearAll = () => {
         onChangeSelectedMembers([]);
     };
-    return (_jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "flex flex-col gap-2 rounded-xl border border-gray-200 p-3", children: [_jsx(Input, { value: search, onChange: (event) => setSearch(event.target.value), placeholder: t("create_group.search_member_placeholder"), prefix: _jsx(Icon, { icon: "search-o", size: 16, className: "text-gray-400" }) }), _jsx("div", { className: "max-h-64 overflow-y-auto", onScroll: handleListScroll, children: isLoading ? (_jsx("div", { className: "flex items-center justify-center py-6", children: _jsx(Spin, {}) })) : accounts.length === 0 ? (_jsx(Empty, { description: t("create_group.no_member_found") })) : (_jsxs(_Fragment, { children: [accounts.map((account) => {
+    return (_jsxs("div", { className: "grid grid-cols-2 gap-3", "data-cp-name": "GroupMemberPicker", children: [_jsxs("div", { className: "flex flex-col gap-2 rounded-xl border border-gray-200 p-3", children: [_jsx(Input, { value: search, onChange: (event) => setSearch(event.target.value), placeholder: t("create_group.search_member_placeholder"), prefix: _jsx(Icon, { icon: "search-o", size: 16, className: "text-gray-400" }) }), _jsx("div", { className: "max-h-64 overflow-y-auto", onScroll: handleListScroll, children: isLoading ? (_jsx("div", { className: "flex items-center justify-center py-6", children: _jsx(Spin, {}) })) : accounts.length === 0 ? (_jsx(Empty, { description: t("create_group.no_member_found") })) : (_jsxs(_Fragment, { children: [accounts.map((account) => {
                                     const isSelected = selectedIds.has(account.userID);
                                     return (_jsxs("div", { className: "flex cursor-pointer items-center gap-3 rounded-lg px-3 py-3 transition-colors duration-150 hover:bg-[#f5f5f5]", onClick: () => toggleMember(account), children: [_jsx(Avatar, { src: account.avatar, size: 40, className: "shrink-0", children: account.displayName.charAt(0) || "A" }), _jsx("span", { className: "flex-1 truncate text-base font-medium text-gray-900", children: formatMemberLabel(account.displayName, account.username) }), _jsx("span", { className: clsx("flex h-4 w-4 shrink-0 items-center justify-center rounded border", isSelected
                                                     ? "border-primary-400 bg-primary-400"

package/dist/components/group/MemberPermissionPanel.js

@@ -48,6 +48,6 @@ const MemberPermissionPanel = ({ open, groupID, onClose }) => {
     };
     if (!open)
         return null;
-    return (_jsxs("div", { className: "absolute inset-0 bg-white flex flex-col z-10", children: [_jsxs("div", { className: "flex w-full items-center border-b border-gray-100 p-2", children: [_jsx("button", { type: "button", className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-primary-400", onClick: onClose, children: _jsx(Icon, { icon: "arrow-left-o", size: 24 }) }), _jsx("p", { className: "min-w-0 flex-1 truncate px-2 text-[18px] font-bold leading-[1.6] text-gray-900", children: t("member_permission_settings") })] }), _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx(ConfigProvider, { theme: { token: { colorPrimary: PERMISSION_SWITCH_COLOR } }, children: _jsxs("div", { className: "flex flex-col py-2", children: [_jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [_jsx("span", { className: "text-sm", children: t("permission_send_message") }), _jsx(Switch, { checked: pending.sendMessage, onChange: (checked) => setPending((prev) => (Object.assign(Object.assign({}, prev), { sendMessage: checked }))) })] }), _jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [_jsx("span", { className: "text-sm", children: t("permission_add_member") }), _jsx(Switch, { checked: pending.addMember, onChange: (checked) => setPending((prev) => (Object.assign(Object.assign({}, prev), { addMember: checked }))) })] }), _jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [_jsx("span", { className: "text-sm", children: t("permission_pin_message") }), _jsx(Switch, { checked: pending.pinMessage, onChange: (checked) => setPending((prev) => (Object.assign(Object.assign({}, prev), { pinMessage: checked }))) })] }), _jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [_jsx("span", { className: "text-sm", children: t("permission_view_member_info") }), _jsx(Switch, { checked: pending.viewMemberInformation, onChange: (checked) => setPending((prev) => (Object.assign(Object.assign({}, prev), { viewMemberInformation: checked }))) })] })] }) }) }), _jsxs("div", { className: "flex items-center justify-end gap-2 px-4 py-3 border-t border-gray-100", children: [_jsx("button", { type: "button", className: "px-4 py-1.5 rounded-full border border-gray-300 text-gray-700 text-sm font-medium", onClick: onClose, children: t("cancel") }), _jsx("button", { type: "button", className: "px-4 py-1.5 rounded-full bg-primary-400 text-white text-sm font-medium disabled:bg-gray-200 disabled:text-gray-400", disabled: !hasChanges || isSaving, onClick: handleSave, children: t("save") })] })] }));
+    return (_jsxs("div", { className: "absolute inset-0 bg-white flex flex-col z-10", "data-cp-name": "MemberPermissionPanel", children: [_jsxs("div", { className: "flex w-full items-center border-b border-gray-100 p-2", children: [_jsx("button", { type: "button", className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-primary-400", onClick: onClose, children: _jsx(Icon, { icon: "arrow-left-o", size: 24 }) }), _jsx("p", { className: "min-w-0 flex-1 truncate px-2 text-[18px] font-bold leading-[1.6] text-gray-900", children: t("member_permission_settings") })] }), _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx(ConfigProvider, { theme: { token: { colorPrimary: PERMISSION_SWITCH_COLOR } }, children: _jsxs("div", { className: "flex flex-col py-2", children: [_jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [_jsx("span", { className: "text-sm", children: t("permission_send_message") }), _jsx(Switch, { checked: pending.sendMessage, onChange: (checked) => setPending((prev) => (Object.assign(Object.assign({}, prev), { sendMessage: checked }))) })] }), _jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [_jsx("span", { className: "text-sm", children: t("permission_add_member") }), _jsx(Switch, { checked: pending.addMember, onChange: (checked) => setPending((prev) => (Object.assign(Object.assign({}, prev), { addMember: checked }))) })] }), _jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [_jsx("span", { className: "text-sm", children: t("permission_pin_message") }), _jsx(Switch, { checked: pending.pinMessage, onChange: (checked) => setPending((prev) => (Object.assign(Object.assign({}, prev), { pinMessage: checked }))) })] }), _jsxs("div", { className: "flex items-center justify-between px-4 py-3", children: [_jsx("span", { className: "text-sm", children: t("permission_view_member_info") }), _jsx(Switch, { checked: pending.viewMemberInformation, onChange: (checked) => setPending((prev) => (Object.assign(Object.assign({}, prev), { viewMemberInformation: checked }))) })] })] }) }) }), _jsxs("div", { className: "flex items-center justify-end gap-2 px-4 py-3 border-t border-gray-100", children: [_jsx("button", { type: "button", className: "px-4 py-1.5 rounded-full border border-gray-300 text-gray-700 text-sm font-medium", onClick: onClose, children: t("cancel") }), _jsx("button", { type: "button", className: "px-4 py-1.5 rounded-full bg-primary-400 text-white text-sm font-medium disabled:bg-gray-200 disabled:text-gray-400", disabled: !hasChanges || isSaving, onClick: handleSave, children: t("save") })] })] }));
 };
 export default MemberPermissionPanel;

package/dist/components/icon/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/icon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAqBpC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/icon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAsBpC,CAAC"}

package/dist/components/icon/index.js

@@ -14,5 +14,5 @@ import IcoMoon from "react-icomoon";
 import iconSet from "../../assets/droppiiFontSelection.json";
 export const Icon = (_a) => {
     var { icon, size = 24, color = "currentColor", className = "", style = {}, onClick } = _a, props = __rest(_a, ["icon", "size", "color", "className", "style", "onClick"]);
-    return (_jsx(IcoMoon, Object.assign({ iconSet: iconSet, icon: icon, size: size, color: color, className: className, style: style, onClick: onClick }, props)));
+    return (_jsx(IcoMoon, Object.assign({ "data-cp-name": "Icon", iconSet: iconSet, icon: icon, size: size, color: color, className: className, style: style, onClick: onClick }, props)));
 };

package/dist/components/media-collection/FileCollection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/FileCollection.tsx"],"names":[],"mappings":"AAaA,QAAA,MAAM,cAAc,+CAkFnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"FileCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/FileCollection.tsx"],"names":[],"mappings":"AAaA,QAAA,MAAM,cAAc,+CAsFnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/media-collection/FileCollection.js

@@ -32,6 +32,6 @@ const FileCollection = () => {
         return _jsx(Empty, { description: t("no_media_files") });
     if (isLoading)
         return (_jsx("div", { className: "flex items-center justify-center", children: _jsx(Spin, {}) }));
-    return (_jsx("div", { id: "scrollableFileDiv", className: "h-full overflow-auto", children: _jsx(InfiniteScroll, { dataLength: Object.keys(groupedData).length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableFileDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }) }));
+    return (_jsx("div", { id: "scrollableFileDiv", "data-cp-name": "FileCollection", className: "h-full overflow-auto", children: _jsx(InfiniteScroll, { dataLength: Object.keys(groupedData).length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableFileDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }) }));
 };
 export default FileCollection;

package/dist/components/media-collection/ImageCollection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ImageCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/ImageCollection.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,eAAe,+CAqFpB,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"ImageCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/ImageCollection.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,eAAe,+CAyFpB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/media-collection/ImageCollection.js

@@ -31,7 +31,7 @@ const ImageCollection = () => {
         return _jsx(Empty, { description: t("no_media_files") });
     if (isLoading)
         return (_jsx("div", { className: "flex items-center justify-center", children: _jsx(Spin, {}) }));
-    return (_jsx("div", { id: "scrollableImageDiv", className: "h-full overflow-auto", children: _jsx(Image.PreviewGroup, { preview: {
+    return (_jsx("div", { id: "scrollableImageDiv", "data-cp-name": "ImageCollection", className: "h-full overflow-auto", children: _jsx(Image.PreviewGroup, { preview: {
                 toolbarRender: (originalNode, info) => { var _a; return renderImagePreviewToolbar(originalNode, (_a = info === null || info === void 0 ? void 0 : info.image) === null || _a === void 0 ? void 0 : _a.url, t); },
             }, children: _jsx(InfiniteScroll, { dataLength: dataFlatten.length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableImageDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }) }) }));
 };

package/dist/components/media-collection/LinkCollection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LinkCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/LinkCollection.tsx"],"names":[],"mappings":"AA8DA,QAAA,MAAM,cAAc,GAAI,aAAa;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,4CAyH3D,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"LinkCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/LinkCollection.tsx"],"names":[],"mappings":"AA+DA,QAAA,MAAM,cAAc,GAAI,aAAa;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,4CA6H3D,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/media-collection/LinkCollection.js

@@ -33,7 +33,7 @@ const LinkPreview = ({ url }) => {
             setIsLoading(false);
         });
     }, [url]);
-    return (_jsxs("a", { href: url, target: "_blank", rel: "noopener noreferrer", className: "flex flex-col truncate text-blue-600 cursor-pointer", title: title || url, children: [isLoading && (_jsx("span", { className: "font-medium truncate text-gray-900", children: url })), !isLoading &&
+    return (_jsxs("a", { href: url, target: "_blank", rel: "noopener noreferrer", "data-cp-name": "LinkPreview", className: "flex flex-col truncate text-blue-600 cursor-pointer", title: title || url, children: [isLoading && (_jsx("span", { className: "font-medium truncate text-gray-900", children: url })), !isLoading &&
                 (title ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "font-medium truncate text-gray-900", children: title }), _jsx("span", { className: "text-sm text-gray-500 truncate", children: url })] })) : (_jsx("span", { className: "font-medium truncate text-gray-900", children: url })))] }));
 };
 const LinkCollection = ({ onClose }) => {
@@ -87,6 +87,6 @@ const LinkCollection = ({ onClose }) => {
         return _jsx(Empty, { description: t("no_media_files") });
     if (isLoading)
         return (_jsx("div", { className: "flex items-center justify-center", children: _jsx(Spin, {}) }));
-    return (_jsx("div", { id: "scrollableFileDiv", className: "h-full overflow-auto", children: _jsx(InfiniteScroll, { dataLength: Object.keys(groupedData).length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableFileDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }) }));
+    return (_jsx("div", { id: "scrollableFileDiv", "data-cp-name": "LinkCollection", className: "h-full overflow-auto", children: _jsx(InfiniteScroll, { dataLength: Object.keys(groupedData).length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableFileDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }) }));
 };
 export default LinkCollection;

package/dist/components/media-collection/VideoCollection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VideoCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/VideoCollection.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,eAAe,+CAiGpB,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"VideoCollection.d.ts","sourceRoot":"","sources":["../../../src/components/media-collection/VideoCollection.tsx"],"names":[],"mappings":"AAiBA,QAAA,MAAM,eAAe,+CAqGpB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/media-collection/VideoCollection.js

@@ -40,6 +40,6 @@ const VideoCollection = () => {
         return _jsx(Empty, { description: t("no_media_files") });
     if (isLoading)
         return (_jsx("div", { className: "flex items-center justify-center", children: _jsx(Spin, {}) }));
-    return (_jsxs("div", { id: "scrollableVideoDiv", className: "h-full overflow-auto", children: [_jsx(InfiniteScroll, { dataLength: Object.keys(groupedData).length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableVideoDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }), open && (_jsx(VideoPlayerModal, { open: open, videos: toVideoPlayerSources(dataFlatten), initialIndex: currentIndex, onClose: setFalse }))] }));
+    return (_jsxs("div", { id: "scrollableVideoDiv", "data-cp-name": "VideoCollection", className: "h-full overflow-auto", children: [_jsx(InfiniteScroll, { dataLength: Object.keys(groupedData).length, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) }), scrollableTarget: "scrollableVideoDiv", children: Object.entries(groupedData).map(([date, items]) => renderItem(date, items)) }), open && (_jsx(VideoPlayerModal, { open: open, videos: toVideoPlayerSources(dataFlatten), initialIndex: currentIndex, onClose: setFalse }))] }));
 };
 export default VideoCollection;

package/dist/components/media-collection/index.js

@@ -47,7 +47,7 @@ const MediaCollection = () => {
             },
         ];
     }, [isOpen, t]);
-    return (_jsxs("div", { className: "inline-flex shrink-0", children: [_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: toggle, children: _jsx(Icon, { icon: "folder-o", size: 22 }) }), _jsx(Drawer, { open: isOpen, onClose: toggle, mask: false, closeIcon: false, styles: {
+    return (_jsxs("div", { "data-cp-name": "MediaCollection", className: "inline-flex shrink-0", children: [_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: toggle, children: _jsx(Icon, { icon: "folder-o", size: 22 }) }), _jsx(Drawer, { open: isOpen, onClose: toggle, mask: false, closeIcon: false, styles: {
                     body: {
                         padding: 0,
                         height: "100%",

package/dist/components/media-resources/FileResourceList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileResourceList.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/FileResourceList.tsx"],"names":[],"mappings":"AAcA,QAAA,MAAM,gBAAgB,+CAsCrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"FileResourceList.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/FileResourceList.tsx"],"names":[],"mappings":"AAcA,QAAA,MAAM,gBAAgB,+CA0CrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/media-resources/FileResourceList.js

@@ -8,7 +8,7 @@ import ResourceScrollContainer from "./ResourceScrollContainer";
 import { useResourceTab } from "./useResourceTab";
 const FileResourceList = () => {
     const { items, containerProps } = useResourceTab(MediaResourceTabKey.File);
-    return (_jsx(ResourceScrollContainer, Object.assign({}, containerProps, { itemCount: items.length, children: _jsx("div", { className: "flex flex-col gap-2 p-3", children: items.map((item) => {
+    return (_jsx(ResourceScrollContainer, Object.assign({ "data-cp-name": "FileResourceList" }, containerProps, { itemCount: items.length, children: _jsx("div", { className: "flex flex-col gap-2 p-3", children: items.map((item) => {
                 var _a, _b;
                 const fileContent = parseMessageContent((_a = item === null || item === void 0 ? void 0 : item.chatLog) === null || _a === void 0 ? void 0 : _a.content);
                 return (_jsxs("div", { className: "flex w-full cursor-pointer items-center gap-2 rounded-[12px] bg-[#f5f5f5]/20 p-3", onClick: () => downloadFileFromUrl((fileContent === null || fileContent === void 0 ? void 0 : fileContent.sourceUrl) || "", (fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileName) || ""), children: [_jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center [&>svg]:h-full [&>svg]:w-auto", children: documentIcon }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "truncate text-[16px] font-medium leading-[1.6] text-gray-900", children: shortenFileName(fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileName) }), _jsx("span", { className: "text-[13px] font-normal leading-[1.6] text-gray-400", children: renderFileSize((fileContent === null || fileContent === void 0 ? void 0 : fileContent.fileSize) || 0) })] })] }, (_b = item.chatLog) === null || _b === void 0 ? void 0 : _b.clientMsgID));

package/dist/components/media-resources/ImageResourceGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ImageResourceGrid.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/ImageResourceGrid.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,iBAAiB,+CA4CtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"ImageResourceGrid.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/ImageResourceGrid.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,iBAAiB,+CAgDtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/media-resources/ImageResourceGrid.js

@@ -11,7 +11,7 @@ import { useResourceTab } from "./useResourceTab";
 const ImageResourceGrid = () => {
     const { t } = useTranslation();
     const { items, containerProps } = useResourceTab(MediaResourceTabKey.Image);
-    return (_jsx(ResourceScrollContainer, Object.assign({}, containerProps, { itemCount: items.length, children: _jsx(Image.PreviewGroup, { preview: {
+    return (_jsx(ResourceScrollContainer, Object.assign({ "data-cp-name": "ImageResourceGrid" }, containerProps, { itemCount: items.length, children: _jsx(Image.PreviewGroup, { preview: {
                 toolbarRender: (originalNode, info) => { var _a; return renderImagePreviewToolbar(originalNode, (_a = info === null || info === void 0 ? void 0 : info.image) === null || _a === void 0 ? void 0 : _a.url, t); },
             }, children: _jsx("div", { className: "grid grid-cols-3 gap-2 p-3", children: items.map((item) => {
                     var _a, _b, _c, _d;

package/dist/components/media-resources/LinkResourceItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LinkResourceItem.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/LinkResourceItem.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD,UAAU,qBAAqB;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC;AAID,QAAA,MAAM,gBAAgB,GAAI,0BAA0B,qBAAqB,4CAmDxE,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"LinkResourceItem.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/LinkResourceItem.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD,UAAU,qBAAqB;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC;AAID,QAAA,MAAM,gBAAgB,GAAI,0BAA0B,qBAAqB,4CAoDxE,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/media-resources/LinkResourceItem.js

@@ -17,6 +17,6 @@ const LinkResourceItem = ({ url, messageMetadata }) => {
     const handleOpen = () => {
         openLink(url, t);
     };
-    return (_jsxs("div", { "data-testid": "link-resource-item", className: "flex w-full cursor-pointer items-center gap-2 rounded-[12px] bg-[#f5f5f5]/20 p-3", onClick: handleOpen, children: [_jsx("div", { className: "flex h-[76px] w-[76px] shrink-0 items-center justify-center", children: shouldShowImage ? (_jsx("img", { src: imageUrl, alt: "", className: "h-full w-full rounded-[8px] object-cover", onError: () => setFailedImageUrl(imageUrl) })) : (_jsx("div", { className: "flex h-full w-full items-center justify-center rounded-[12px] bg-gray-200", children: _jsx(Icon, { icon: "link-b", size: 24, color: "white" }) })) }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center", children: [_jsx("p", { className: "truncate text-[14px] font-normal leading-[1.6] tracking-[-0.14px] text-gray-600", children: stripProtocol(url) }), _jsx("p", { className: "line-clamp-2 text-[16px] font-medium leading-[1.6] text-gray-900", children: title || url })] })] }));
+    return (_jsxs("div", { "data-testid": "link-resource-item", "data-cp-name": "LinkResourceItem", className: "flex w-full cursor-pointer items-center gap-2 rounded-[12px] bg-[#f5f5f5]/20 p-3", onClick: handleOpen, children: [_jsx("div", { className: "flex h-[76px] w-[76px] shrink-0 items-center justify-center", children: shouldShowImage ? (_jsx("img", { src: imageUrl, alt: "", className: "h-full w-full rounded-[8px] object-cover", onError: () => setFailedImageUrl(imageUrl) })) : (_jsx("div", { className: "flex h-full w-full items-center justify-center rounded-[12px] bg-gray-200", children: _jsx(Icon, { icon: "link-b", size: 24, color: "white" }) })) }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center", children: [_jsx("p", { className: "truncate text-[14px] font-normal leading-[1.6] tracking-[-0.14px] text-gray-600", children: stripProtocol(url) }), _jsx("p", { className: "line-clamp-2 text-[16px] font-medium leading-[1.6] text-gray-900", children: title || url })] })] }));
 };
 export default LinkResourceItem;

package/dist/components/media-resources/LinkResourceList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LinkResourceList.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/LinkResourceList.tsx"],"names":[],"mappings":"AASA,QAAA,MAAM,gBAAgB,+CA2BrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"LinkResourceList.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/LinkResourceList.tsx"],"names":[],"mappings":"AASA,QAAA,MAAM,gBAAgB,+CA+BrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/media-resources/LinkResourceList.js

@@ -20,6 +20,6 @@ const LinkResourceList = () => {
             });
         });
     });
-    return (_jsx(ResourceScrollContainer, Object.assign({}, containerProps, { itemCount: linkRows.length, children: _jsx("div", { className: "flex flex-col gap-2 p-3", children: linkRows.map((row) => (_jsx(LinkResourceItem, { url: row.url, messageMetadata: row.messageMetadata }, row.key))) }) })));
+    return (_jsx(ResourceScrollContainer, Object.assign({ "data-cp-name": "LinkResourceList" }, containerProps, { itemCount: linkRows.length, children: _jsx("div", { className: "flex flex-col gap-2 p-3", children: linkRows.map((row) => (_jsx(LinkResourceItem, { url: row.url, messageMetadata: row.messageMetadata }, row.key))) }) })));
 };
 export default LinkResourceList;

package/dist/components/media-resources/MediaEntryCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MediaEntryCard.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaEntryCard.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,mBAAmB,EAGpB,MAAM,aAAa,CAAC;AAErB,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAC;CACjD;AAED,QAAA,MAAM,cAAc,GAAI,cAAc,mBAAmB,4CA4BxD,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"MediaEntryCard.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaEntryCard.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,mBAAmB,EAGpB,MAAM,aAAa,CAAC;AAErB,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAC;CACjD;AAED,QAAA,MAAM,cAAc,GAAI,cAAc,mBAAmB,4CA6BxD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/media-resources/MediaEntryCard.js

@@ -5,6 +5,6 @@ import { Icon } from "../../components/icon";
 import { MEDIA_RESOURCE_TAB_ORDER, RESOURCE_ENTRY_ICON, RESOURCE_TAB_LABEL_KEY, } from "./constants";
 const MediaEntryCard = ({ onSelect }) => {
     const { t } = useTranslation();
-    return (_jsx("div", { "data-testid": "media-entry-card", className: "flex w-full items-center justify-between overflow-hidden rounded-[12px] bg-white", children: MEDIA_RESOURCE_TAB_ORDER.map((tabKey) => (_jsxs("button", { type: "button", "data-testid": `media-entry-${tabKey}`, className: "flex min-w-0 flex-1 cursor-pointer flex-col items-center justify-center gap-1 px-2 py-3", onClick: () => onSelect(tabKey), children: [_jsx(Icon, { icon: RESOURCE_ENTRY_ICON[tabKey], size: 24, className: "text-gray-900" }), _jsx("span", { className: "whitespace-nowrap text-center text-[12px] font-normal leading-[1.6] text-gray-900", children: t(RESOURCE_TAB_LABEL_KEY[tabKey]) })] }, tabKey))) }));
+    return (_jsx("div", { "data-testid": "media-entry-card", "data-cp-name": "MediaEntryCard", className: "flex w-full items-center justify-between overflow-hidden rounded-[12px] bg-white", children: MEDIA_RESOURCE_TAB_ORDER.map((tabKey) => (_jsxs("button", { type: "button", "data-testid": `media-entry-${tabKey}`, className: "flex min-w-0 flex-1 cursor-pointer flex-col items-center justify-center gap-1 px-2 py-3", onClick: () => onSelect(tabKey), children: [_jsx(Icon, { icon: RESOURCE_ENTRY_ICON[tabKey], size: 24, className: "text-gray-900" }), _jsx("span", { className: "whitespace-nowrap text-center text-[12px] font-normal leading-[1.6] text-gray-900", children: t(RESOURCE_TAB_LABEL_KEY[tabKey]) })] }, tabKey))) }));
 };
 export default MediaEntryCard;

package/dist/components/media-resources/MediaResourcePanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MediaResourcePanel.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaResourcePanel.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGlD,UAAU,uBAAuB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,mBAAmB,CAAC;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,kBAAkB,GAAI,gCAIzB,uBAAuB,4CAqCzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"MediaResourcePanel.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaResourcePanel.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGlD,UAAU,uBAAuB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,UAAU,EAAE,mBAAmB,CAAC;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,kBAAkB,GAAI,gCAIzB,uBAAuB,4CAsCzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/media-resources/MediaResourcePanel.js

@@ -6,7 +6,7 @@ import { Icon } from "../../components/icon";
 import MediaResourceTabs from "./MediaResourceTabs";
 const MediaResourcePanel = ({ open, initialTab, onClose, }) => {
     const { t } = useTranslation();
-    return (_jsx(Drawer, { open: open, onClose: onClose, placement: "right", closeIcon: false, width: "100%", styles: {
+    return (_jsx(Drawer, { "data-cp-name": "MediaResourcePanel", open: open, onClose: onClose, placement: "right", closeIcon: false, width: "100%", styles: {
             body: { padding: 0 },
         }, getContainer: false, forceRender: true, destroyOnHidden: true, children: _jsxs("div", { className: "flex h-full flex-col bg-white", children: [_jsxs("div", { className: "flex w-full items-center p-2", children: [_jsx("button", { type: "button", "data-testid": "media-resource-back", className: "flex shrink-0 cursor-pointer items-center justify-center p-2 text-primary-400", onClick: onClose, children: _jsx(Icon, { icon: "arrow-left-o", size: 24 }) }), _jsx("p", { className: "min-w-0 flex-1 truncate px-2 text-[18px] font-bold leading-[1.6] text-gray-900", children: t("media_resources_title") })] }), _jsx("div", { className: "min-h-0 flex-1", children: _jsx(MediaResourceTabs, { initialTab: initialTab }) })] }) }));
 };

package/dist/components/media-resources/MediaResourceTabBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MediaResourceTabBar.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaResourceTabBar.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,mBAAmB,EAEpB,MAAM,aAAa,CAAC;AAErB,UAAU,wBAAwB;IAChC,SAAS,EAAE,mBAAmB,CAAC;IAC/B,QAAQ,EAAE,CAAC,GAAG,EAAE,mBAAmB,KAAK,IAAI,CAAC;CAC9C;AAED,QAAA,MAAM,mBAAmB,GAAI,0BAG1B,wBAAwB,4CAwC1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"MediaResourceTabBar.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/MediaResourceTabBar.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,mBAAmB,EAEpB,MAAM,aAAa,CAAC;AAErB,UAAU,wBAAwB;IAChC,SAAS,EAAE,mBAAmB,CAAC;IAC/B,QAAQ,EAAE,CAAC,GAAG,EAAE,mBAAmB,KAAK,IAAI,CAAC;CAC9C;AAED,QAAA,MAAM,mBAAmB,GAAI,0BAG1B,wBAAwB,4CAyC1B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/components/media-resources/MediaResourceTabBar.js

@@ -5,7 +5,7 @@ import { useTranslation } from "react-i18next";
 import { MEDIA_RESOURCE_TAB_ORDER, RESOURCE_TAB_LABEL_KEY, } from "./constants";
 const MediaResourceTabBar = ({ activeKey, onChange, }) => {
     const { t } = useTranslation();
-    return (_jsx("div", { role: "tablist", "data-testid": "media-resource-tab-bar", className: "flex w-full items-end border-b border-gray-25 bg-white", children: MEDIA_RESOURCE_TAB_ORDER.map((tabKey) => {
+    return (_jsx("div", { role: "tablist", "data-testid": "media-resource-tab-bar", "data-cp-name": "MediaResourceTabBar", className: "flex w-full items-end border-b border-gray-25 bg-white", children: MEDIA_RESOURCE_TAB_ORDER.map((tabKey) => {
             const isActive = tabKey === activeKey;
             return (_jsxs("button", { type: "button", role: "tab", "aria-selected": isActive, "data-testid": `media-resource-tab-${tabKey}`, className: "flex cursor-pointer flex-col items-center justify-center px-3 pt-0.5", onClick: () => onChange(tabKey), children: [_jsx("span", { className: clsx("text-center text-[14px] font-bold leading-[1.6] tracking-[0.14px]", isActive ? "text-primary-400" : "text-gray-400"), children: t(RESOURCE_TAB_LABEL_KEY[tabKey]) }), _jsx("span", { className: clsx("h-[3px] w-full rounded-[4px] bg-primary-400", !isActive && "opacity-0") })] }, tabKey));
         }) }));

package/dist/components/media-resources/MediaResourceTabs.js

@@ -9,6 +9,6 @@ import FileResourceList from "./FileResourceList";
 import LinkResourceList from "./LinkResourceList";
 const MediaResourceTabs = ({ initialTab = MediaResourceTabKey.Image, }) => {
     const [activeKey, setActiveKey] = useState(initialTab);
-    return (_jsxs("div", { className: "flex h-full flex-col bg-white", children: [_jsx(MediaResourceTabBar, { activeKey: activeKey, onChange: setActiveKey }), _jsxs("div", { className: "min-h-0 flex-1", children: [activeKey === MediaResourceTabKey.Image && _jsx(ImageResourceGrid, {}), activeKey === MediaResourceTabKey.Video && _jsx(VideoResourceGrid, {}), activeKey === MediaResourceTabKey.File && _jsx(FileResourceList, {}), activeKey === MediaResourceTabKey.Link && _jsx(LinkResourceList, {})] })] }));
+    return (_jsxs("div", { "data-cp-name": "MediaResourceTabs", className: "flex h-full flex-col bg-white", children: [_jsx(MediaResourceTabBar, { activeKey: activeKey, onChange: setActiveKey }), _jsxs("div", { className: "min-h-0 flex-1", children: [activeKey === MediaResourceTabKey.Image && _jsx(ImageResourceGrid, {}), activeKey === MediaResourceTabKey.Video && _jsx(VideoResourceGrid, {}), activeKey === MediaResourceTabKey.File && _jsx(FileResourceList, {}), activeKey === MediaResourceTabKey.Link && _jsx(LinkResourceList, {})] })] }));
 };
 export default MediaResourceTabs;

package/dist/components/media-resources/ResourceEmptyState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResourceEmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/ResourceEmptyState.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,mBAAmB,EAEpB,MAAM,aAAa,CAAC;AAErB,UAAU,uBAAuB;IAC/B,MAAM,EAAE,mBAAmB,CAAC;CAC7B;AAED,QAAA,MAAM,kBAAkB,GAAI,YAAY,uBAAuB,4CAkB9D,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"ResourceEmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/ResourceEmptyState.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,mBAAmB,EAEpB,MAAM,aAAa,CAAC;AAErB,UAAU,uBAAuB;IAC/B,MAAM,EAAE,mBAAmB,CAAC;CAC7B;AAED,QAAA,MAAM,kBAAkB,GAAI,YAAY,uBAAuB,4CAmB9D,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/media-resources/ResourceEmptyState.js

@@ -5,6 +5,6 @@ import { images } from "../../constants/images";
 import { RESOURCE_EMPTY_TEXT_KEY, } from "./constants";
 const ResourceEmptyState = ({ tabKey }) => {
     const { t } = useTranslation();
-    return (_jsxs("div", { "data-testid": "resource-empty-state", className: "flex h-full w-full flex-col items-center gap-3 bg-white px-8 py-[42px]", children: [_jsx("img", { src: images.emptyResources, alt: "", className: "h-[120px] w-[120px] shrink-0" }), _jsx("p", { className: "text-center text-[16px] font-normal leading-[1.6] tracking-[0.16px] text-gray-600", children: t(RESOURCE_EMPTY_TEXT_KEY[tabKey]) })] }));
+    return (_jsxs("div", { "data-testid": "resource-empty-state", "data-cp-name": "ResourceEmptyState", className: "flex h-full w-full flex-col items-center gap-3 bg-white px-8 py-[42px]", children: [_jsx("img", { src: images.emptyResources, alt: "", className: "h-[120px] w-[120px] shrink-0" }), _jsx("p", { className: "text-center text-[16px] font-normal leading-[1.6] tracking-[0.16px] text-gray-600", children: t(RESOURCE_EMPTY_TEXT_KEY[tabKey]) })] }));
 };
 export default ResourceEmptyState;

package/dist/components/media-resources/ResourceScrollContainer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResourceScrollContainer.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/ResourceScrollContainer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAI7C,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGlD,MAAM,WAAW,4BAA4B;IAC3C,MAAM,EAAE,mBAAmB,CAAC;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IACrB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAQD,QAAA,MAAM,uBAAuB,GAAI,+GAU9B,4BAA4B,4CAgD9B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"ResourceScrollContainer.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/ResourceScrollContainer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAI7C,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGlD,MAAM,WAAW,4BAA4B;IAC3C,MAAM,EAAE,mBAAmB,CAAC;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IACrB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAQD,QAAA,MAAM,uBAAuB,GAAI,+GAU9B,4BAA4B,4CAoD9B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}