@linktr.ee/messaging-react 1.20.0 → 1.21.0-rc-1771294922

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linktr.ee/messaging-react",
-  "version": "1.20.0",
+  "version": "1.21.0-rc-1771294922",
   "description": "React messaging components built on messaging-core for web applications",
   "type": "module",
   "main": "dist/index.js",

package/src/components/ChannelView.tsx

@@ -528,6 +528,7 @@ const ChannelViewInner: React.FC<{
   onReportParticipantClick?: () => void
   showStarButton?: boolean
   chatbotVotingEnabled?: boolean
+  renderChannelBanner?: () => React.ReactNode
 }> = ({
   onBack,
   showBackButton,
@@ -540,6 +541,7 @@ const ChannelViewInner: React.FC<{
   onReportParticipantClick,
   showStarButton = false,
   chatbotVotingEnabled = false,
+  renderChannelBanner,
 }) => {
   const { channel } = useChannelStateContext()
   const infoDialogRef = useRef<HTMLDialogElement>(null)
@@ -602,6 +604,9 @@ const ChannelViewInner: React.FC<{
             />
           </div>
 
+          {/* Custom Banner/Summary */}
+          {renderChannelBanner?.()}
+
           {/* Message List */}
           <div className="flex-1 overflow-hidden relative">
             <MessageList
@@ -658,6 +663,7 @@ export const ChannelView = React.memo<ChannelViewProps>(
     onMessageSent,
     showStarButton = false,
     chatbotVotingEnabled = false,
+    renderChannelBanner,
   }) => {
     // Custom send message handler that:
     // 1. Applies messageMetadata if provided
@@ -731,6 +737,7 @@ export const ChannelView = React.memo<ChannelViewProps>(
             onReportParticipantClick={onReportParticipantClick}
             showStarButton={showStarButton}
             chatbotVotingEnabled={chatbotVotingEnabled}
+            renderChannelBanner={renderChannelBanner}
           />
         </Channel>
       </div>

package/src/types.ts

@@ -147,6 +147,13 @@ export interface ChannelViewProps {
    * Defaults to false.
    */
   chatbotVotingEnabled?: boolean
+
+  /**
+   * Custom render function for a banner/card component that renders
+   * between the channel header and message list.
+   * Useful for showing summaries, alerts, or contextual information.
+   */
+  renderChannelBanner?: () => React.ReactNode
 }
 
 /**
@@ -165,6 +172,7 @@ export type ChannelViewPassthroughProps = Pick<
   | 'onMessageSent'
   | 'showStarButton'
   | 'chatbotVotingEnabled'
+  | 'renderChannelBanner'
 >
 
 /**