Feature Request: [Chatbot] - Allow adding a label/badge for per-source metadata in the SourcesCard

[debsmita1]

Chatbot Component Area

Message Content (Text, Markdown, Citations)

Describe the feature

When using RAG, each referenced document may include a source field identifying the knowledge base / RAG index (for example product-docs-1_10, okp, or a custom index id). We need to show that value on each SourcesCard so users can distinguish which knowledge base a citation came from.

Today SourcesCard exposes title, subtitle, body, and footer, but:

• subtitle is a plain string rendered under the title with no badge/label styling or dedicated layout slot (e.g. top-right pill).

• footer replaces the built-in 1/N pagination footer when set, so it cannot be used for a small badge while keeping paginated multi-source navigation.

As a result, consumers resort to fragile CSS overrides of internal classes such as:

• .pf-chatbot__sources-card

• .pf-chatbot__sources-card-title-container

• .pf-chatbot__sources-card-subtitle

These overrides break silently when the chatbot DOM/structure changes.

Expected Data Structure

Add an optional per-source prop, for example:

sources: {
  title?: string;
  subtitle?: string;
  link: string;
  body?: React.ReactNode | string;
  /** Optional badge/label content (e.g. RAG source id) */
  label?: React.ReactNode | string;
  /** Optional props forwarded to the underlying Label (when label is a string) */
  labelProps?: LabelProps;
  footer?: React.ReactNode;
  // ...existing props
}[]

<Message
  role="bot"
  content="…"
  sources={{
    sources: [
      {
        title: 'Installing and viewing plugins',
        link: 'https://…',
        isExternal: true,
        label: 'product-docs-1_10',
      },
      {
        title: 'Dynamic plugins reference',
        link: 'https://…',
        isExternal: true,
        label: 'okp',
      },
    ],
  }}
/>

Conversational Flow

No response

Visuals & Mockups

Conversational Accessibility

No response

Validation

• This request aligns with PatternFly AI/Chatbot design guidelines.

• I have searched for existing chatbot-specific components.

---

Jira Issue: PF-4553

[kaylachumley]

patternfly design placement recommendation - top left above the title/heading using a non status label

https://www.figma.com/design/MSr6kVEOuAxmPOkjg7x8PO/PatternFly-6--Patterns---Extensions?m=auto&node-id=5190-7664&t=KZL9lFmyfrRP60ux-1