stream-chat-react 14.8.0 → 14.10.0

package/dist/cjs/{useChannelHeaderOnlineStatus.72753090.js → useChannelHeaderOnlineStatus.6ace991c.js}

@@ -535,16 +535,19 @@ var getInitials = (name) => {
 /**
 * A round avatar image with fallback to username's first letter
 */
-var Avatar = ({ className, FallbackIcon = require_useNotificationApi.IconUser, imageUrl, isOnline, size, userName, ...rest }) => {
+var Avatar = ({ className, FallbackIcon = require_useNotificationApi.IconUser, imageUrl, initials: customInitials, isOnline, size, userName, ...rest }) => {
 	const [error, setError] = (0, react.useState)(false);
 	(0, react.useEffect)(() => () => setError(false), [imageUrl]);
-	const nameString = userName?.toString() || "";
-	const avatarImageAlt = nameString.trim();
+	const nameString = userName?.toString().trim() || "";
 	const sizeAwareInitials = (0, react.useMemo)(() => {
-		const initials = getInitials(nameString);
+		const initials = customInitials || getInitials(nameString);
 		if (size === "sm" || size === "xs") return initials.charAt(0);
 		return initials;
-	}, [nameString, size]);
+	}, [
+		nameString,
+		size,
+		customInitials
+	]);
 	const showImage = typeof imageUrl === "string" && imageUrl && !error;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: (0, clsx.default)(`str-chat__avatar`, className, {
@@ -561,7 +564,7 @@ var Avatar = ({ className, FallbackIcon = require_useNotificationApi.IconUser, i
 			"str-chat__avatar-status-badge--offline": !isOnline,
 			"str-chat__avatar-status-badge--online": isOnline
 		}) }), showImage ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
-			alt: avatarImageAlt,
+			alt: nameString,
 			className: "str-chat__avatar-image",
 			"data-testid": "avatar-img",
 			onError: () => setError(true),
@@ -719,21 +722,24 @@ var BaseContextMenuButton = ({ children, className, details, hasSubMenu, Icon, l
 		!!hasSubMenu && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SubmenuIcon, { className: "str-chat__context-menu__button__submenu-icon" })
 	]
 });
-var UserContextMenuButton = ({ children, className, imageUrl, role = "menuitem", userName, ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-	...props,
-	className: (0, clsx.default)("str-chat__context-menu__button str-chat__user-context-menu__button", className),
-	role,
-	type: "button",
-	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Avatar, {
-		"aria-hidden": true,
-		imageUrl,
-		size: "sm",
-		userName
-	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: "str-chat__context-menu__button__label",
-		children: children ?? userName
-	})]
-});
+var UserContextMenuButton = ({ children, className, imageUrl, role = "menuitem", userName, ...props }) => {
+	const { Avatar: Avatar$1 = Avatar } = require_useNotificationApi.useComponentContext();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		...props,
+		className: (0, clsx.default)("str-chat__context-menu__button str-chat__user-context-menu__button", className),
+		role,
+		type: "button",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Avatar$1, {
+			"aria-hidden": true,
+			imageUrl,
+			size: "sm",
+			userName
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "str-chat__context-menu__button__label",
+			children: children ?? userName
+		})]
+	});
+};
 var EmojiContextMenuButton = ({ children, className, emoji, label, role = "menuitem", ...props }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 	...props,
 	className: (0, clsx.default)("str-chat__context-menu__button str-chat__emoji-context-menu__button", className),
@@ -1489,6 +1495,13 @@ var GlobalModal = ({ "aria-describedby": ariaDescribedby, "aria-label": ariaLabe
 	});
 };
 //#endregion
+//#region src/components/Avatar/utils.ts
+var extractDisplayInfo = ({ user }) => ({
+	id: user?.id,
+	imageUrl: user?.image,
+	userName: user?.name
+});
+//#endregion
 //#region src/components/Message/renderText/remarkPlugins/htmlToTextPlugin.ts
 var visitor = (node) => {
 	if (node.type !== "html") return;
@@ -3265,10 +3278,7 @@ var getGroupChannelDisplayInfo = (channel) => {
 	for (const member of members) {
 		const { user } = member;
 		if (!user?.name && !user?.image) continue;
-		memberList.push({
-			imageUrl: user.image,
-			userName: user.name
-		});
+		memberList.push(extractDisplayInfo(member));
 	}
 	return { members: memberList };
 };
@@ -4255,6 +4265,12 @@ Object.defineProperty(exports, "createRovingFocusKeyDownHandler", {
 		return createRovingFocusKeyDownHandler;
 	}
 });
+Object.defineProperty(exports, "extractDisplayInfo", {
+	enumerable: true,
+	get: function() {
+		return extractDisplayInfo;
+	}
+});
 Object.defineProperty(exports, "formatTime", {
 	enumerable: true,
 	get: function() {
@@ -4466,4 +4482,4 @@ Object.defineProperty(exports, "useStableCallback", {
 	}
 });
 
-//# sourceMappingURL=useChannelHeaderOnlineStatus.72753090.js.map
+//# sourceMappingURL=useChannelHeaderOnlineStatus.6ace991c.js.map