@droppii-org/chat-sdk 0.3.8 → 0.4.1

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"}

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

@@ -24,6 +24,6 @@ const ResourceScrollContainer = ({ tabKey, itemCount, isLoading, isError, hasNex
         return _jsx(ResourceEmptyState, { tabKey: tabKey });
     }
     const scrollableId = `resource-scroll-${tabKey}`;
-    return (_jsx("div", { id: scrollableId, className: "h-full overflow-auto", children: _jsx(InfiniteScroll, { dataLength: itemCount, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx(LoadingIndicator, {}), scrollableTarget: scrollableId, children: children }) }));
+    return (_jsx("div", { id: scrollableId, "data-cp-name": "ResourceScrollContainer", className: "h-full overflow-auto", children: _jsx(InfiniteScroll, { dataLength: itemCount, next: fetchNextPage, hasMore: hasNextPage, loader: _jsx(LoadingIndicator, {}), scrollableTarget: scrollableId, children: children }) }));
 };
 export default ResourceScrollContainer;

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

@@ -1 +1 @@
-{"version":3,"file":"VideoResourceGrid.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/VideoResourceGrid.tsx"],"names":[],"mappings":"AAeA,QAAA,MAAM,iBAAiB,+CA8DtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"VideoResourceGrid.d.ts","sourceRoot":"","sources":["../../../src/components/media-resources/VideoResourceGrid.tsx"],"names":[],"mappings":"AAeA,QAAA,MAAM,iBAAiB,+CA+DtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

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

@@ -19,7 +19,7 @@ const VideoResourceGrid = () => {
         setPreviewIndex(index);
         openPreview();
     };
-    return (_jsxs(ResourceScrollContainer, Object.assign({}, containerProps, { itemCount: videoSources.length, children: [_jsx("div", { className: "grid grid-cols-3 gap-2 p-3", children: videoSources.map((video, index) => {
+    return (_jsxs(ResourceScrollContainer, Object.assign({ "data-cp-name": "VideoResourceGrid" }, containerProps, { itemCount: videoSources.length, children: [_jsx("div", { className: "grid grid-cols-3 gap-2 p-3", children: videoSources.map((video, index) => {
                     const durationLabel = video.duration
                         ? formatDuration(video.duration / MILLISECONDS_PER_SECOND)
                         : "";

package/dist/components/message/GroupMembersDrawer.js

@@ -350,7 +350,7 @@ const GroupMembersDrawer = ({ groupID, conversationId, currentSession, disabled
                 return (_jsxs("div", { className: "flex items-center gap-3 px-4 py-2", children: [_jsx(Avatar, { src: member.faceURL, size: 40, className: "shrink-0", children: member.nickname.charAt(0) || "A" }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [_jsx("p", { className: "text-sm font-semibold text-gray-900 truncate", children: member.nickname }), member.isCurrentUser && (_jsx("span", { className: "text-xs text-blue-500 shrink-0", children: t("current_account") }))] }), member.roleLabel && (_jsx("p", { className: "text-sm text-gray-500 truncate", children: member.roleLabel }))] }), (isRealGroup || member.isCurrentUser) && (_jsx(Dropdown, { menu: { items: menuItems }, trigger: ["click"], placement: "bottomRight", children: _jsx("button", { type: "button", className: "flex items-center justify-center w-8 h-8 rounded-full text-gray-500 hover:bg-gray-100", onClick: (event) => event.stopPropagation(), children: _jsx(Icon, { icon: "more-horizontal-b", size: 18 }) }) }))] }, member.userID));
             }) }));
     };
-    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: handleOpenDrawer, disabled: disabled || !groupID, children: _jsx(Icon, { icon: "user-two-check-o", size: 22 }) }), _jsx(Drawer, { open: isOpen, onClose: handleCloseDrawer, mask: false, closeIcon: false, styles: {
+    return (_jsxs("div", { className: "inline-flex shrink-0", "data-cp-name": "GroupMembersDrawer", children: [_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: handleOpenDrawer, disabled: disabled || !groupID, children: _jsx(Icon, { icon: "user-two-check-o", size: 22 }) }), _jsx(Drawer, { open: isOpen, onClose: handleCloseDrawer, mask: false, closeIcon: false, styles: {
                     body: {
                         padding: 0,
                         height: "100%",

package/dist/components/message/MessageHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageHeader.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageHeader.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAGzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAQ/C,UAAU,kBAAkB;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,KAAK,sBAAsB,GAAG,aAAa,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,sBAAsB,CAAC;IAC9B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oBAAoB,EAAE,MAAM,CAAC;CAC9B;AAED,QAAA,MAAM,aAAa,GAAI,0DAKpB,kBAAkB,4CAyOpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"MessageHeader.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageHeader.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAGzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAQ/C,UAAU,kBAAkB;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,KAAK,sBAAsB,GAAG,aAAa,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,sBAAsB,CAAC;IAC9B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,oBAAoB,EAAE,MAAM,CAAC;CAC9B;AAED,QAAA,MAAM,aAAa,GAAI,0DAKpB,kBAAkB,4CA6OpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/message/MessageHeader.js

@@ -22,7 +22,8 @@ const MessageHeader = ({ onClose, currentSession, isJoined, onOpenThreadInfo, })
     const isCx = useAuthStore((state) => state.isCx);
     const isCrm = useAuthStore((state) => state.isCrm);
     const conversationData = useConversationStore((state) => state.conversationData);
-    const currentGroupInfo = useConversationStore((state) => state.currentGroupInfo);
+    const groupID = conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID;
+    const currentGroupInfo = useConversationStore((state) => groupID ? state.currentGroupInfo.get(groupID) : undefined);
     const { mutate: updateSession } = useUpdateSession();
     const permissions = useGroupPermission(conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID);
     const { avatar, displayName } = useConversationDisplayData(conversationData);
@@ -144,6 +145,6 @@ const MessageHeader = ({ onClose, currentSession, isJoined, onOpenThreadInfo, })
             setCurrentSessionStatus(currentSession.status);
         }
     }, [currentSession]);
-    return (_jsxs("div", { className: "px-4 py-3 flex items-center border-b gap-3 bg-white flex-wrap", children: [shouldShowMemberCount ? (_jsx(GroupCompositeAvatar, { groupID: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID, faceURL: avatar, ownerUserID: currentGroupInfo === null || currentGroupInfo === void 0 ? void 0 : currentGroupInfo.ownerUserID, groupName: displayName, size: 40, className: "min-w-10 min-h-10" })) : (_jsx(Avatar, { src: avatar, size: "large", className: "min-w-10 min-h-10", children: ((_a = displayName === null || displayName === void 0 ? void 0 : displayName.charAt) === null || _a === void 0 ? void 0 : _a.call(displayName, 0)) || "A" })), _jsxs("div", { className: "flex flex-col overflow-hidden flex-1", children: [_jsx("p", { className: "text-base truncate", children: displayName || "" }), shouldShowMemberCount && (_jsx("p", { className: "text-xs text-gray-500 truncate", children: t("member_count", { count: (_b = currentGroupInfo === null || currentGroupInfo === void 0 ? void 0 : currentGroupInfo.memberCount) !== null && _b !== void 0 ? _b : 0 }) }))] }), _jsxs("div", { className: "flex items-center gap-2 justify-end overflow-hidden", children: [isCx && !isRealGroup && (_jsx(SelectSession, { placeholder: t("select_tag"), options: tagOptions, value: currentSessionTag, onChange: (value) => handleUpdateSession(value, "tag", value === currentSessionTag), excludeOptions: [SessionTag.SLOW_PROCESSING, SessionTag.NONE] })), isCx && !isRealGroup && (_jsx(SelectSession, { placeholder: t("select_status"), options: statusOptions, value: currentSessionStatus, onChange: (value) => handleUpdateSession(value, "status", value === currentSessionStatus) })), _jsx(SearchDrawer, {}), canViewMemberList && (_jsx(GroupMembersDrawer, { groupID: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID, conversationId: conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationID, currentSession: currentSession })), _jsx(MediaCollection, {}), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: onOpenThreadInfo, children: _jsx(Icon, { icon: "align-justify-o", size: 22 }) }), !!onClose && (_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: onClose, children: _jsx(Icon, { icon: "close-b", size: 22 }) }))] })] }));
+    return (_jsxs("div", { className: "px-4 py-3 flex items-center border-b gap-3 bg-white flex-wrap", "data-cp-name": "MessageHeader", children: [shouldShowMemberCount ? (_jsx(GroupCompositeAvatar, { groupID: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID, faceURL: avatar, ownerUserID: currentGroupInfo === null || currentGroupInfo === void 0 ? void 0 : currentGroupInfo.ownerUserID, groupName: displayName, size: 40, className: "min-w-10 min-h-10" })) : (_jsx(Avatar, { src: avatar, size: "large", className: "min-w-10 min-h-10", children: ((_a = displayName === null || displayName === void 0 ? void 0 : displayName.charAt) === null || _a === void 0 ? void 0 : _a.call(displayName, 0)) || "A" })), _jsxs("div", { className: "flex flex-col overflow-hidden flex-1", children: [_jsx("p", { className: "text-base truncate", children: displayName || "" }), shouldShowMemberCount && (_jsx("p", { className: "text-xs text-gray-500 truncate", children: t("member_count", { count: (_b = currentGroupInfo === null || currentGroupInfo === void 0 ? void 0 : currentGroupInfo.memberCount) !== null && _b !== void 0 ? _b : 0 }) }))] }), _jsxs("div", { className: "flex items-center gap-2 justify-end overflow-hidden", children: [isCx && !isRealGroup && (_jsx(SelectSession, { placeholder: t("select_tag"), options: tagOptions, value: currentSessionTag, onChange: (value) => handleUpdateSession(value, "tag", value === currentSessionTag), excludeOptions: [SessionTag.SLOW_PROCESSING, SessionTag.NONE] })), isCx && !isRealGroup && (_jsx(SelectSession, { placeholder: t("select_status"), options: statusOptions, value: currentSessionStatus, onChange: (value) => handleUpdateSession(value, "status", value === currentSessionStatus) })), _jsx(SearchDrawer, {}), canViewMemberList && (_jsx(GroupMembersDrawer, { groupID: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID, conversationId: conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationID, currentSession: currentSession })), _jsx(MediaCollection, {}), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: onOpenThreadInfo, children: _jsx(Icon, { icon: "align-justify-o", size: 22 }) }), !!onClose && (_jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: onClose, children: _jsx(Icon, { icon: "close-b", size: 22 }) }))] })] }));
 };
 export default MessageHeader;

package/dist/components/message/MessageInfiniteScroll.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageInfiniteScroll.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageInfiniteScroll.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAEjF,MAAM,WAAW,0BAA0B;IACzC,SAAS,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC/B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,SAAS,EAAE,oBAAoB,CAAC;IAChC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACrD,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,QAAA,MAAM,qBAAqB,GAAI,6HAU5B,0BAA0B,4CAoC5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"MessageInfiniteScroll.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageInfiniteScroll.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAEjF,MAAM,WAAW,0BAA0B;IACzC,SAAS,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC/B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,SAAS,EAAE,oBAAoB,CAAC;IAChC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACrD,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,QAAA,MAAM,qBAAqB,GAAI,6HAU5B,0BAA0B,4CAqC5B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/message/MessageInfiniteScroll.js

@@ -3,5 +3,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Spin } from "antd";
 import clsx from "clsx";
 import InfiniteScroll from "react-infinite-scroll-component";
-const MessageInfiniteScroll = ({ scrollRef, scrollableTargetId, loadState, moreOldLoading = false, onLoadMoreOld, onScroll, children, empty, containerClassName, }) => (_jsx("div", { id: scrollableTargetId, ref: scrollRef, className: clsx("flex h-full flex-col-reverse overflow-x-hidden overflow-y-auto pb-3", containerClassName), children: empty && loadState.messageList.length === 0 ? (empty) : (_jsx(InfiniteScroll, { dataLength: loadState.messageList.length, next: onLoadMoreOld, className: "flex w-full min-w-0 flex-col-reverse", inverse: true, hasMore: loadState.hasMoreOld, loader: moreOldLoading ? (_jsx("div", { className: "flex w-full items-center justify-center py-2", children: _jsx(Spin, { size: "small" }) })) : (_jsx("span", { className: "sr-only" })), scrollableTarget: scrollableTargetId, onScroll: (e) => onScroll(e), children: children })) }));
+const MessageInfiniteScroll = ({ scrollRef, scrollableTargetId, loadState, moreOldLoading = false, onLoadMoreOld, onScroll, children, empty, containerClassName, }) => (_jsx("div", { id: scrollableTargetId, ref: scrollRef, className: clsx("flex h-full flex-col-reverse overflow-x-hidden overflow-y-auto pb-3", containerClassName), "data-cp-name": "MessageInfiniteScroll", children: empty && loadState.messageList.length === 0 ? (empty) : (_jsx(InfiniteScroll, { dataLength: loadState.messageList.length, next: onLoadMoreOld, className: "flex w-full min-w-0 flex-col-reverse", inverse: true, hasMore: loadState.hasMoreOld, loader: moreOldLoading ? (_jsx("div", { className: "flex w-full items-center justify-center py-2", children: _jsx(Spin, { size: "small" }) })) : (_jsx("span", { className: "sr-only" })), scrollableTarget: scrollableTargetId, onScroll: (e) => onScroll(e), children: children })) }));
 export default MessageInfiniteScroll;

package/dist/components/message/MessageList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"AAgCA,UAAU,gBAAgB;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CAgS3C,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/message/MessageList.tsx"],"names":[],"mappings":"AAgCA,UAAU,gBAAgB;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,QAAA,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CAqT3C,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/message/MessageList.js

@@ -22,7 +22,7 @@ import { usePinMessage } from "../../hooks/message/usePinMessage";
 import { useConversationSessionState } from "../../hooks/session/useConversationSessionState";
 import { useJoinGroupFlow } from "../../hooks/session/useJoinGroupFlow";
 import { useGroupPermission } from "../../hooks/group/useGroupPermission";
-import { isGroupSession } from "../../utils/imCommon";
+import { isGroupConversation } from "../../utils/imCommon";
 import { ConnectStatus, SessionStatus } from "../../types/chat";
 import PinLimitModal from "../../components/conversation-detail/PinLimitModal";
 import ConfirmModal from "../../components/common/ConfirmModal";
@@ -33,21 +33,30 @@ const MessageList = (props) => {
     const { onClose, conversationId, searchClientMsgID, openCreateCannedModal, onOpenThreadInfo, } = props;
     const conversationData = useConversationStore((state) => state.conversationData);
     const permissions = useGroupPermission(conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID);
-    const isGroupChat = isGroupSession(conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationType);
-    const currentGroupInfo = useConversationStore((state) => state.currentGroupInfo);
-    const currentMemberInGroup = useConversationStore((state) => state.currentMemberInGroup);
-    // Group/member data refetches async on conversation switch and can briefly
-    // hold the previous conversation's groupID or a not-yet-loaded roleLevel.
+    const isGroupChat = isGroupConversation(conversationData !== null && conversationData !== void 0 ? conversationData : undefined);
+    const groupID = conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID;
+    const currentGroupInfo = useConversationStore((state) => groupID ? state.currentGroupInfo.get(groupID) : undefined);
+    const currentMemberInGroup = useConversationStore((state) => groupID ? state.currentMemberInGroup.get(groupID) : undefined);
+    const isViewOnlyMember = useConversationStore((state) => state.isViewOnlyMember);
+    // "Fresh" now means "we have a cache entry for this groupID" — populated
+    // either by a fetch just now or a cache hit from earlier in the session,
+    // not necessarily a response that JUST arrived (that's the point of the
+    // groupID cache: no spinner on reopening a previously-viewed group).
+    const isGroupInfoFresh = currentGroupInfo !== undefined;
     const isGroupStateFresh = !isGroupChat ||
-        ((currentGroupInfo === null || currentGroupInfo === void 0 ? void 0 : currentGroupInfo.groupID) === (conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID) &&
-            (currentMemberInGroup === null || currentMemberInGroup === void 0 ? void 0 : currentMemberInGroup.groupID) === (conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID) &&
-            (currentMemberInGroup === null || currentMemberInGroup === void 0 ? void 0 : currentMemberInGroup.roleLevel) !== undefined);
+        (isGroupInfoFresh &&
+            (!currentMemberInGroup || currentMemberInGroup.roleLevel !== undefined));
     // Group-wide mute (GroupThreadInfo.tsx) restricts Normal members only.
     const isRestrictedByGroupMute = isGroupChat &&
         (currentGroupInfo === null || currentGroupInfo === void 0 ? void 0 : currentGroupInfo.status) === GroupStatus.Muted &&
         (currentMemberInGroup === null || currentMemberInGroup === void 0 ? void 0 : currentMemberInGroup.roleLevel) === GroupMemberRole.Normal;
-    const canSendMessage = !isGroupChat || (permissions.sendMessage && !isRestrictedByGroupMute);
-    const canPinMessage = !isGroupChat || permissions.pinMessage;
+    // useGroupPermission defaults to Normal-role (sendMessage: true) when
+    // currentMemberInGroup is undefined — wrong once we know it's absent
+    // for good, not just not-loaded-yet.
+    const isConfirmedNonMember = isGroupChat && isGroupInfoFresh && !currentMemberInGroup;
+    const canSendMessage = !isGroupChat ||
+        (!isConfirmedNonMember && permissions.sendMessage && !isRestrictedByGroupMute);
+    const canPinMessage = !isGroupChat || (!isConfirmedNonMember && permissions.pinMessage);
     const setQuotedMessage = useConversationStore((state) => state.setQuotedMessage);
     const setSearchClientMsgID = useConversationStore((state) => state.setSearchClientMsgID);
     const [openMenuId, setOpenMenuId] = useState(null);
@@ -61,6 +70,7 @@ const MessageList = (props) => {
     const { groupId, latestConversationSession, refetchConversationSessions, } = useConversationSessionState({
         conversationId,
         conversationType: conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationType,
+        peerType: conversationData === null || conversationData === void 0 ? void 0 : conversationData.peerType,
         groupId: conversationData === null || conversationData === void 0 ? void 0 : conversationData.groupID,
     });
     const { isJoined, isCheckingMembership, shouldRestrictToLastSession, joinGroup, isJoining, } = useJoinGroupFlow({
@@ -150,6 +160,6 @@ const MessageList = (props) => {
     if (!conversationData) {
         return (_jsx("div", { className: "flex flex-1 items-center justify-center h-full", children: connectStatus !== ConnectStatus.Connected ? (_jsx(Spin, {})) : (_jsx(Empty, { description: t("no_conversation_data") })) }));
     }
-    return (_jsxs("div", { className: "flex flex-col flex-1 relative h-full min-w-0 bg-white", style: { overflowX: "hidden" }, children: [_jsx(MessageHeader, { onClose: onClose, currentSession: latestConversationSession, isJoined: isJoined, onOpenThreadInfo: onOpenThreadInfo }), _jsx(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableMessagesDiv", loadState: loadState, moreOldLoading: moreOldLoading, onLoadMoreOld: loadMoreOldMessage, onScroll: handleInfiniteScroll, children: loadState.messageList.map((message, _, array) => (_jsx(MessageItem, { message: message, allMessages: array, contextMenuOpen: openMenuId === message.clientMsgID, onContextMenuOpenChange: (open) => setOpenMenuId(open ? message.clientMsgID : null), onRevokeMessage: handleOpenRevoke, onQuoteMessage: setQuotedMessage, onPressQuoteMessage: onPressQuoteMessage, onPinMessage: canPinMessage ? handlePinMessage : undefined, onUnpinMessage: canPinMessage ? handleUnpinMessage : undefined }, message.clientMsgID))) }), moreNewLoading && (_jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) })), isCheckingMembership || !isGroupStateFresh ? (_jsx("div", { className: "border-t bg-white py-4 flex items-center justify-center", children: _jsx(Spin, {}) })) : (latestConversationSession === null || latestConversationSession === void 0 ? void 0 : latestConversationSession.status) === SessionStatus.UNASSIGNED ? (_jsx(UnassignedSessionFooter, { sessionId: latestConversationSession.id, teamId: latestConversationSession.teamId })) : shouldRestrictToLastSession ? (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", children: [_jsx("p", { className: "text-sm text-gray-500", children: t("join_group_required") }), _jsx(Button, { type: "primary", onClick: joinGroup, loading: isJoining, children: t("join_group") })] })) : !canSendMessage ? (_jsx("div", { className: "border-t bg-[#f5f5f5] py-3 flex items-center justify-center", children: _jsx("p", { className: "text-sm text-gray-500", children: t(isRestrictedByGroupMute ? "send_message_disabled_group_mute" : "send_message_disabled") }) })) : (_jsx(MessageFooter, { currentSession: latestConversationSession, openCreateCannedModal: openCreateCannedModal })), _jsx(ConfirmModal, { open: showConfirmRevoke, onOk: onRevokeMessage, onCancel: handleCloseRevoke, title: t("revoke_message_confirm_title"), okText: t("revoke"), cancelText: t("cancel"), okType: "danger", confirmLoading: isRevoking, children: _jsx("p", { children: t("revoke_message_confirm_message") }) }), _jsx(PinLimitModal, { open: pinLimitModalOpen, max: pinnedTotalCount, onClose: () => setPinLimitModalOpen(false) })] }));
+    return (_jsxs("div", { className: "flex flex-col flex-1 relative h-full min-w-0 bg-white", style: { overflowX: "hidden" }, "data-cp-name": "MessageList", children: [_jsx(MessageHeader, { onClose: onClose, currentSession: latestConversationSession, isJoined: isJoined, onOpenThreadInfo: onOpenThreadInfo }), _jsx(MessageInfiniteScroll, { scrollRef: scrollRef, scrollableTargetId: "scrollableMessagesDiv", loadState: loadState, moreOldLoading: moreOldLoading, onLoadMoreOld: loadMoreOldMessage, onScroll: handleInfiniteScroll, children: loadState.messageList.map((message, _, array) => (_jsx(MessageItem, { message: message, allMessages: array, contextMenuOpen: openMenuId === message.clientMsgID, onContextMenuOpenChange: (open) => setOpenMenuId(open ? message.clientMsgID : null), onRevokeMessage: handleOpenRevoke, onQuoteMessage: setQuotedMessage, onPressQuoteMessage: onPressQuoteMessage, onPinMessage: canPinMessage ? handlePinMessage : undefined, onUnpinMessage: canPinMessage ? handleUnpinMessage : undefined }, message.clientMsgID))) }), moreNewLoading && (_jsx("div", { className: "flex items-center justify-center py-2", children: _jsx(Spin, {}) })), (isGroupChat && isCheckingMembership) || !isGroupStateFresh ? (_jsx("div", { className: "border-t bg-white py-4 flex items-center justify-center", children: _jsx(Spin, {}) })) : isViewOnlyMember ? (_jsx(MessageFooter, { currentSession: latestConversationSession, openCreateCannedModal: openCreateCannedModal })) : (latestConversationSession === null || latestConversationSession === void 0 ? void 0 : latestConversationSession.status) === SessionStatus.UNASSIGNED ? (_jsx(UnassignedSessionFooter, { sessionId: latestConversationSession.id, teamId: latestConversationSession.teamId })) : shouldRestrictToLastSession ? (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", children: [_jsx("p", { className: "text-sm text-gray-500", children: t("join_group_required") }), _jsx(Button, { type: "primary", onClick: joinGroup, loading: isJoining, children: t("join_group") })] })) : !canSendMessage ? (_jsx("div", { className: "border-t bg-[#f5f5f5] py-3 flex items-center justify-center", children: _jsx("p", { className: "text-sm text-gray-500", children: t(isRestrictedByGroupMute ? "send_message_disabled_group_mute" : "send_message_disabled") }) })) : (_jsx(MessageFooter, { currentSession: latestConversationSession, openCreateCannedModal: openCreateCannedModal })), _jsx(ConfirmModal, { open: showConfirmRevoke, onOk: onRevokeMessage, onCancel: handleCloseRevoke, title: t("revoke_message_confirm_title"), okText: t("revoke"), cancelText: t("cancel"), okType: "danger", confirmLoading: isRevoking, children: _jsx("p", { children: t("revoke_message_confirm_message") }) }), _jsx(PinLimitModal, { open: pinLimitModalOpen, max: pinnedTotalCount, onClose: () => setPinLimitModalOpen(false) })] }));
 };
 export default MessageList;

package/dist/components/message/SelectSession.js

@@ -14,7 +14,7 @@ const SelectSession = ({ options, value, onChange, excludeOptions, placeholder,
     const handleSelect = (val) => {
         onChange(val);
     };
-    return (_jsx("div", { className: "relative shrink-0", children: _jsx(Select, { className: `${selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.bgTintColorClassname} custom-select min-w-[100px]`, placement: "bottomLeft", placeholder: placeholder, options: selectOptions, value: selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value, onSelect: handleSelect, popupMatchSelectWidth: false, suffixIcon: _jsx(Icon, { icon: "angle-down-o", className: `${selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.tintColorClassname} mt-[2px]`, size: 14 }), menuItemSelectedIcon: null, labelRender: () => ["NONE", ""].includes(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value)
+    return (_jsx("div", { className: "relative shrink-0", "data-cp-name": "SelectSession", children: _jsx(Select, { className: `${selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.bgTintColorClassname} custom-select min-w-[100px]`, placement: "bottomLeft", placeholder: placeholder, options: selectOptions, value: selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value, onSelect: handleSelect, popupMatchSelectWidth: false, suffixIcon: _jsx(Icon, { icon: "angle-down-o", className: `${selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.tintColorClassname} mt-[2px]`, size: 14 }), menuItemSelectedIcon: null, labelRender: () => ["NONE", ""].includes(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value)
                 ? placeholder
                 : selectedOption
                     ? renderOptionLabel(selectedOption, true)

package/dist/components/message/UnassignedSessionFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UnassignedSessionFooter.d.ts","sourceRoot":"","sources":["../../../src/components/message/UnassignedSessionFooter.tsx"],"names":[],"mappings":"AASA,UAAU,4BAA4B;IACpC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,uBAAuB,GAAI,wBAG9B,4BAA4B,mDA2C9B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
+{"version":3,"file":"UnassignedSessionFooter.d.ts","sourceRoot":"","sources":["../../../src/components/message/UnassignedSessionFooter.tsx"],"names":[],"mappings":"AASA,UAAU,4BAA4B;IACpC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,uBAAuB,GAAI,wBAG9B,4BAA4B,mDA8C9B,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/dist/components/message/UnassignedSessionFooter.js

@@ -21,6 +21,6 @@ const UnassignedSessionFooter = ({ sessionId, teamId, }) => {
             antdMessage.error(t("manual_assign_failed"));
         }
     };
-    return (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", children: [_jsxs("div", { className: "flex items-center gap-1.5 text-amber-500", children: [_jsx(Icon, { icon: "user-del-o", size: 16 }), _jsx("p", { className: "text-sm text-gray-500", children: t("unassigned_thread_notice") })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { type: "primary", onClick: handleAssignToMe, loading: isAssigning, disabled: isAssigning, children: t("assign_to_me") }), _jsx(ManualAssignPopover, { sessionId: sessionId, teamId: teamId, excludeCurrentUser: true, children: _jsx(Button, { disabled: isAssigning, children: t("assign_to_others") }) })] })] }));
+    return (_jsxs("div", { className: "border-t bg-white py-4 flex flex-col items-center gap-2", "data-cp-name": "UnassignedSessionFooter", children: [_jsxs("div", { className: "flex items-center gap-1.5 text-amber-500", children: [_jsx(Icon, { icon: "user-del-o", size: 16 }), _jsx("p", { className: "text-sm text-gray-500", children: t("unassigned_thread_notice") })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { type: "primary", onClick: handleAssignToMe, loading: isAssigning, disabled: isAssigning, children: t("assign_to_me") }), _jsx(ManualAssignPopover, { sessionId: sessionId, teamId: teamId, excludeCurrentUser: true, children: _jsx(Button, { disabled: isAssigning, children: t("assign_to_others") }) })] })] }));
 };
 export default UnassignedSessionFooter;

package/dist/components/message/footer/ActionBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ActionBar.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ActionBar.tsx"],"names":[],"mappings":"AAsBA,QAAA,MAAM,SAAS,+CA+Gd,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"ActionBar.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ActionBar.tsx"],"names":[],"mappings":"AAuBA,QAAA,MAAM,SAAS,+CAiHd,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/components/message/footer/ActionBar.js

@@ -11,6 +11,7 @@ import { $isQuoteNode } from "@lexical/rich-text";
 import { useMessageFooterContext } from ".";
 import MediaActions from "./MediaActions";
 import useConversationStore from "../../../store/conversation";
+import { extractMentions } from "./mention/extractMentions";
 const ActionBar = () => {
     const [editor] = useLexicalComposerContext();
     const { onSendMessage, isInternal, listUploadFiles, setListUploadFiles } = useMessageFooterContext();
@@ -30,11 +31,13 @@ const ActionBar = () => {
             richText = $generateHtmlFromNodes(editor);
         });
         if (canSend) {
+            const mentions = extractMentions(editor);
             const sent = onSendMessage({
                 plainText,
                 richText,
                 type: listUploadFiles.length > 0 ? "file" : "text",
                 isInternal,
+                mentions,
             });
             if (!sent) {
                 return;
@@ -85,6 +88,6 @@ const ActionBar = () => {
             });
         });
     }, [editor]);
-    return (_jsxs("div", { className: "flex items-center justify-between px-4", children: [_jsx(MediaActions, { listUploadFiles: listUploadFiles, onFilesChange: setListUploadFiles, buttonClassName: "text-gray-500 w-8 h-8 p-0" }), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: handleSend, disabled: !canSend, children: _jsx(Icon, { icon: "send-b", size: 28, className: `${canSend ? "text-blue-500" : "text-gray-400"}` }) })] }));
+    return (_jsxs("div", { "data-cp-name": "ActionBar", className: "flex items-center justify-between px-4", children: [_jsx(MediaActions, { listUploadFiles: listUploadFiles, onFilesChange: setListUploadFiles, buttonClassName: "text-gray-500 w-8 h-8 p-0" }), _jsx(Button, { type: "text", shape: "default", className: "text-gray-500 w-8 h-8 p-0", onClick: handleSend, disabled: !canSend, children: _jsx(Icon, { icon: "send-b", size: 28, className: `${canSend ? "text-blue-500" : "text-gray-400"}` }) })] }));
 };
 export default ActionBar;

package/dist/components/message/footer/ComposerEditor.js

@@ -8,6 +8,6 @@ const ComposerEditor = ({ isInternal, placeholderText, }) => {
     const editorClasses = clsx("min-h-[64px] max-h-[140px] overflow-y-auto rounded-md border px-3 py-2 text-sm", isInternal
         ? "border-orange-300 bg-orange-50"
         : "border-indigo-500 bg-blue-100");
-    return (_jsx("div", { className: "px-4", children: _jsx("div", { className: "relative", children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: editorClasses }), ErrorBoundary: LexicalErrorBoundary, "aria-placeholder": placeholderText, placeholder: _jsx("div", { className: "absolute left-3 top-2 pointer-events-none", children: _jsx("p", { className: "text-gray-500 text-sm", children: placeholderText }) }) }) }) }));
+    return (_jsx("div", { "data-cp-name": "ComposerEditor", className: "px-4", children: _jsx("div", { className: "relative", children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: editorClasses }), ErrorBoundary: LexicalErrorBoundary, "aria-placeholder": placeholderText, placeholder: _jsx("div", { className: "absolute left-3 top-2 pointer-events-none", children: _jsx("p", { className: "text-gray-500 text-sm", children: placeholderText }) }) }) }) }));
 };
 export default ComposerEditor;

package/dist/components/message/footer/ComposerTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ComposerTabs.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ComposerTabs.tsx"],"names":[],"mappings":"AAOA,UAAU,iBAAiB;IACzB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,OAAO,CAAC;IACxB,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAeD,QAAA,MAAM,YAAY,GAAI,0EAMnB,iBAAiB,mDAoDnB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ComposerTabs.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/ComposerTabs.tsx"],"names":[],"mappings":"AAOA,UAAU,iBAAiB;IACzB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,OAAO,CAAC;IACxB,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAeD,QAAA,MAAM,YAAY,GAAI,0EAMnB,iBAAiB,mDAqDnB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/message/footer/ComposerTabs.js

@@ -31,7 +31,7 @@ const ComposerTabs = ({ canUseInternal, hintText, isInternal, lockToInternal, se
     if (!canUseInternal) {
         return null;
     }
-    return (_jsx(Tabs, { activeKey: String(isInternal), items: items, onChange: (value) => {
+    return (_jsx(Tabs, { "data-cp-name": "ComposerTabs", activeKey: String(isInternal), items: items, onChange: (value) => {
             if (lockToInternal && value !== "true") {
                 return;
             }

package/dist/components/message/footer/EmojiPicker.js

@@ -148,7 +148,7 @@ const EmojiPicker = ({ onEmojiSelect, onClose }) => {
             ],
         },
     };
-    return (_jsx("div", { className: "absolute bottom-full left-0 mb-2 bg-white border border-gray-200 rounded-xl shadow-lg w-96 z-50", children: _jsxs("div", { className: "p-3", children: [_jsxs("div", { className: "flex items-center justify-between mb-3", children: [_jsx("h3", { className: "font-medium text-gray-900", children: t("choose_emoji") }), _jsx("button", { onClick: onClose, className: "text-gray-400 hover:text-gray-600 text-xl", children: "\u00D7" })] }), _jsx("div", { className: "flex gap-1 mb-3", children: Object.entries(emojiCategories).map(([key, category]) => (_jsx("button", { onClick: () => setActiveCategory(key), className: `px-3 py-1 text-xs rounded-full transition-colors ${activeCategory === key
+    return (_jsx("div", { "data-cp-name": "EmojiPicker", className: "absolute bottom-full left-0 mb-2 bg-white border border-gray-200 rounded-xl shadow-lg w-96 z-50", children: _jsxs("div", { className: "p-3", children: [_jsxs("div", { className: "flex items-center justify-between mb-3", children: [_jsx("h3", { className: "font-medium text-gray-900", children: t("choose_emoji") }), _jsx("button", { onClick: onClose, className: "text-gray-400 hover:text-gray-600 text-xl", children: "\u00D7" })] }), _jsx("div", { className: "flex gap-1 mb-3", children: Object.entries(emojiCategories).map(([key, category]) => (_jsx("button", { onClick: () => setActiveCategory(key), className: `px-3 py-1 text-xs rounded-full transition-colors ${activeCategory === key
                             ? "bg-blue-100 text-blue-600"
                             : "text-gray-500 hover:text-gray-700"}`, children: category.name }, key))) }), _jsx("div", { className: "grid grid-cols-8 gap-1 max-h-48 overflow-y-auto", children: emojiCategories[activeCategory].emojis.map((emoji, index) => (_jsx("button", { onClick: () => onEmojiSelect(emoji), className: "p-2 text-xl hover:bg-gray-100 rounded-lg transition-colors", children: emoji }, index))) })] }) }));
 };

package/dist/components/message/footer/EnterHandler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EnterHandler.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/EnterHandler.tsx"],"names":[],"mappings":"AAuBA,MAAM,CAAC,OAAO,UAAU,YAAY,SAsInC"}
+{"version":3,"file":"EnterHandler.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/EnterHandler.tsx"],"names":[],"mappings":"AAwBA,MAAM,CAAC,OAAO,UAAU,YAAY,SAgJnC"}

package/dist/components/message/footer/EnterHandler.js

@@ -8,13 +8,19 @@ import { $isQuoteNode } from "@lexical/rich-text";
 import { useMessageFooterContext } from ".";
 import useConversationStore from "../../../store/conversation";
 import emitter, { emit } from "../../../utils/events";
+import { extractMentions } from "./mention/extractMentions";
 export default function EnterHandler() {
     const [editor] = useLexicalComposerContext();
-    const { onSendMessage, isInternal, listUploadFiles, isOpenCanned, activeCannedIndex, } = useMessageFooterContext();
+    const { onSendMessage, isInternal, listUploadFiles, isOpenCanned, activeCannedIndex, isMentionMenuOpen, } = useMessageFooterContext();
     const shiftEnterCount = useRef(0);
     const quotedMessage = useConversationStore((state) => state.quotedMessage);
     useEffect(() => {
         return editor.registerCommand(KEY_ENTER_COMMAND, (event) => {
+            // Mention dropdown owns Enter while open (COMMAND_PRIORITY_LOW) —
+            // must not preventDefault/consume here or it never gets a turn.
+            if (isMentionMenuOpen) {
+                return false;
+            }
             // Case 1: Enter (submit, chặn xuống dòng)
             if (!event.shiftKey) {
                 event.preventDefault();
@@ -35,11 +41,13 @@ export default function EnterHandler() {
                 const hasQuote = !!(quotedMessage === null || quotedMessage === void 0 ? void 0 : quotedMessage.clientMsgID);
                 const canSend = hasQuote ? hasText : hasText || hasFiles;
                 if (canSend) {
+                    const mentions = extractMentions(editor);
                     const sent = onSendMessage({
                         plainText,
                         richText,
                         type: hasFiles ? "file" : "text",
                         isInternal,
+                        mentions,
                     });
                     if (!sent) {
                         return true;
@@ -97,6 +105,7 @@ export default function EnterHandler() {
         isInternal,
         isOpenCanned,
         activeCannedIndex,
+        isMentionMenuOpen,
     ]);
     useEffect(() => {
         const clearEditor = () => {

package/dist/components/message/footer/FilePreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilePreview.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/FilePreview.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AA6IlC,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,YAAY,GACb,EAAE;IACD,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,kDAsBA;AAED,QAAA,MAAM,WAAW,+CAQhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"FilePreview.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/FilePreview.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AA8IlC,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,YAAY,GACb,EAAE;IACD,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B,kDAsBA;AAED,QAAA,MAAM,WAAW,+CAQhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/message/footer/FilePreview.js

@@ -25,7 +25,7 @@ const getFileType = (file) => {
         return "video";
     return "image";
 };
-const RemoveButton = ({ file, onRemove }) => (_jsx("button", { type: "button", onClick: () => onRemove(file), className: "absolute -right-1 -top-1 flex h-5 w-5 items-center justify-center rounded-full bg-gray-900", "aria-label": "X\u00F3a", children: _jsx(Icon, { icon: "close-o", size: 12, className: "text-white" }) }));
+const RemoveButton = ({ file, onRemove }) => (_jsx("button", { type: "button", "data-cp-name": "RemoveButton", onClick: () => onRemove(file), className: "absolute -right-1 -top-1 flex h-5 w-5 items-center justify-center rounded-full bg-gray-900", "aria-label": "X\u00F3a", children: _jsx(Icon, { icon: "close-o", size: 12, className: "text-white" }) }));
 const MediaThumb = ({ file, onRemove, onVideoReady }) => {
     var _a;
     const [src, setSrc] = useState("");
@@ -48,18 +48,18 @@ const MediaThumb = ({ file, onRemove, onVideoReady }) => {
         setDuration(event.currentTarget.duration);
         onVideoReady === null || onVideoReady === void 0 ? void 0 : onVideoReady();
     };
-    return (_jsxs("div", { className: "relative h-12 w-12 shrink-0", children: [isVideo ? (_jsx("video", { src: src, className: "h-12 w-12 rounded-lg object-cover", preload: "metadata", muted: true, onLoadedMetadata: handleLoadedMetadata })) : (_jsx("img", { src: src, alt: file.name, className: "h-12 w-12 rounded-lg object-cover" })), isLoading && (_jsx("div", { className: "absolute inset-0 flex items-center justify-center rounded-lg bg-black/60", children: _jsxs("span", { className: "text-xs font-semibold text-white", children: [percent, "%"] }) })), isVideo && duration !== null && (_jsx("div", { className: "absolute bottom-1 left-1/2 flex w-9 -translate-x-1/2 items-center justify-center rounded-xl bg-black/70 px-1 text-center text-[10px] font-normal leading-4 text-white", children: formatDuration(duration) })), _jsx(RemoveButton, { file: file, onRemove: onRemove })] }));
+    return (_jsxs("div", { "data-cp-name": "MediaThumb", className: "relative h-12 w-12 shrink-0", children: [isVideo ? (_jsx("video", { src: src, className: "h-12 w-12 rounded-lg object-cover", preload: "metadata", muted: true, onLoadedMetadata: handleLoadedMetadata })) : (_jsx("img", { src: src, alt: file.name, className: "h-12 w-12 rounded-lg object-cover" })), isLoading && (_jsx("div", { className: "absolute inset-0 flex items-center justify-center rounded-lg bg-black/60", children: _jsxs("span", { className: "text-xs font-semibold text-white", children: [percent, "%"] }) })), isVideo && duration !== null && (_jsx("div", { className: "absolute bottom-1 left-1/2 flex w-9 -translate-x-1/2 items-center justify-center rounded-xl bg-black/70 px-1 text-center text-[10px] font-normal leading-4 text-white", children: formatDuration(duration) })), _jsx(RemoveButton, { file: file, onRemove: onRemove })] }));
 };
 const DocumentCard = ({ file, onRemove }) => {
     var _a, _b;
     const isLoading = file.status === "uploading";
     const percent = Math.round((_a = file.percent) !== null && _a !== void 0 ? _a : 0);
-    return (_jsxs("div", { className: "relative flex h-12 w-40 shrink-0 items-center gap-[7px] rounded-lg bg-chat-bubble-neutral/10 py-[4px] pl-2 pr-5", children: [_jsx("div", { className: "flex h-full w-8 shrink-0 items-center justify-center overflow-hidden [&>svg]:h-8 [&>svg]:w-8", children: documentIcon }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "truncate text-[11px] font-normal leading-[160%] text-gray-900", children: shortenFileName(file.name) }), isLoading ? (_jsxs("span", { className: "text-[10px] leading-[160%] tracking-[0.1px] text-gray-400", children: [percent, "%"] })) : (_jsx("span", { className: "text-[10px] leading-[160%] tracking-[0.1px] text-gray-400", children: formatFileSize((_b = file.size) !== null && _b !== void 0 ? _b : 0) }))] }), _jsx(RemoveButton, { file: file, onRemove: onRemove })] }));
+    return (_jsxs("div", { "data-cp-name": "DocumentCard", className: "relative flex h-12 w-40 shrink-0 items-center gap-[7px] rounded-lg bg-chat-bubble-neutral/10 py-[4px] pl-2 pr-5", children: [_jsx("div", { className: "flex h-full w-8 shrink-0 items-center justify-center overflow-hidden [&>svg]:h-8 [&>svg]:w-8", children: documentIcon }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "truncate text-[11px] font-normal leading-[160%] text-gray-900", children: shortenFileName(file.name) }), isLoading ? (_jsxs("span", { className: "text-[10px] leading-[160%] tracking-[0.1px] text-gray-400", children: [percent, "%"] })) : (_jsx("span", { className: "text-[10px] leading-[160%] tracking-[0.1px] text-gray-400", children: formatFileSize((_b = file.size) !== null && _b !== void 0 ? _b : 0) }))] }), _jsx(RemoveButton, { file: file, onRemove: onRemove })] }));
 };
 export function FilePreviewList({ files, onRemove, onVideoReady, }) {
     if (files.length === 0)
         return null;
-    return (_jsx("div", { className: "flex items-center gap-3 self-stretch overflow-x-auto px-2 pb-2 pt-3", children: files.map((file) => {
+    return (_jsx("div", { "data-cp-name": "FilePreviewList", className: "flex items-center gap-3 self-stretch overflow-x-auto px-2 pb-2 pt-3", children: files.map((file) => {
             if (getFileType(file) === "document") {
                 return (_jsx(DocumentCard, { file: file, onRemove: onRemove }, file.uid));
             }

package/dist/components/message/footer/LinkInputPreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LinkInputPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/LinkInputPreview.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,qBAAqB;IACpC,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,gBAAgB,GAAI,mBAAmB,qBAAqB,4CAoEjE,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"LinkInputPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/LinkInputPreview.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,qBAAqB;IACpC,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,gBAAgB,GAAI,mBAAmB,qBAAqB,4CAqEjE,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/message/footer/LinkInputPreview.js

@@ -11,6 +11,6 @@ const LinkInputPreview = ({ url, onRemove }) => {
     const handleOpen = () => {
         openLink(url, t);
     };
-    return (_jsxs("div", { "data-testid": "link-input-preview", className: "flex w-full shrink-0 items-center gap-2 overflow-hidden bg-blue-25 pr-2", children: [_jsxs("button", { type: "button", onClick: handleOpen, className: "flex min-w-0 flex-1 items-center gap-2 py-0 pl-0 text-left", children: [_jsx("div", { className: "flex h-[51px] w-[51px] shrink-0 items-center justify-center overflow-hidden bg-blue-25", children: isLoading ? (_jsx("div", { className: "h-5 w-5 animate-spin rounded-full border-2 border-primary-400 border-t-transparent" })) : (data === null || data === void 0 ? void 0 : data.image) ? (_jsx("img", { src: data.image, alt: "", className: "h-full w-full object-cover" })) : (_jsx(Icon, { icon: "link-alt-b", size: 24, className: "text-primary-400" })) }), _jsxs("div", { className: "min-w-0 flex-1", children: [isLoading ? (_jsx("p", { className: "truncate text-[14px] font-medium leading-[1.6] text-gray-900", children: t("link_preview.loading") })) : (_jsxs(_Fragment, { children: [_jsx("p", { className: "truncate text-[14px] font-medium leading-[1.6] text-gray-900", children: (data === null || data === void 0 ? void 0 : data.title) || getHostLabel(url) }), ((data === null || data === void 0 ? void 0 : data.description) || !(data === null || data === void 0 ? void 0 : data.title)) && (_jsx("p", { className: "truncate text-[13px] leading-[1.6] text-gray-400", children: (data === null || data === void 0 ? void 0 : data.description) || getHostLabel(url) }))] })), isError && !isLoading && (_jsx("p", { className: "truncate text-[13px] leading-[1.6] text-gray-400", children: getHostLabel(url) }))] })] }), _jsx("button", { type: "button", onClick: onRemove, "data-testid": "link-input-preview-remove", className: "flex h-4 w-4 shrink-0 items-center justify-center", "aria-label": t("link_preview.remove"), children: _jsx(Icon, { icon: "close-b", size: 16, className: "text-gray-900" }) })] }));
+    return (_jsxs("div", { "data-testid": "link-input-preview", "data-cp-name": "LinkInputPreview", className: "flex w-full shrink-0 items-center gap-2 overflow-hidden bg-blue-25 pr-2", children: [_jsxs("button", { type: "button", onClick: handleOpen, className: "flex min-w-0 flex-1 items-center gap-2 py-0 pl-0 text-left", children: [_jsx("div", { className: "flex h-[51px] w-[51px] shrink-0 items-center justify-center overflow-hidden bg-blue-25", children: isLoading ? (_jsx("div", { className: "h-5 w-5 animate-spin rounded-full border-2 border-primary-400 border-t-transparent" })) : (data === null || data === void 0 ? void 0 : data.image) ? (_jsx("img", { src: data.image, alt: "", className: "h-full w-full object-cover" })) : (_jsx(Icon, { icon: "link-alt-b", size: 24, className: "text-primary-400" })) }), _jsxs("div", { className: "min-w-0 flex-1", children: [isLoading ? (_jsx("p", { className: "truncate text-[14px] font-medium leading-[1.6] text-gray-900", children: t("link_preview.loading") })) : (_jsxs(_Fragment, { children: [_jsx("p", { className: "truncate text-[14px] font-medium leading-[1.6] text-gray-900", children: (data === null || data === void 0 ? void 0 : data.title) || getHostLabel(url) }), ((data === null || data === void 0 ? void 0 : data.description) || !(data === null || data === void 0 ? void 0 : data.title)) && (_jsx("p", { className: "truncate text-[13px] leading-[1.6] text-gray-400", children: (data === null || data === void 0 ? void 0 : data.description) || getHostLabel(url) }))] })), isError && !isLoading && (_jsx("p", { className: "truncate text-[13px] leading-[1.6] text-gray-400", children: getHostLabel(url) }))] })] }), _jsx("button", { type: "button", onClick: onRemove, "data-testid": "link-input-preview-remove", className: "flex h-4 w-4 shrink-0 items-center justify-center", "aria-label": t("link_preview.remove"), children: _jsx(Icon, { icon: "close-b", size: 16, className: "text-gray-900" }) })] }));
 };
 export default LinkInputPreview;

package/dist/components/message/footer/MediaActions.js

@@ -97,5 +97,5 @@ export default function MediaActions({ listUploadFiles, onFilesChange, buttonCla
         return () => document.removeEventListener("mousedown", handleClickOutside);
     }, []);
     const btnClass = buttonClassName !== null && buttonClassName !== void 0 ? buttonClassName : "w-8 h-8 p-0 text-gray-500 hover:text-gray-700 hover:bg-gray-100";
-    return (_jsxs("div", { className: "flex items-center gap-1 relative", ref: containerRef, children: [isCrm && (_jsx(Button, { type: "text", shape: "default", className: clsx(btnClass, isOpenCanned && "bg-blue-100 text-blue-600"), onClick: onPressCanned, children: _jsx(CannedResponseIcon, { className: clsx("hover:text-gray-700", isOpenCanned && "text-blue-600") }) })), _jsx(Button, { type: "text", shape: "default", className: clsx(btnClass, showEmojiPicker && "bg-blue-100 text-blue-600"), onClick: () => setShowEmojiPicker(!showEmojiPicker), children: EmojiIcon }), showMediaUpload && (_jsxs(_Fragment, { children: [_jsx(Upload, { accept: "image/jpeg, image/png, image/jpg, video/*", beforeUpload: beforeUploadImagesAndVideo, multiple: true, onChange: handleChange, showUploadList: false, fileList: listUploadFiles, children: _jsx(Button, { type: "text", shape: "default", className: btnClass, children: _jsx(Icon, { icon: "image-02-o", size: 22 }) }) }), _jsx(Upload, { accept: ".doc,.docx,.pdf", beforeUpload: beforeUploadFile, onChange: handleChange, showUploadList: false, fileList: listUploadFiles, children: _jsx(Button, { type: "text", shape: "default", className: btnClass, children: AttachIcon }) })] })), showEmojiPicker && (_jsx(EmojiPicker, { onEmojiSelect: handleEmojiSelect, onClose: () => setShowEmojiPicker(false) }))] }));
+    return (_jsxs("div", { "data-cp-name": "MediaActions", className: "flex items-center gap-1 relative", ref: containerRef, children: [isCrm && (_jsx(Button, { type: "text", shape: "default", className: clsx(btnClass, isOpenCanned && "bg-blue-100 text-blue-600"), onClick: onPressCanned, children: _jsx(CannedResponseIcon, { className: clsx("hover:text-gray-700", isOpenCanned && "text-blue-600") }) })), _jsx(Button, { type: "text", shape: "default", className: clsx(btnClass, showEmojiPicker && "bg-blue-100 text-blue-600"), onClick: () => setShowEmojiPicker(!showEmojiPicker), children: EmojiIcon }), showMediaUpload && (_jsxs(_Fragment, { children: [_jsx(Upload, { accept: "image/jpeg, image/png, image/jpg, video/*", beforeUpload: beforeUploadImagesAndVideo, multiple: true, onChange: handleChange, showUploadList: false, fileList: listUploadFiles, children: _jsx(Button, { type: "text", shape: "default", className: btnClass, children: _jsx(Icon, { icon: "image-02-o", size: 22 }) }) }), _jsx(Upload, { accept: ".doc,.docx,.pdf", beforeUpload: beforeUploadFile, onChange: handleChange, showUploadList: false, fileList: listUploadFiles, children: _jsx(Button, { type: "text", shape: "default", className: btnClass, children: AttachIcon }) })] })), showEmojiPicker && (_jsx(EmojiPicker, { onEmojiSelect: handleEmojiSelect, onClose: () => setShowEmojiPicker(false) }))] }));
 }

package/dist/components/message/footer/SessionClosedModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SessionClosedModal.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/SessionClosedModal.tsx"],"names":[],"mappings":"AAKA,UAAU,uBAAuB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,kBAAkB,GAAI,oDAMzB,uBAAuB,4CAmDzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"SessionClosedModal.d.ts","sourceRoot":"","sources":["../../../../src/components/message/footer/SessionClosedModal.tsx"],"names":[],"mappings":"AAKA,UAAU,uBAAuB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,kBAAkB,GAAI,oDAMzB,uBAAuB,4CAoDzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/message/footer/SessionClosedModal.js

@@ -4,6 +4,6 @@ import { Modal, Button } from "antd";
 import { useTranslation } from "react-i18next";
 const SessionClosedModal = ({ open, loading, onReopen, onCreateNew, onClose, }) => {
     const { t } = useTranslation();
-    return (_jsx(Modal, { open: open, onCancel: onClose, footer: null, closable: !loading, centered: true, width: 400, maskClosable: !loading, keyboard: !loading, forceRender: true, children: _jsxs("div", { className: "flex flex-col gap-4 pt-2", role: "alertdialog", "aria-label": t("session_closed_modal_title"), children: [_jsx("p", { className: "text-base font-semibold", children: t("session_closed_modal_title") }), _jsx("p", { className: "text-sm text-gray-600", children: t("session_closed_modal_description") }), _jsxs("div", { className: "flex gap-3 w-full", children: [_jsx(Button, { type: "primary", className: "flex-1", size: "large", onClick: onReopen, loading: loading, disabled: loading, children: t("session_closed_modal_reopen") }), _jsx(Button, { type: "primary", className: "flex-1", size: "large", onClick: onCreateNew, loading: loading, disabled: loading, children: t("session_closed_modal_create_new") })] })] }) }));
+    return (_jsx(Modal, { "data-cp-name": "SessionClosedModal", open: open, onCancel: onClose, footer: null, closable: !loading, centered: true, width: 400, maskClosable: !loading, keyboard: !loading, forceRender: true, children: _jsxs("div", { className: "flex flex-col gap-4 pt-2", role: "alertdialog", "aria-label": t("session_closed_modal_title"), children: [_jsx("p", { className: "text-base font-semibold", children: t("session_closed_modal_title") }), _jsx("p", { className: "text-sm text-gray-600", children: t("session_closed_modal_description") }), _jsxs("div", { className: "flex gap-3 w-full", children: [_jsx(Button, { type: "primary", className: "flex-1", size: "large", onClick: onReopen, loading: loading, disabled: loading, children: t("session_closed_modal_reopen") }), _jsx(Button, { type: "primary", className: "flex-1", size: "large", onClick: onCreateNew, loading: loading, disabled: loading, children: t("session_closed_modal_create_new") })] })] }) }));
 };
 export default SessionClosedModal;

package/dist/components/message/footer/ToolbarPlugin.js

@@ -153,7 +153,7 @@ export const ToolbarPlugin = () => {
             removeSelectionListener();
         };
     }, [editor]);
-    return (_jsxs("div", { className: "flex items-center gap-2 px-4 pt-1", children: [formatTextButtons.map((button) => {
+    return (_jsxs("div", { "data-cp-name": "ToolbarPlugin", className: "flex items-center gap-2 px-4 pt-1", children: [formatTextButtons.map((button) => {
                 const { icon, onPress, key, isActive } = button;
                 return (_jsx(Button, { type: "text", shape: "default", className: getButtonClasses(isActive), onClick: onPress, children: icon }, key));
             }), insertListButtons.map((button) => {