@linktr.ee/messaging-react 4.2.1-rc-1787325541 → 4.2.1

package/dist/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-BQCvCIsC.cjs");exports.ActionButton=e.ActionButton;exports.Avatar=e.Avatar;exports.ChannelEmptyState=e.ChannelEmptyState;exports.ChannelList=e.ChannelList;exports.ChannelView=e.ChannelView;exports.CustomMessageProvider=e.CustomMessageProvider;exports.FaqList=e.FaqList;exports.FaqListItem=e.FaqListItem;exports.LinkAttachment=e.LinkAttachment;exports.LockedAttachment=e.LockedAttachment;exports.MediaMessage=e.MediaMessage;exports.MessageAttachment=e.MessageAttachment;exports.MessageBubble=e.MessageBubble;exports.MessagingProvider=e.MessagingProvider;exports.MessagingShell=e.MessagingShell;exports.RichCard=e.RichCard;exports.TipMessage=e.TipMessage;exports.buildCompactMetaLabel=e.buildCompactMetaLabel;exports.formatFileSize=e.formatFileSize;exports.formatRelativeTime=e.formatRelativeTime;exports.getFileExtensionLabel=e.getFileExtensionLabel;exports.getMessageDisplayText=e.getMessageDisplayText;exports.isLinkAttachment=e.isLinkAttachment;exports.isTipMessage=e.isTipMessage;exports.isUuidLike=e.isUuidLike;exports.messageAttachmentGroupPositionFromStream=e.bubbleGroupPositionFromStream;exports.normalizeLanguageCode=e.normalizeLanguageCode;exports.optimizeMessagingAttachmentUrl=e.optimizeMessagingAttachmentUrl;exports.resolveConversationParticipant=e.resolveConversationParticipant;exports.resolveLinkAttachment=e.resolveLinkAttachment;exports.resolveMediaFromMessage=e.resolveMediaFromMessage;exports.resolveParticipantDisplayName=e.resolveParticipantDisplayName;exports.useComposerLocked=e.useComposerLocked;exports.useCustomMessage=e.useCustomMessage;exports.useMessaging=e.useMessaging;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-Cd-uS2hf.cjs");exports.ActionButton=e.ActionButton;exports.Avatar=e.Avatar;exports.ChannelEmptyState=e.ChannelEmptyState;exports.ChannelList=e.ChannelList;exports.ChannelView=e.ChannelView;exports.CustomMessageProvider=e.CustomMessageProvider;exports.FaqList=e.FaqList;exports.FaqListItem=e.FaqListItem;exports.LinkAttachment=e.LinkAttachment;exports.LockedAttachment=e.LockedAttachment;exports.MediaMessage=e.MediaMessage;exports.MessageAttachment=e.MessageAttachment;exports.MessageBubble=e.MessageBubble;exports.MessagingLoggerProvider=e.MessagingLoggerProvider;exports.MessagingProvider=e.MessagingProvider;exports.MessagingShell=e.MessagingShell;exports.RichCard=e.RichCard;exports.TipMessage=e.TipMessage;exports.buildCompactMetaLabel=e.buildCompactMetaLabel;exports.formatFileSize=e.formatFileSize;exports.formatRelativeTime=e.formatRelativeTime;exports.getFileExtensionLabel=e.getFileExtensionLabel;exports.getMessageDisplayText=e.getMessageDisplayText;exports.isLinkAttachment=e.isLinkAttachment;exports.isTipMessage=e.isTipMessage;exports.isUuidLike=e.isUuidLike;exports.messageAttachmentGroupPositionFromStream=e.bubbleGroupPositionFromStream;exports.normalizeLanguageCode=e.normalizeLanguageCode;exports.optimizeMessagingAttachmentUrl=e.optimizeMessagingAttachmentUrl;exports.resolveConversationParticipant=e.resolveConversationParticipant;exports.resolveLinkAttachment=e.resolveLinkAttachment;exports.resolveMediaFromMessage=e.resolveMediaFromMessage;exports.resolveParticipantDisplayName=e.resolveParticipantDisplayName;exports.useComposerLocked=e.useComposerLocked;exports.useCustomMessage=e.useCustomMessage;exports.useMessaging=e.useMessaging;exports.useMessagingLogger=e.useMessagingLogger;
 //# sourceMappingURL=index.cjs.map

package/dist/index.d.ts

@@ -13,6 +13,7 @@ import { FC } from 'react';
 import { InfiniteScrollProps } from 'stream-chat-react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { LocalMessage } from 'stream-chat';
+import { Logger } from '@linktr.ee/messaging-core';
 import { MessageCustomType } from '@linktr.ee/messaging-taxonomy';
 import { MessagingUser } from '@linktr.ee/messaging-core';
 import { OfficialCtaActionKind } from '@linktr.ee/messaging-taxonomy';
@@ -872,6 +873,8 @@ export declare interface LockedAttachmentSource {
     thumbnailUrl?: string;
 }
 
+export { Logger }
+
 declare interface MediaCardBaseProps {
     /** Attachment title. */
     title?: string;
@@ -1442,6 +1445,16 @@ declare interface MessagingContextValue {
     debug: boolean;
 }
 
+/**
+ * Provides the resolved logger sink to the messaging subtree. Rendered by
+ * `MessagingProvider`; usable standalone in tests or in a subtree that needs a
+ * different sink.
+ */
+export declare const MessagingLoggerProvider: default_2.FC<{
+    logger?: Logger;
+    children: default_2.ReactNode;
+}>;
+
 /**
  * Provider component that wraps messaging-core with React state management
  */
@@ -1463,6 +1476,13 @@ declare interface MessagingProviderBaseProps {
     user: MessagingUser | null;
     capabilities?: MessagingCapabilities;
     debug?: boolean;
+    /**
+     * Optional sink for the package's own log output. Levels left undefined fall
+     * back to console, which is also the default when the prop is omitted. In
+     * apiKey mode it is forwarded to the underlying StreamChatService unless
+     * `serviceConfig.logger` is set, which wins.
+     */
+    logger?: Logger;
 }
 
 /**
@@ -1825,6 +1845,12 @@ export declare function useCustomMessage<K extends keyof CustomMessageRegistry>(
  */
 export declare const useMessaging: () => MessagingContextValue;
 
+/**
+ * The logger sink for the current subtree. Falls back to console when no
+ * provider (or no `logger` prop) is present, so call sites never branch.
+ */
+export declare const useMessagingLogger: () => Required<Logger>;
+
 declare interface VideoAttachmentSharedProps extends MessageAttachmentBaseProps {
     /** Single video — convenience for the most common case. */
     src?: string;

package/dist/index.js

@@ -1,39 +1,41 @@
-import { a as e, b as t, C as i, c as n, d as o, e as m, F as r, f as g, L as l, h as M, M as c, i as h, j as p, k as L, l as u, R as d, T as C, m as v, n as A, p as k, q as F, s as b, t as P, u as T, v as f, w as x, x as y, o as z, y as S, z as q, B, D, E, G as R, H as w } from "./index-Dp0HCBIW.js";
+import { a as e, b as t, C as i, c as n, d as o, e as g, F as r, f as m, L as l, h as M, M as c, i as L, j as h, k as p, l as u, m as d, R as v, T as C, n as A, p as k, q as F, s as b, t as P, u as T, v as f, w as x, x as y, y as z, o as S, z as q, B, D, E, G as R, H as w, I as G, J as I } from "./index-wG3iH9e6.js";
 export {
   e as ActionButton,
   t as Avatar,
   i as ChannelEmptyState,
   n as ChannelList,
   o as ChannelView,
-  m as CustomMessageProvider,
+  g as CustomMessageProvider,
   r as FaqList,
-  g as FaqListItem,
+  m as FaqListItem,
   l as LinkAttachment,
   M as LockedAttachment,
   c as MediaMessage,
-  h as MessageAttachment,
-  p as MessageBubble,
-  L as MessagingProvider,
-  u as MessagingShell,
-  d as RichCard,
+  L as MessageAttachment,
+  h as MessageBubble,
+  p as MessagingLoggerProvider,
+  u as MessagingProvider,
+  d as MessagingShell,
+  v as RichCard,
   C as TipMessage,
-  v as buildCompactMetaLabel,
-  A as formatFileSize,
-  k as formatRelativeTime,
-  F as getFileExtensionLabel,
-  b as getMessageDisplayText,
-  P as isLinkAttachment,
-  T as isTipMessage,
-  f as isUuidLike,
-  x as messageAttachmentGroupPositionFromStream,
-  y as normalizeLanguageCode,
-  z as optimizeMessagingAttachmentUrl,
-  S as resolveConversationParticipant,
-  q as resolveLinkAttachment,
-  B as resolveMediaFromMessage,
-  D as resolveParticipantDisplayName,
-  E as useComposerLocked,
-  R as useCustomMessage,
-  w as useMessaging
+  A as buildCompactMetaLabel,
+  k as formatFileSize,
+  F as formatRelativeTime,
+  b as getFileExtensionLabel,
+  P as getMessageDisplayText,
+  T as isLinkAttachment,
+  f as isTipMessage,
+  x as isUuidLike,
+  y as messageAttachmentGroupPositionFromStream,
+  z as normalizeLanguageCode,
+  S as optimizeMessagingAttachmentUrl,
+  q as resolveConversationParticipant,
+  B as resolveLinkAttachment,
+  D as resolveMediaFromMessage,
+  E as resolveParticipantDisplayName,
+  R as useComposerLocked,
+  w as useCustomMessage,
+  G as useMessaging,
+  I as useMessagingLogger
 };
 //# sourceMappingURL=index.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linktr.ee/messaging-react",
-  "version": "4.2.1-rc-1787325541",
+  "version": "4.2.1",
   "description": "React messaging components built on messaging-core for web applications",
   "type": "module",
   "main": "dist/index.cjs",
@@ -50,7 +50,7 @@
     "chromatic:local": "yarn storybook:build && chromatic"
   },
   "dependencies": {
-    "@linktr.ee/messaging-core": "2.5.0-rc-1787325541",
+    "@linktr.ee/messaging-core": "^2.5.0",
     "@linktr.ee/messaging-taxonomy": "^0.10.0",
     "@phosphor-icons/react": "^2.1.10"
   },

package/src/components/AttachmentCard/AttachmentCard.stories.tsx

@@ -149,6 +149,42 @@ export const AllVariants: StoryFn = () => {
         ),
       },
     },
+    {
+      label: 'Contained image (dark)',
+      props: {
+        variant: 'dark',
+        title: 'portrait.jpg',
+        mimeType: 'image/jpeg',
+        detail: '1.8 MB',
+        thumbnail: (
+          <AttachmentThumbnail
+            mimeType="image/jpeg"
+            sourceUrl={IMAGE_URL}
+            title="portrait"
+            variant="dark"
+            containedImage
+          />
+        ),
+      },
+    },
+    {
+      label: 'Contained image (light)',
+      props: {
+        variant: 'light',
+        title: 'portrait.jpg',
+        mimeType: 'image/jpeg',
+        detail: '1.8 MB',
+        thumbnail: (
+          <AttachmentThumbnail
+            mimeType="image/jpeg"
+            sourceUrl={IMAGE_URL}
+            title="portrait"
+            variant="light"
+            containedImage
+          />
+        ),
+      },
+    },
     {
       label: 'PDF placeholder',
       props: {

package/src/components/AttachmentCard/Thumbnail.tsx

@@ -68,7 +68,7 @@ const AttachmentThumbnail: React.FC<AttachmentThumbnailProps> = ({
   if (sourceUrl && sourceType === 'image') {
     if (containedImage) {
       return (
-        <div className="relative aspect-video overflow-hidden bg-black/5">
+        <div className={`relative ${posterShellClass(variant)}`}>
           <img
             src={optimizedSourceUrl ?? sourceUrl}
             alt={title ?? ''}
@@ -93,7 +93,7 @@ const AttachmentThumbnail: React.FC<AttachmentThumbnailProps> = ({
     if (thumbnailUrl) {
       if (containedImage) {
         return (
-          <div className="relative aspect-video overflow-hidden bg-black/5">
+          <div className={`relative ${posterShellClass(variant)}`}>
             <img
               src={optimizedThumbnailUrl ?? thumbnailUrl}
               alt={title ?? ''}

package/src/components/MessageAttachment/_shared/MediaStackGrid.test.tsx

@@ -47,34 +47,6 @@ describe('MediaStackGrid', () => {
     })
   })
 
-  it.each([
-    [2, '+3', 'tile 2'],
-    [3, '+2', 'tile 3'],
-  ])(
-    'shows overflow on the last visible tile when maxVisible is %s',
-    (maxVisible, badge, lastTile) => {
-      const { container } = renderWithProviders(
-        <MediaStackGrid tiles={tiles(5)} maxVisible={maxVisible} />
-      )
-      expect(container.querySelectorAll('span')).toHaveLength(maxVisible)
-      expect(screen.getByText(badge)).toBeInTheDocument()
-      expect(screen.getByText(badge).parentElement).toHaveTextContent(lastTile)
-    }
-  )
-
-  it('shows overflow on the single visible tile', () => {
-    const { container } = renderWithProviders(
-      <MediaStackGrid tiles={tiles(3)} maxVisible={1} />
-    )
-    expect(container.querySelectorAll('span')).toHaveLength(1)
-    expect(screen.getByText('+2').parentElement).toHaveTextContent('tile 1')
-  })
-
-  it('does not show overflow when all tiles are visible', () => {
-    renderWithProviders(<MediaStackGrid tiles={tiles(3)} maxVisible={3} />)
-    expect(screen.queryByText(/^\+/)).toBeNull()
-  })
-
   it('renders activatable buttons with labels and indexes', () => {
     const onActivate = vi.fn()
     renderWithProviders(

package/src/components/MessageAttachment/_shared/MediaStackGrid.tsx

@@ -118,12 +118,6 @@ const MediaStackGrid: React.FC<MediaStackGridProps> = ({
 
   const visible = tiles.slice(0, Math.min(total, maxVisible))
   const overflow = total - visible.length
-  const overflowBadge =
-    overflow > 0 ? (
-      <div className="absolute inset-0 flex items-center justify-center bg-black/55 text-2xl font-semibold text-white">
-        +{overflow}
-      </div>
-    ) : null
 
   const renderTile = (
     tile: MediaStackTile,
@@ -180,7 +174,7 @@ const MediaStackGrid: React.FC<MediaStackGridProps> = ({
         )}
         style={singleTileStyle}
       >
-        {renderTile(visible[0], 0, overflowBadge)}
+        {renderTile(visible[0], 0)}
       </div>
     )
   }
@@ -193,13 +187,7 @@ const MediaStackGrid: React.FC<MediaStackGridProps> = ({
           className
         )}
       >
-        {visible.map((tile, index) =>
-          renderTile(
-            tile,
-            index,
-            index === visible.length - 1 ? overflowBadge : null
-          )
-        )}
+        {visible.map((tile, index) => renderTile(tile, index))}
       </div>
     )
   }
@@ -214,7 +202,7 @@ const MediaStackGrid: React.FC<MediaStackGridProps> = ({
       >
         <div className="row-span-2">{renderTile(visible[0], 0)}</div>
         {renderTile(visible[1], 1)}
-        {renderTile(visible[2], 2, overflowBadge)}
+        {renderTile(visible[2], 2)}
       </div>
     )
   }
@@ -239,7 +227,11 @@ const MediaStackGrid: React.FC<MediaStackGridProps> = ({
         return renderTile(
           tile,
           index,
-          isLastWithOverflow ? overflowBadge : null
+          isLastWithOverflow ? (
+            <div className="absolute inset-0 flex items-center justify-center bg-black/55 text-2xl font-semibold text-white">
+              +{overflow}
+            </div>
+          ) : null
         )
       })}
     </div>

package/src/index.ts

@@ -29,11 +29,13 @@ export type {
 
 // Providers
 export { MessagingProvider } from './providers/MessagingProvider'
+export { MessagingLoggerProvider } from './logging'
 export { CustomMessageProvider } from './components/CustomMessage/context'
 
 // Hooks
 export { useComposerLocked } from './components/CustomMessageInput'
 export { useMessaging } from './hooks/useMessaging'
+export { useMessagingLogger } from './logging'
 export { useCustomMessage } from './components/CustomMessage/context'
 
 // Utils
@@ -136,3 +138,4 @@ export type { CustomMessageRegistry } from './components/CustomMessage/context'
 export type { AttachmentSourceType } from './components/AttachmentCard/utils/mimeType'
 export type { Faq, FaqListProps } from './components/FaqList'
 export type { FaqListItemProps } from './components/FaqList/FaqListItem'
+export type { Logger } from '@linktr.ee/messaging-core'

package/src/logging/index.test.tsx

@@ -0,0 +1,136 @@
+import type { Logger } from '@linktr.ee/messaging-core'
+import { render } from '@testing-library/react'
+import React from 'react'
+import { describe, it, expect, vi, afterEach } from 'vitest'
+
+import {
+  MessagingLoggerProvider,
+  consoleLogger,
+  resolveLogger,
+  useMessagingLogger,
+} from './index'
+
+const ERROR_MESSAGE = '[MessagingShell] Failed to load channels:'
+
+/** Logs one error through the seam the way a call site would. */
+const ErrorEmitter: React.FC<{ error: Error }> = ({ error }) => {
+  const logger = useMessagingLogger()
+  logger.error(ERROR_MESSAGE, error)
+  return null
+}
+
+/** Emits one line at every level so partial-sink fallback is observable. */
+const AllLevelsEmitter: React.FC = () => {
+  const logger = useMessagingLogger()
+  logger.debug('debug line', 1)
+  logger.info('info line', 2)
+  logger.warn('warn line', 3)
+  logger.error('error line', 4)
+  return null
+}
+
+afterEach(() => {
+  vi.restoreAllMocks()
+})
+
+describe('logger seam', () => {
+  it('routes error to an injected sink with the exact message and raw error object', () => {
+    const error = new Error('boom')
+    const sink = { error: vi.fn() }
+
+    render(
+      <MessagingLoggerProvider logger={sink}>
+        <ErrorEmitter error={error} />
+      </MessagingLoggerProvider>
+    )
+
+    expect(sink.error).toHaveBeenCalledTimes(1)
+    expect(sink.error).toHaveBeenCalledWith(ERROR_MESSAGE, error)
+    // The raw Error instance, not a serialized copy.
+    expect(sink.error.mock.calls[0][1]).toBe(error)
+  })
+
+  it('passes identical arguments to console.error when no sink is injected', () => {
+    const error = new Error('boom')
+    const consoleError = vi.spyOn(console, 'error').mockImplementation(() => {})
+    const sink = { error: vi.fn() }
+
+    render(
+      <MessagingLoggerProvider logger={sink}>
+        <ErrorEmitter error={error} />
+      </MessagingLoggerProvider>
+    )
+    const injectedArgs = sink.error.mock.calls[0]
+
+    // No provider at all, and a provider with no logger prop: both must produce
+    // byte-identical console output to what the injected sink received.
+    render(<ErrorEmitter error={error} />)
+    render(
+      <MessagingLoggerProvider>
+        <ErrorEmitter error={error} />
+      </MessagingLoggerProvider>
+    )
+
+    expect(consoleError).toHaveBeenCalledTimes(2)
+    expect(consoleError.mock.calls[0]).toEqual(injectedArgs)
+    expect(consoleError.mock.calls[1]).toEqual(injectedArgs)
+    expect(consoleError.mock.calls[0][1]).toBe(error)
+  })
+
+  it('falls back to console for the levels a partial sink omits', () => {
+    const consoleLog = vi.spyOn(console, 'log').mockImplementation(() => {})
+    const consoleWarn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+    const consoleError = vi.spyOn(console, 'error').mockImplementation(() => {})
+    const sink: Logger = { warn: vi.fn(), error: vi.fn() }
+
+    render(
+      <MessagingLoggerProvider logger={sink}>
+        <AllLevelsEmitter />
+      </MessagingLoggerProvider>
+    )
+
+    expect(sink.warn).toHaveBeenCalledWith('warn line', 3)
+    expect(sink.error).toHaveBeenCalledWith('error line', 4)
+    expect(consoleWarn).not.toHaveBeenCalled()
+    expect(consoleError).not.toHaveBeenCalled()
+    // debug and info are unset on the sink, so both land on console.log.
+    expect(consoleLog.mock.calls).toEqual([
+      ['debug line', 1],
+      ['info line', 2],
+    ])
+  })
+
+  it('defaults every level to console when the hook is used with no provider', () => {
+    const consoleLog = vi.spyOn(console, 'log').mockImplementation(() => {})
+    const consoleWarn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+    const consoleError = vi.spyOn(console, 'error').mockImplementation(() => {})
+
+    render(<AllLevelsEmitter />)
+
+    expect(consoleLog.mock.calls).toEqual([
+      ['debug line', 1],
+      ['info line', 2],
+    ])
+    expect(consoleWarn).toHaveBeenCalledWith('warn line', 3)
+    expect(consoleError).toHaveBeenCalledWith('error line', 4)
+  })
+
+  it('resolveLogger keeps provided levels and fills the rest from console', () => {
+    const warn = vi.fn()
+    const resolved = resolveLogger({ warn })
+
+    expect(resolved.warn).toBe(warn)
+    expect(resolved.debug).toBe(consoleLogger.debug)
+    expect(resolved.info).toBe(consoleLogger.info)
+    expect(resolved.error).toBe(consoleLogger.error)
+    expect(resolveLogger()).toEqual(consoleLogger)
+  })
+
+  it('consoleLogger dispatches through console at call time, not bind time', () => {
+    const consoleError = vi.spyOn(console, 'error').mockImplementation(() => {})
+
+    consoleLogger.error('late spy', 'arg')
+
+    expect(consoleError).toHaveBeenCalledWith('late spy', 'arg')
+  })
+})

package/src/logging/index.tsx

@@ -0,0 +1,48 @@
+import type { Logger } from '@linktr.ee/messaging-core'
+import React, { createContext, useContext, useMemo } from 'react'
+
+/**
+ * Default sink: the console calls the package makes today. Wrappers, not
+ * `console.error.bind(console)`, so a later-installed spy is still observed.
+ */
+export const consoleLogger: Required<Logger> = {
+  debug: (message, ...args) => console.log(message, ...args),
+  info: (message, ...args) => console.log(message, ...args),
+  warn: (message, ...args) => console.warn(message, ...args),
+  error: (message, ...args) => console.error(message, ...args),
+}
+
+/**
+ * Merge a partial sink over the console defaults, so a consumer can route only
+ * the levels it cares about (e.g. `error`) and leave the rest on console.
+ */
+export const resolveLogger = (logger?: Logger): Required<Logger> => ({
+  debug: logger?.debug ?? consoleLogger.debug,
+  info: logger?.info ?? consoleLogger.info,
+  warn: logger?.warn ?? consoleLogger.warn,
+  error: logger?.error ?? consoleLogger.error,
+})
+
+const LoggerContext = createContext<Required<Logger>>(consoleLogger)
+
+/**
+ * Provides the resolved logger sink to the messaging subtree. Rendered by
+ * `MessagingProvider`; usable standalone in tests or in a subtree that needs a
+ * different sink.
+ */
+export const MessagingLoggerProvider: React.FC<{
+  logger?: Logger
+  children: React.ReactNode
+}> = ({ logger, children }) => {
+  const value = useMemo(() => resolveLogger(logger), [logger])
+  return (
+    <LoggerContext.Provider value={value}>{children}</LoggerContext.Provider>
+  )
+}
+
+/**
+ * The logger sink for the current subtree. Falls back to console when no
+ * provider (or no `logger` prop) is present, so call sites never branch.
+ */
+export const useMessagingLogger = (): Required<Logger> =>
+  useContext(LoggerContext)

package/src/providers/MessagingProvider.test.tsx

@@ -1,10 +1,16 @@
 import { StreamChatService } from '@linktr.ee/messaging-core'
-import type { MessagingUser } from '@linktr.ee/messaging-core'
+import type {
+  Logger,
+  MessagingUser,
+  StreamChatServiceConfig,
+} from '@linktr.ee/messaging-core'
 import { render, waitFor, act } from '@testing-library/react'
 import React from 'react'
 import type { StreamChat } from 'stream-chat'
 import { describe, it, expect, vi, beforeEach } from 'vitest'
 
+import { useMessagingLogger } from '../logging'
+
 import { MessagingProvider, useMessagingContext } from './MessagingProvider'
 
 // Stub stream-chat-react's <Chat /> so we don't need a real, fully-wired
@@ -488,4 +494,124 @@ describe('MessagingProvider', () => {
     expect(last.hasClient).toBe(false)
     expect(last.error).toBeNull()
   })
+
+  describe('logger seam', () => {
+    const ServiceProbe: React.FC<{
+      onService: (service: StreamChatService | null) => void
+    }> = ({ onService }) => {
+      const { service } = useMessagingContext()
+      React.useEffect(() => {
+        onService(service)
+      }, [service, onService])
+      return null
+    }
+
+    const LoggerProbe: React.FC<{ onLogger: (logger: Logger) => void }> = ({
+      onLogger,
+    }) => {
+      const logger = useMessagingLogger()
+      React.useEffect(() => {
+        onLogger(logger)
+      }, [logger, onLogger])
+      return null
+    }
+
+    // The service stores its resolved sink privately; read it to prove which
+    // logger the provider handed to the constructor.
+    const serviceLogger = (service: StreamChatService) =>
+      (service as unknown as { logger: Logger }).logger
+
+    const renderWithLogger = async (
+      props: Partial<React.ComponentProps<typeof MessagingProvider>> & {
+        serviceConfig: Omit<StreamChatServiceConfig, 'apiKey'>
+      }
+    ) => {
+      setupServiceMock()
+      const services: (StreamChatService | null)[] = []
+      const loggers: Logger[] = []
+
+      render(
+        <MessagingProvider
+          apiKey="mock-api-key"
+          user={
+            { type: 'guest', id: 'guest-1', name: 'Guest' } as MessagingUser
+          }
+          {...props}
+        >
+          <ServiceProbe onService={(s) => services.push(s)} />
+          <LoggerProbe onLogger={(l) => loggers.push(l)} />
+        </MessagingProvider>
+      )
+
+      await waitFor(() => expect(services.filter(Boolean).length).toBe(1))
+      return {
+        service: services.filter(Boolean).pop() as StreamChatService,
+        logger: loggers[loggers.length - 1],
+      }
+    }
+
+    const baseServiceConfig: Omit<StreamChatServiceConfig, 'apiKey'> = {
+      fetchToken: async () => 'token',
+      createChannel: async () => ({ channelId: 'ch-1' }),
+    }
+
+    it('forwards the logger prop into the service and to the subtree', async () => {
+      const sink: Logger = { error: vi.fn() }
+      const { service, logger } = await renderWithLogger({
+        serviceConfig: baseServiceConfig,
+        logger: sink,
+      })
+
+      expect(serviceLogger(service).error).toBe(sink.error)
+
+      const error = new Error('boom')
+      logger.error?.('[MessagingShell] Failed:', error)
+      expect(sink.error).toHaveBeenCalledWith('[MessagingShell] Failed:', error)
+    })
+
+    it('resolves a partial prop sink before handing it to the service', async () => {
+      const consoleWarn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+      const sink: Logger = { error: vi.fn() }
+      const { service } = await renderWithLogger({
+        serviceConfig: baseServiceConfig,
+        logger: sink,
+      })
+
+      // The service swaps its own console defaults out wholesale, so an
+      // unresolved partial sink would silence the levels it omits.
+      serviceLogger(service).warn?.('[StreamChatService] Slow:', 1)
+      expect(consoleWarn).toHaveBeenCalledWith('[StreamChatService] Slow:', 1)
+    })
+
+    it('lets an explicit serviceConfig.logger win over the logger prop', async () => {
+      const configSink: Logger = { error: vi.fn() }
+      const propSink: Logger = { error: vi.fn() }
+      const { service } = await renderWithLogger({
+        serviceConfig: { ...baseServiceConfig, logger: configSink },
+        logger: propSink,
+      })
+
+      expect(serviceLogger(service)).toBe(configSink)
+    })
+
+    it('leaves the service on its console defaults when no logger is given', async () => {
+      const consoleError = vi
+        .spyOn(console, 'error')
+        .mockImplementation(() => {})
+      const { service, logger } = await renderWithLogger({
+        serviceConfig: baseServiceConfig,
+      })
+
+      // Not the react seam object: the service fell back to its own defaults.
+      expect(serviceLogger(service)).not.toBe(logger)
+
+      const error = new Error('boom')
+      logger.error?.('[MessagingShell] Failed:', error)
+      serviceLogger(service).error?.('[StreamChatService] Failed:', error)
+      expect(consoleError.mock.calls).toEqual([
+        ['[MessagingShell] Failed:', error],
+        ['[StreamChatService] Failed:', error],
+      ])
+    })
+  })
 })