@patternfly/chatbot 6.3.0-prerelease.20 → 6.3.0-prerelease.22

package/dist/cjs/Message/Message.test.js

@@ -348,6 +348,8 @@ describe('Message', () => {
                 // eslint-disable-next-line no-console
                 share: { onClick: () => console.log('Share') },
                 // eslint-disable-next-line no-console
+                download: { onClick: () => console.log('Download') },
+                // eslint-disable-next-line no-console
                 listen: { onClick: () => console.log('Listen') }
             } }));
         ALL_ACTIONS.forEach(({ label }) => {
@@ -365,6 +367,8 @@ describe('Message', () => {
                 // eslint-disable-next-line no-console
                 share: { onClick: () => console.log('Share') },
                 // eslint-disable-next-line no-console
+                download: { onClick: () => console.log('Download') },
+                // eslint-disable-next-line no-console
                 listen: { onClick: () => console.log('Listen') }
             } }));
         expect(react_2.screen.getByText('Loading message')).toBeTruthy();

package/dist/cjs/ResponseActions/ResponseActions.d.ts

@@ -36,6 +36,7 @@ export interface ResponseActionProps {
         negative?: ActionProps;
         copy?: ActionProps;
         share?: ActionProps;
+        download?: ActionProps;
         listen?: ActionProps;
     };
 }

package/dist/cjs/ResponseActions/ResponseActions.js

@@ -21,9 +21,9 @@ const react_2 = require("react");
 const react_icons_1 = require("@patternfly/react-icons");
 const ResponseActionButton_1 = __importDefault(require("./ResponseActionButton"));
 const ResponseActions = ({ actions }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
     const [activeButton, setActiveButton] = (0, react_2.useState)();
-    const { positive, negative, copy, share, listen } = actions, additionalActions = __rest(actions, ["positive", "negative", "copy", "share", "listen"]);
+    const { positive, negative, copy, share, download, listen } = actions, additionalActions = __rest(actions, ["positive", "negative", "copy", "share", "download", "listen"]);
     const responseActions = (0, react_2.useRef)(null);
     (0, react_2.useEffect)(() => {
         const handleClickOutside = (e) => {
@@ -40,7 +40,7 @@ const ResponseActions = ({ actions }) => {
         setActiveButton(id);
         onClick && onClick(e);
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { ref: responseActions, className: "pf-chatbot__response-actions", children: [positive && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, positive, { ariaLabel: (_a = positive.ariaLabel) !== null && _a !== void 0 ? _a : 'Good response', clickedAriaLabel: (_b = positive.ariaLabel) !== null && _b !== void 0 ? _b : 'Response recorded', onClick: (e) => handleClick(e, 'positive', positive.onClick), className: positive.className, isDisabled: positive.isDisabled, tooltipContent: (_c = positive.tooltipContent) !== null && _c !== void 0 ? _c : 'Good response', clickedTooltipContent: (_d = positive.clickedTooltipContent) !== null && _d !== void 0 ? _d : 'Response recorded', tooltipProps: positive.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedThumbsUpIcon, {}), isClicked: activeButton === 'positive', ref: positive.ref, "aria-expanded": positive['aria-expanded'], "aria-controls": positive['aria-controls'] }))), negative && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, negative, { ariaLabel: (_e = negative.ariaLabel) !== null && _e !== void 0 ? _e : 'Bad response', clickedAriaLabel: (_f = negative.ariaLabel) !== null && _f !== void 0 ? _f : 'Response recorded', onClick: (e) => handleClick(e, 'negative', negative.onClick), className: negative.className, isDisabled: negative.isDisabled, tooltipContent: (_g = negative.tooltipContent) !== null && _g !== void 0 ? _g : 'Bad response', clickedTooltipContent: (_h = negative.clickedTooltipContent) !== null && _h !== void 0 ? _h : 'Response recorded', tooltipProps: negative.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedThumbsDownIcon, {}), isClicked: activeButton === 'negative', ref: negative.ref, "aria-expanded": negative['aria-expanded'], "aria-controls": negative['aria-controls'] }))), copy && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, copy, { ariaLabel: (_j = copy.ariaLabel) !== null && _j !== void 0 ? _j : 'Copy', clickedAriaLabel: (_k = copy.ariaLabel) !== null && _k !== void 0 ? _k : 'Copied', onClick: (e) => handleClick(e, 'copy', copy.onClick), className: copy.className, isDisabled: copy.isDisabled, tooltipContent: (_l = copy.tooltipContent) !== null && _l !== void 0 ? _l : 'Copy', clickedTooltipContent: (_m = copy.clickedTooltipContent) !== null && _m !== void 0 ? _m : 'Copied', tooltipProps: copy.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedCopyIcon, {}), isClicked: activeButton === 'copy', ref: copy.ref, "aria-expanded": copy['aria-expanded'], "aria-controls": copy['aria-controls'] }))), share && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, share, { ariaLabel: (_o = share.ariaLabel) !== null && _o !== void 0 ? _o : 'Share', clickedAriaLabel: (_p = share.ariaLabel) !== null && _p !== void 0 ? _p : 'Shared', onClick: (e) => handleClick(e, 'share', share.onClick), className: share.className, isDisabled: share.isDisabled, tooltipContent: (_q = share.tooltipContent) !== null && _q !== void 0 ? _q : 'Share', clickedTooltipContent: (_r = share.clickedTooltipContent) !== null && _r !== void 0 ? _r : 'Shared', tooltipProps: share.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.ExternalLinkAltIcon, {}), isClicked: activeButton === 'share', ref: share.ref, "aria-expanded": share['aria-expanded'], "aria-controls": share['aria-controls'] }))), listen && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, listen, { ariaLabel: (_s = listen.ariaLabel) !== null && _s !== void 0 ? _s : 'Listen', clickedAriaLabel: (_t = listen.ariaLabel) !== null && _t !== void 0 ? _t : 'Listening', onClick: (e) => handleClick(e, 'listen', listen.onClick), className: listen.className, isDisabled: listen.isDisabled, tooltipContent: (_u = listen.tooltipContent) !== null && _u !== void 0 ? _u : 'Listen', clickedTooltipContent: (_v = listen.clickedTooltipContent) !== null && _v !== void 0 ? _v : 'Listening', tooltipProps: listen.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.VolumeUpIcon, {}), isClicked: activeButton === 'listen', ref: listen.ref, "aria-expanded": listen['aria-expanded'], "aria-controls": listen['aria-controls'] }))), Object.keys(additionalActions).map((action) => {
+    return ((0, jsx_runtime_1.jsxs)("div", { ref: responseActions, className: "pf-chatbot__response-actions", children: [positive && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, positive, { ariaLabel: (_a = positive.ariaLabel) !== null && _a !== void 0 ? _a : 'Good response', clickedAriaLabel: (_b = positive.ariaLabel) !== null && _b !== void 0 ? _b : 'Response recorded', onClick: (e) => handleClick(e, 'positive', positive.onClick), className: positive.className, isDisabled: positive.isDisabled, tooltipContent: (_c = positive.tooltipContent) !== null && _c !== void 0 ? _c : 'Good response', clickedTooltipContent: (_d = positive.clickedTooltipContent) !== null && _d !== void 0 ? _d : 'Response recorded', tooltipProps: positive.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedThumbsUpIcon, {}), isClicked: activeButton === 'positive', ref: positive.ref, "aria-expanded": positive['aria-expanded'], "aria-controls": positive['aria-controls'] }))), negative && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, negative, { ariaLabel: (_e = negative.ariaLabel) !== null && _e !== void 0 ? _e : 'Bad response', clickedAriaLabel: (_f = negative.ariaLabel) !== null && _f !== void 0 ? _f : 'Response recorded', onClick: (e) => handleClick(e, 'negative', negative.onClick), className: negative.className, isDisabled: negative.isDisabled, tooltipContent: (_g = negative.tooltipContent) !== null && _g !== void 0 ? _g : 'Bad response', clickedTooltipContent: (_h = negative.clickedTooltipContent) !== null && _h !== void 0 ? _h : 'Response recorded', tooltipProps: negative.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedThumbsDownIcon, {}), isClicked: activeButton === 'negative', ref: negative.ref, "aria-expanded": negative['aria-expanded'], "aria-controls": negative['aria-controls'] }))), copy && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, copy, { ariaLabel: (_j = copy.ariaLabel) !== null && _j !== void 0 ? _j : 'Copy', clickedAriaLabel: (_k = copy.ariaLabel) !== null && _k !== void 0 ? _k : 'Copied', onClick: (e) => handleClick(e, 'copy', copy.onClick), className: copy.className, isDisabled: copy.isDisabled, tooltipContent: (_l = copy.tooltipContent) !== null && _l !== void 0 ? _l : 'Copy', clickedTooltipContent: (_m = copy.clickedTooltipContent) !== null && _m !== void 0 ? _m : 'Copied', tooltipProps: copy.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedCopyIcon, {}), isClicked: activeButton === 'copy', ref: copy.ref, "aria-expanded": copy['aria-expanded'], "aria-controls": copy['aria-controls'] }))), share && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, share, { ariaLabel: (_o = share.ariaLabel) !== null && _o !== void 0 ? _o : 'Share', clickedAriaLabel: (_p = share.ariaLabel) !== null && _p !== void 0 ? _p : 'Shared', onClick: (e) => handleClick(e, 'share', share.onClick), className: share.className, isDisabled: share.isDisabled, tooltipContent: (_q = share.tooltipContent) !== null && _q !== void 0 ? _q : 'Share', clickedTooltipContent: (_r = share.clickedTooltipContent) !== null && _r !== void 0 ? _r : 'Shared', tooltipProps: share.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.ExternalLinkAltIcon, {}), isClicked: activeButton === 'share', ref: share.ref, "aria-expanded": share['aria-expanded'], "aria-controls": share['aria-controls'] }))), download && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, download, { ariaLabel: (_s = download.ariaLabel) !== null && _s !== void 0 ? _s : 'Download', clickedAriaLabel: (_t = download.ariaLabel) !== null && _t !== void 0 ? _t : 'Downloaded', onClick: (e) => handleClick(e, 'download', download.onClick), className: download.className, isDisabled: download.isDisabled, tooltipContent: (_u = download.tooltipContent) !== null && _u !== void 0 ? _u : 'Download', clickedTooltipContent: (_v = download.clickedTooltipContent) !== null && _v !== void 0 ? _v : 'Downloaded', tooltipProps: download.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.DownloadIcon, {}), isClicked: activeButton === 'download', ref: download.ref, "aria-expanded": download['aria-expanded'], "aria-controls": download['aria-controls'] }))), listen && ((0, jsx_runtime_1.jsx)(ResponseActionButton_1.default, Object.assign({}, listen, { ariaLabel: (_w = listen.ariaLabel) !== null && _w !== void 0 ? _w : 'Listen', clickedAriaLabel: (_x = listen.ariaLabel) !== null && _x !== void 0 ? _x : 'Listening', onClick: (e) => handleClick(e, 'listen', listen.onClick), className: listen.className, isDisabled: listen.isDisabled, tooltipContent: (_y = listen.tooltipContent) !== null && _y !== void 0 ? _y : 'Listen', clickedTooltipContent: (_z = listen.clickedTooltipContent) !== null && _z !== void 0 ? _z : 'Listening', tooltipProps: listen.tooltipProps, icon: (0, jsx_runtime_1.jsx)(react_icons_1.VolumeUpIcon, {}), isClicked: activeButton === 'listen', ref: listen.ref, "aria-expanded": listen['aria-expanded'], "aria-controls": listen['aria-controls'] }))), Object.keys(additionalActions).map((action) => {
                 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
                 return ((0, react_1.createElement)(ResponseActionButton_1.default, Object.assign({}, additionalActions[action], { key: action, ariaLabel: (_a = additionalActions[action]) === null || _a === void 0 ? void 0 : _a.ariaLabel, clickedAriaLabel: (_b = additionalActions[action]) === null || _b === void 0 ? void 0 : _b.clickedAriaLabel, onClick: (e) => { var _a; return handleClick(e, action, (_a = additionalActions[action]) === null || _a === void 0 ? void 0 : _a.onClick); }, className: (_c = additionalActions[action]) === null || _c === void 0 ? void 0 : _c.className, isDisabled: (_d = additionalActions[action]) === null || _d === void 0 ? void 0 : _d.isDisabled, tooltipContent: (_e = additionalActions[action]) === null || _e === void 0 ? void 0 : _e.tooltipContent, tooltipProps: (_f = additionalActions[action]) === null || _f === void 0 ? void 0 : _f.tooltipProps, clickedTooltipContent: (_g = additionalActions[action]) === null || _g === void 0 ? void 0 : _g.clickedTooltipContent, icon: (_h = additionalActions[action]) === null || _h === void 0 ? void 0 : _h.icon, isClicked: activeButton === action, ref: (_j = additionalActions[action]) === null || _j === void 0 ? void 0 : _j.ref, "aria-expanded": (_k = additionalActions[action]) === null || _k === void 0 ? void 0 : _k['aria-expanded'], "aria-controls": (_l = additionalActions[action]) === null || _l === void 0 ? void 0 : _l['aria-controls'] })));
             })] }));

package/dist/cjs/ResponseActions/ResponseActions.test.js

@@ -57,6 +57,7 @@ const ALL_ACTIONS_DATA_TEST = [
     { type: 'negative', label: 'Bad response', dataTestId: 'negative' },
     { type: 'copy', label: 'Copy', dataTestId: 'copy' },
     { type: 'share', label: 'Share', dataTestId: 'share' },
+    { type: 'download', label: 'Download', dataTestId: 'download' },
     { type: 'listen', label: 'Listen', dataTestId: 'listen' }
 ];
 describe('ResponseActions', () => {
@@ -69,14 +70,16 @@ describe('ResponseActions', () => {
                 negative: { onClick: jest.fn() },
                 copy: { onClick: jest.fn() },
                 share: { onClick: jest.fn() },
+                download: { onClick: jest.fn() },
                 listen: { onClick: jest.fn() }
             } }));
         const goodBtn = react_1.screen.getByRole('button', { name: 'Good response' });
         const badBtn = react_1.screen.getByRole('button', { name: 'Bad response' });
         const copyBtn = react_1.screen.getByRole('button', { name: 'Copy' });
         const shareBtn = react_1.screen.getByRole('button', { name: 'Share' });
+        const downloadBtn = react_1.screen.getByRole('button', { name: 'Download' });
         const listenBtn = react_1.screen.getByRole('button', { name: 'Listen' });
-        const buttons = [goodBtn, badBtn, copyBtn, shareBtn, listenBtn];
+        const buttons = [goodBtn, badBtn, copyBtn, shareBtn, downloadBtn, listenBtn];
         buttons.forEach((button) => {
             expect(button).toBeTruthy();
         });
@@ -149,6 +152,7 @@ describe('ResponseActions', () => {
             { type: 'negative', ariaLabel: 'Thumbs down' },
             { type: 'copy', ariaLabel: 'Copy the message' },
             { type: 'share', ariaLabel: 'Share it with friends' },
+            { type: 'download', ariaLabel: 'Download your cool message' },
             { type: 'listen', ariaLabel: 'Listen up' }
         ];
         actions.forEach(({ type, ariaLabel }) => {

package/dist/cjs/SourcesCard/SourcesCard.d.ts

@@ -1,5 +1,5 @@
 import type { FunctionComponent } from 'react';
-import { CardProps } from '@patternfly/react-core';
+import { ButtonProps, CardProps } from '@patternfly/react-core';
 export interface SourcesCardProps extends CardProps {
     /** Additional classes for the pagination navigation container. */
     className?: string;
@@ -11,11 +11,20 @@ export interface SourcesCardProps extends CardProps {
     paginationAriaLabel?: string;
     /** Content rendered inside the paginated card */
     sources: {
+        /** Title of sources card */
         title?: string;
+        /** Link to source */
         link: string;
+        /** Body of sources card */
         body?: React.ReactNode | string;
+        /** Whether link is external */
         isExternal?: boolean;
+        /** Whether sources card is expandable */
         hasShowMore?: boolean;
+        /** onClick event applied to the title of the Sources card */
+        onClick?: React.MouseEventHandler<HTMLButtonElement>;
+        /** Any additional props applied to the title of the Sources card  */
+        titleProps?: ButtonProps;
     }[];
     /** Label for the English word "source" */
     sourceWord?: string;

package/dist/cjs/SourcesCard/SourcesCard.js

@@ -17,6 +17,7 @@ const react_1 = require("react");
 const react_core_1 = require("@patternfly/react-core");
 const react_icons_1 = require("@patternfly/react-icons");
 const SourcesCard = (_a) => {
+    var _b;
     var { className, isDisabled, paginationAriaLabel = 'Pagination', sources, sourceWord = 'source', sourceWordPlural = 'sources', toNextPageAriaLabel = 'Go to next page', toPreviousPageAriaLabel = 'Go to previous page', onNextClick, onPreviousClick, onSetPage, showMoreWords = 'show more', showLessWords = 'show less', isCompact } = _a, props = __rest(_a, ["className", "isDisabled", "paginationAriaLabel", "sources", "sourceWord", "sourceWordPlural", "toNextPageAriaLabel", "toPreviousPageAriaLabel", "onNextClick", "onPreviousClick", "onSetPage", "showMoreWords", "showLessWords", "isCompact"]);
     const [page, setPage] = (0, react_1.useState)(1);
     const [isExpanded, setIsExpanded] = (0, react_1.useState)(false);
@@ -33,7 +34,7 @@ const SourcesCard = (_a) => {
         }
         return `Source ${page}`;
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__source", children: [(0, jsx_runtime_1.jsx)("span", { children: (0, react_core_1.pluralize)(sources.length, sourceWord, sourceWordPlural) }), (0, jsx_runtime_1.jsxs)(react_core_1.Card, Object.assign({ isCompact: isCompact, className: "pf-chatbot__sources-card" }, props, { children: [(0, jsx_runtime_1.jsx)(react_core_1.CardTitle, { className: "pf-chatbot__sources-card-title", children: (0, jsx_runtime_1.jsx)(react_core_1.Button, { component: "a", variant: react_core_1.ButtonVariant.link, href: sources[page - 1].link, icon: sources[page - 1].isExternal ? (0, jsx_runtime_1.jsx)(react_icons_1.ExternalLinkSquareAltIcon, {}) : undefined, iconPosition: "end", isInline: true, rel: sources[page - 1].isExternal ? 'noreferrer' : undefined, target: sources[page - 1].isExternal ? '_blank' : undefined, children: renderTitle(sources[page - 1].title) }) }), sources[page - 1].body && ((0, jsx_runtime_1.jsx)(react_core_1.CardBody, { className: `pf-chatbot__sources-card-body`, children: sources[page - 1].hasShowMore ? (
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__source", children: [(0, jsx_runtime_1.jsx)("span", { children: (0, react_core_1.pluralize)(sources.length, sourceWord, sourceWordPlural) }), (0, jsx_runtime_1.jsxs)(react_core_1.Card, Object.assign({ isCompact: isCompact, className: "pf-chatbot__sources-card" }, props, { children: [(0, jsx_runtime_1.jsx)(react_core_1.CardTitle, { className: "pf-chatbot__sources-card-title", children: (0, jsx_runtime_1.jsx)(react_core_1.Button, Object.assign({ component: "a", variant: react_core_1.ButtonVariant.link, href: sources[page - 1].link, icon: sources[page - 1].isExternal ? (0, jsx_runtime_1.jsx)(react_icons_1.ExternalLinkSquareAltIcon, {}) : undefined, iconPosition: "end", isInline: true, rel: sources[page - 1].isExternal ? 'noreferrer' : undefined, target: sources[page - 1].isExternal ? '_blank' : undefined, onClick: (_b = sources[page - 1].onClick) !== null && _b !== void 0 ? _b : undefined }, sources[page - 1].titleProps, { children: renderTitle(sources[page - 1].title) })) }), sources[page - 1].body && ((0, jsx_runtime_1.jsx)(react_core_1.CardBody, { className: `pf-chatbot__sources-card-body`, children: sources[page - 1].hasShowMore ? (
                         // prevents extra VO announcements of button text - parent Message has aria-live
                         (0, jsx_runtime_1.jsx)("div", { "aria-live": "off", children: (0, jsx_runtime_1.jsx)(react_core_1.ExpandableSection, { variant: react_core_1.ExpandableSectionVariant.truncate, toggleText: isExpanded ? showLessWords : showMoreWords, onToggle: onToggle, isExpanded: isExpanded, truncateMaxLines: 2, children: sources[page - 1].body }) })) : ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__sources-card-body-text", children: sources[page - 1].body })) })), sources.length > 1 && ((0, jsx_runtime_1.jsx)(react_core_1.CardFooter, { className: "pf-chatbot__sources-card-footer-container", children: (0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__sources-card-footer", children: (0, jsx_runtime_1.jsxs)("nav", { className: `pf-chatbot__sources-card-footer-buttons ${className}`, "aria-label": paginationAriaLabel, children: [(0, jsx_runtime_1.jsx)(react_core_1.Button, { variant: react_core_1.ButtonVariant.plain, isDisabled: isDisabled || page === 1, "data-action": "previous", onClick: (event) => {
                                             const newPage = page >= 1 ? page - 1 : 1;

package/dist/cjs/SourcesCard/SourcesCard.test.js

@@ -174,4 +174,14 @@ describe('SourcesCard', () => {
             ] }));
         expect(react_1.screen.getByRole('region')).toHaveAttribute('class', 'pf-v6-c-expandable-section__content');
     }));
+    it('should call onClick appropriately', () => __awaiter(void 0, void 0, void 0, function* () {
+        const spy = jest.fn();
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(SourcesCard_1.default, { sources: [{ title: 'How to make an apple pie', link: '', onClick: spy }] }));
+        yield user_event_1.default.click(react_1.screen.getByRole('link', { name: /How to make an apple pie/i }));
+        expect(spy).toHaveBeenCalled();
+    }));
+    it('should apply titleProps appropriately', () => {
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(SourcesCard_1.default, { sources: [{ title: 'How to make an apple pie', link: '', titleProps: { className: 'test' } }] }));
+        expect(react_1.screen.getByRole('link', { name: /How to make an apple pie/i })).toHaveClass('test');
+    });
 });

package/dist/esm/Message/Message.test.js

@@ -343,6 +343,8 @@ describe('Message', () => {
                 // eslint-disable-next-line no-console
                 share: { onClick: () => console.log('Share') },
                 // eslint-disable-next-line no-console
+                download: { onClick: () => console.log('Download') },
+                // eslint-disable-next-line no-console
                 listen: { onClick: () => console.log('Listen') }
             } }));
         ALL_ACTIONS.forEach(({ label }) => {
@@ -360,6 +362,8 @@ describe('Message', () => {
                 // eslint-disable-next-line no-console
                 share: { onClick: () => console.log('Share') },
                 // eslint-disable-next-line no-console
+                download: { onClick: () => console.log('Download') },
+                // eslint-disable-next-line no-console
                 listen: { onClick: () => console.log('Listen') }
             } }));
         expect(screen.getByText('Loading message')).toBeTruthy();

package/dist/esm/ResponseActions/ResponseActions.d.ts

@@ -36,6 +36,7 @@ export interface ResponseActionProps {
         negative?: ActionProps;
         copy?: ActionProps;
         share?: ActionProps;
+        download?: ActionProps;
         listen?: ActionProps;
     };
 }

package/dist/esm/ResponseActions/ResponseActions.js

@@ -12,12 +12,12 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { createElement as _createElement } from "react";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from 'react';
-import { ExternalLinkAltIcon, VolumeUpIcon, OutlinedThumbsUpIcon, OutlinedThumbsDownIcon, OutlinedCopyIcon } from '@patternfly/react-icons';
+import { ExternalLinkAltIcon, VolumeUpIcon, OutlinedThumbsUpIcon, OutlinedThumbsDownIcon, OutlinedCopyIcon, DownloadIcon } from '@patternfly/react-icons';
 import ResponseActionButton from './ResponseActionButton';
 export const ResponseActions = ({ actions }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
     const [activeButton, setActiveButton] = useState();
-    const { positive, negative, copy, share, listen } = actions, additionalActions = __rest(actions, ["positive", "negative", "copy", "share", "listen"]);
+    const { positive, negative, copy, share, download, listen } = actions, additionalActions = __rest(actions, ["positive", "negative", "copy", "share", "download", "listen"]);
     const responseActions = useRef(null);
     useEffect(() => {
         const handleClickOutside = (e) => {
@@ -34,7 +34,7 @@ export const ResponseActions = ({ actions }) => {
         setActiveButton(id);
         onClick && onClick(e);
     };
-    return (_jsxs("div", { ref: responseActions, className: "pf-chatbot__response-actions", children: [positive && (_jsx(ResponseActionButton, Object.assign({}, positive, { ariaLabel: (_a = positive.ariaLabel) !== null && _a !== void 0 ? _a : 'Good response', clickedAriaLabel: (_b = positive.ariaLabel) !== null && _b !== void 0 ? _b : 'Response recorded', onClick: (e) => handleClick(e, 'positive', positive.onClick), className: positive.className, isDisabled: positive.isDisabled, tooltipContent: (_c = positive.tooltipContent) !== null && _c !== void 0 ? _c : 'Good response', clickedTooltipContent: (_d = positive.clickedTooltipContent) !== null && _d !== void 0 ? _d : 'Response recorded', tooltipProps: positive.tooltipProps, icon: _jsx(OutlinedThumbsUpIcon, {}), isClicked: activeButton === 'positive', ref: positive.ref, "aria-expanded": positive['aria-expanded'], "aria-controls": positive['aria-controls'] }))), negative && (_jsx(ResponseActionButton, Object.assign({}, negative, { ariaLabel: (_e = negative.ariaLabel) !== null && _e !== void 0 ? _e : 'Bad response', clickedAriaLabel: (_f = negative.ariaLabel) !== null && _f !== void 0 ? _f : 'Response recorded', onClick: (e) => handleClick(e, 'negative', negative.onClick), className: negative.className, isDisabled: negative.isDisabled, tooltipContent: (_g = negative.tooltipContent) !== null && _g !== void 0 ? _g : 'Bad response', clickedTooltipContent: (_h = negative.clickedTooltipContent) !== null && _h !== void 0 ? _h : 'Response recorded', tooltipProps: negative.tooltipProps, icon: _jsx(OutlinedThumbsDownIcon, {}), isClicked: activeButton === 'negative', ref: negative.ref, "aria-expanded": negative['aria-expanded'], "aria-controls": negative['aria-controls'] }))), copy && (_jsx(ResponseActionButton, Object.assign({}, copy, { ariaLabel: (_j = copy.ariaLabel) !== null && _j !== void 0 ? _j : 'Copy', clickedAriaLabel: (_k = copy.ariaLabel) !== null && _k !== void 0 ? _k : 'Copied', onClick: (e) => handleClick(e, 'copy', copy.onClick), className: copy.className, isDisabled: copy.isDisabled, tooltipContent: (_l = copy.tooltipContent) !== null && _l !== void 0 ? _l : 'Copy', clickedTooltipContent: (_m = copy.clickedTooltipContent) !== null && _m !== void 0 ? _m : 'Copied', tooltipProps: copy.tooltipProps, icon: _jsx(OutlinedCopyIcon, {}), isClicked: activeButton === 'copy', ref: copy.ref, "aria-expanded": copy['aria-expanded'], "aria-controls": copy['aria-controls'] }))), share && (_jsx(ResponseActionButton, Object.assign({}, share, { ariaLabel: (_o = share.ariaLabel) !== null && _o !== void 0 ? _o : 'Share', clickedAriaLabel: (_p = share.ariaLabel) !== null && _p !== void 0 ? _p : 'Shared', onClick: (e) => handleClick(e, 'share', share.onClick), className: share.className, isDisabled: share.isDisabled, tooltipContent: (_q = share.tooltipContent) !== null && _q !== void 0 ? _q : 'Share', clickedTooltipContent: (_r = share.clickedTooltipContent) !== null && _r !== void 0 ? _r : 'Shared', tooltipProps: share.tooltipProps, icon: _jsx(ExternalLinkAltIcon, {}), isClicked: activeButton === 'share', ref: share.ref, "aria-expanded": share['aria-expanded'], "aria-controls": share['aria-controls'] }))), listen && (_jsx(ResponseActionButton, Object.assign({}, listen, { ariaLabel: (_s = listen.ariaLabel) !== null && _s !== void 0 ? _s : 'Listen', clickedAriaLabel: (_t = listen.ariaLabel) !== null && _t !== void 0 ? _t : 'Listening', onClick: (e) => handleClick(e, 'listen', listen.onClick), className: listen.className, isDisabled: listen.isDisabled, tooltipContent: (_u = listen.tooltipContent) !== null && _u !== void 0 ? _u : 'Listen', clickedTooltipContent: (_v = listen.clickedTooltipContent) !== null && _v !== void 0 ? _v : 'Listening', tooltipProps: listen.tooltipProps, icon: _jsx(VolumeUpIcon, {}), isClicked: activeButton === 'listen', ref: listen.ref, "aria-expanded": listen['aria-expanded'], "aria-controls": listen['aria-controls'] }))), Object.keys(additionalActions).map((action) => {
+    return (_jsxs("div", { ref: responseActions, className: "pf-chatbot__response-actions", children: [positive && (_jsx(ResponseActionButton, Object.assign({}, positive, { ariaLabel: (_a = positive.ariaLabel) !== null && _a !== void 0 ? _a : 'Good response', clickedAriaLabel: (_b = positive.ariaLabel) !== null && _b !== void 0 ? _b : 'Response recorded', onClick: (e) => handleClick(e, 'positive', positive.onClick), className: positive.className, isDisabled: positive.isDisabled, tooltipContent: (_c = positive.tooltipContent) !== null && _c !== void 0 ? _c : 'Good response', clickedTooltipContent: (_d = positive.clickedTooltipContent) !== null && _d !== void 0 ? _d : 'Response recorded', tooltipProps: positive.tooltipProps, icon: _jsx(OutlinedThumbsUpIcon, {}), isClicked: activeButton === 'positive', ref: positive.ref, "aria-expanded": positive['aria-expanded'], "aria-controls": positive['aria-controls'] }))), negative && (_jsx(ResponseActionButton, Object.assign({}, negative, { ariaLabel: (_e = negative.ariaLabel) !== null && _e !== void 0 ? _e : 'Bad response', clickedAriaLabel: (_f = negative.ariaLabel) !== null && _f !== void 0 ? _f : 'Response recorded', onClick: (e) => handleClick(e, 'negative', negative.onClick), className: negative.className, isDisabled: negative.isDisabled, tooltipContent: (_g = negative.tooltipContent) !== null && _g !== void 0 ? _g : 'Bad response', clickedTooltipContent: (_h = negative.clickedTooltipContent) !== null && _h !== void 0 ? _h : 'Response recorded', tooltipProps: negative.tooltipProps, icon: _jsx(OutlinedThumbsDownIcon, {}), isClicked: activeButton === 'negative', ref: negative.ref, "aria-expanded": negative['aria-expanded'], "aria-controls": negative['aria-controls'] }))), copy && (_jsx(ResponseActionButton, Object.assign({}, copy, { ariaLabel: (_j = copy.ariaLabel) !== null && _j !== void 0 ? _j : 'Copy', clickedAriaLabel: (_k = copy.ariaLabel) !== null && _k !== void 0 ? _k : 'Copied', onClick: (e) => handleClick(e, 'copy', copy.onClick), className: copy.className, isDisabled: copy.isDisabled, tooltipContent: (_l = copy.tooltipContent) !== null && _l !== void 0 ? _l : 'Copy', clickedTooltipContent: (_m = copy.clickedTooltipContent) !== null && _m !== void 0 ? _m : 'Copied', tooltipProps: copy.tooltipProps, icon: _jsx(OutlinedCopyIcon, {}), isClicked: activeButton === 'copy', ref: copy.ref, "aria-expanded": copy['aria-expanded'], "aria-controls": copy['aria-controls'] }))), share && (_jsx(ResponseActionButton, Object.assign({}, share, { ariaLabel: (_o = share.ariaLabel) !== null && _o !== void 0 ? _o : 'Share', clickedAriaLabel: (_p = share.ariaLabel) !== null && _p !== void 0 ? _p : 'Shared', onClick: (e) => handleClick(e, 'share', share.onClick), className: share.className, isDisabled: share.isDisabled, tooltipContent: (_q = share.tooltipContent) !== null && _q !== void 0 ? _q : 'Share', clickedTooltipContent: (_r = share.clickedTooltipContent) !== null && _r !== void 0 ? _r : 'Shared', tooltipProps: share.tooltipProps, icon: _jsx(ExternalLinkAltIcon, {}), isClicked: activeButton === 'share', ref: share.ref, "aria-expanded": share['aria-expanded'], "aria-controls": share['aria-controls'] }))), download && (_jsx(ResponseActionButton, Object.assign({}, download, { ariaLabel: (_s = download.ariaLabel) !== null && _s !== void 0 ? _s : 'Download', clickedAriaLabel: (_t = download.ariaLabel) !== null && _t !== void 0 ? _t : 'Downloaded', onClick: (e) => handleClick(e, 'download', download.onClick), className: download.className, isDisabled: download.isDisabled, tooltipContent: (_u = download.tooltipContent) !== null && _u !== void 0 ? _u : 'Download', clickedTooltipContent: (_v = download.clickedTooltipContent) !== null && _v !== void 0 ? _v : 'Downloaded', tooltipProps: download.tooltipProps, icon: _jsx(DownloadIcon, {}), isClicked: activeButton === 'download', ref: download.ref, "aria-expanded": download['aria-expanded'], "aria-controls": download['aria-controls'] }))), listen && (_jsx(ResponseActionButton, Object.assign({}, listen, { ariaLabel: (_w = listen.ariaLabel) !== null && _w !== void 0 ? _w : 'Listen', clickedAriaLabel: (_x = listen.ariaLabel) !== null && _x !== void 0 ? _x : 'Listening', onClick: (e) => handleClick(e, 'listen', listen.onClick), className: listen.className, isDisabled: listen.isDisabled, tooltipContent: (_y = listen.tooltipContent) !== null && _y !== void 0 ? _y : 'Listen', clickedTooltipContent: (_z = listen.clickedTooltipContent) !== null && _z !== void 0 ? _z : 'Listening', tooltipProps: listen.tooltipProps, icon: _jsx(VolumeUpIcon, {}), isClicked: activeButton === 'listen', ref: listen.ref, "aria-expanded": listen['aria-expanded'], "aria-controls": listen['aria-controls'] }))), Object.keys(additionalActions).map((action) => {
                 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
                 return (_createElement(ResponseActionButton, Object.assign({}, additionalActions[action], { key: action, ariaLabel: (_a = additionalActions[action]) === null || _a === void 0 ? void 0 : _a.ariaLabel, clickedAriaLabel: (_b = additionalActions[action]) === null || _b === void 0 ? void 0 : _b.clickedAriaLabel, onClick: (e) => { var _a; return handleClick(e, action, (_a = additionalActions[action]) === null || _a === void 0 ? void 0 : _a.onClick); }, className: (_c = additionalActions[action]) === null || _c === void 0 ? void 0 : _c.className, isDisabled: (_d = additionalActions[action]) === null || _d === void 0 ? void 0 : _d.isDisabled, tooltipContent: (_e = additionalActions[action]) === null || _e === void 0 ? void 0 : _e.tooltipContent, tooltipProps: (_f = additionalActions[action]) === null || _f === void 0 ? void 0 : _f.tooltipProps, clickedTooltipContent: (_g = additionalActions[action]) === null || _g === void 0 ? void 0 : _g.clickedTooltipContent, icon: (_h = additionalActions[action]) === null || _h === void 0 ? void 0 : _h.icon, isClicked: activeButton === action, ref: (_j = additionalActions[action]) === null || _j === void 0 ? void 0 : _j.ref, "aria-expanded": (_k = additionalActions[action]) === null || _k === void 0 ? void 0 : _k['aria-expanded'], "aria-controls": (_l = additionalActions[action]) === null || _l === void 0 ? void 0 : _l['aria-controls'] })));
             })] }));

package/dist/esm/ResponseActions/ResponseActions.test.js

@@ -52,6 +52,7 @@ const ALL_ACTIONS_DATA_TEST = [
     { type: 'negative', label: 'Bad response', dataTestId: 'negative' },
     { type: 'copy', label: 'Copy', dataTestId: 'copy' },
     { type: 'share', label: 'Share', dataTestId: 'share' },
+    { type: 'download', label: 'Download', dataTestId: 'download' },
     { type: 'listen', label: 'Listen', dataTestId: 'listen' }
 ];
 describe('ResponseActions', () => {
@@ -64,14 +65,16 @@ describe('ResponseActions', () => {
                 negative: { onClick: jest.fn() },
                 copy: { onClick: jest.fn() },
                 share: { onClick: jest.fn() },
+                download: { onClick: jest.fn() },
                 listen: { onClick: jest.fn() }
             } }));
         const goodBtn = screen.getByRole('button', { name: 'Good response' });
         const badBtn = screen.getByRole('button', { name: 'Bad response' });
         const copyBtn = screen.getByRole('button', { name: 'Copy' });
         const shareBtn = screen.getByRole('button', { name: 'Share' });
+        const downloadBtn = screen.getByRole('button', { name: 'Download' });
         const listenBtn = screen.getByRole('button', { name: 'Listen' });
-        const buttons = [goodBtn, badBtn, copyBtn, shareBtn, listenBtn];
+        const buttons = [goodBtn, badBtn, copyBtn, shareBtn, downloadBtn, listenBtn];
         buttons.forEach((button) => {
             expect(button).toBeTruthy();
         });
@@ -144,6 +147,7 @@ describe('ResponseActions', () => {
             { type: 'negative', ariaLabel: 'Thumbs down' },
             { type: 'copy', ariaLabel: 'Copy the message' },
             { type: 'share', ariaLabel: 'Share it with friends' },
+            { type: 'download', ariaLabel: 'Download your cool message' },
             { type: 'listen', ariaLabel: 'Listen up' }
         ];
         actions.forEach(({ type, ariaLabel }) => {

package/dist/esm/SourcesCard/SourcesCard.d.ts

@@ -1,5 +1,5 @@
 import type { FunctionComponent } from 'react';
-import { CardProps } from '@patternfly/react-core';
+import { ButtonProps, CardProps } from '@patternfly/react-core';
 export interface SourcesCardProps extends CardProps {
     /** Additional classes for the pagination navigation container. */
     className?: string;
@@ -11,11 +11,20 @@ export interface SourcesCardProps extends CardProps {
     paginationAriaLabel?: string;
     /** Content rendered inside the paginated card */
     sources: {
+        /** Title of sources card */
         title?: string;
+        /** Link to source */
         link: string;
+        /** Body of sources card */
         body?: React.ReactNode | string;
+        /** Whether link is external */
         isExternal?: boolean;
+        /** Whether sources card is expandable */
         hasShowMore?: boolean;
+        /** onClick event applied to the title of the Sources card */
+        onClick?: React.MouseEventHandler<HTMLButtonElement>;
+        /** Any additional props applied to the title of the Sources card  */
+        titleProps?: ButtonProps;
     }[];
     /** Label for the English word "source" */
     sourceWord?: string;

package/dist/esm/SourcesCard/SourcesCard.js

@@ -15,6 +15,7 @@ import { useState } from 'react';
 import { Button, ButtonVariant, Card, CardBody, CardFooter, CardTitle, ExpandableSection, ExpandableSectionVariant, Icon, pluralize, Truncate } from '@patternfly/react-core';
 import { ExternalLinkSquareAltIcon } from '@patternfly/react-icons';
 const SourcesCard = (_a) => {
+    var _b;
     var { className, isDisabled, paginationAriaLabel = 'Pagination', sources, sourceWord = 'source', sourceWordPlural = 'sources', toNextPageAriaLabel = 'Go to next page', toPreviousPageAriaLabel = 'Go to previous page', onNextClick, onPreviousClick, onSetPage, showMoreWords = 'show more', showLessWords = 'show less', isCompact } = _a, props = __rest(_a, ["className", "isDisabled", "paginationAriaLabel", "sources", "sourceWord", "sourceWordPlural", "toNextPageAriaLabel", "toPreviousPageAriaLabel", "onNextClick", "onPreviousClick", "onSetPage", "showMoreWords", "showLessWords", "isCompact"]);
     const [page, setPage] = useState(1);
     const [isExpanded, setIsExpanded] = useState(false);
@@ -31,7 +32,7 @@ const SourcesCard = (_a) => {
         }
         return `Source ${page}`;
     };
-    return (_jsxs("div", { className: "pf-chatbot__source", children: [_jsx("span", { children: pluralize(sources.length, sourceWord, sourceWordPlural) }), _jsxs(Card, Object.assign({ isCompact: isCompact, className: "pf-chatbot__sources-card" }, props, { children: [_jsx(CardTitle, { className: "pf-chatbot__sources-card-title", children: _jsx(Button, { component: "a", variant: ButtonVariant.link, href: sources[page - 1].link, icon: sources[page - 1].isExternal ? _jsx(ExternalLinkSquareAltIcon, {}) : undefined, iconPosition: "end", isInline: true, rel: sources[page - 1].isExternal ? 'noreferrer' : undefined, target: sources[page - 1].isExternal ? '_blank' : undefined, children: renderTitle(sources[page - 1].title) }) }), sources[page - 1].body && (_jsx(CardBody, { className: `pf-chatbot__sources-card-body`, children: sources[page - 1].hasShowMore ? (
+    return (_jsxs("div", { className: "pf-chatbot__source", children: [_jsx("span", { children: pluralize(sources.length, sourceWord, sourceWordPlural) }), _jsxs(Card, Object.assign({ isCompact: isCompact, className: "pf-chatbot__sources-card" }, props, { children: [_jsx(CardTitle, { className: "pf-chatbot__sources-card-title", children: _jsx(Button, Object.assign({ component: "a", variant: ButtonVariant.link, href: sources[page - 1].link, icon: sources[page - 1].isExternal ? _jsx(ExternalLinkSquareAltIcon, {}) : undefined, iconPosition: "end", isInline: true, rel: sources[page - 1].isExternal ? 'noreferrer' : undefined, target: sources[page - 1].isExternal ? '_blank' : undefined, onClick: (_b = sources[page - 1].onClick) !== null && _b !== void 0 ? _b : undefined }, sources[page - 1].titleProps, { children: renderTitle(sources[page - 1].title) })) }), sources[page - 1].body && (_jsx(CardBody, { className: `pf-chatbot__sources-card-body`, children: sources[page - 1].hasShowMore ? (
                         // prevents extra VO announcements of button text - parent Message has aria-live
                         _jsx("div", { "aria-live": "off", children: _jsx(ExpandableSection, { variant: ExpandableSectionVariant.truncate, toggleText: isExpanded ? showLessWords : showMoreWords, onToggle: onToggle, isExpanded: isExpanded, truncateMaxLines: 2, children: sources[page - 1].body }) })) : (_jsx("div", { className: "pf-chatbot__sources-card-body-text", children: sources[page - 1].body })) })), sources.length > 1 && (_jsx(CardFooter, { className: "pf-chatbot__sources-card-footer-container", children: _jsx("div", { className: "pf-chatbot__sources-card-footer", children: _jsxs("nav", { className: `pf-chatbot__sources-card-footer-buttons ${className}`, "aria-label": paginationAriaLabel, children: [_jsx(Button, { variant: ButtonVariant.plain, isDisabled: isDisabled || page === 1, "data-action": "previous", onClick: (event) => {
                                             const newPage = page >= 1 ? page - 1 : 1;

package/dist/esm/SourcesCard/SourcesCard.test.js

@@ -169,4 +169,14 @@ describe('SourcesCard', () => {
             ] }));
         expect(screen.getByRole('region')).toHaveAttribute('class', 'pf-v6-c-expandable-section__content');
     }));
+    it('should call onClick appropriately', () => __awaiter(void 0, void 0, void 0, function* () {
+        const spy = jest.fn();
+        render(_jsx(SourcesCard, { sources: [{ title: 'How to make an apple pie', link: '', onClick: spy }] }));
+        yield userEvent.click(screen.getByRole('link', { name: /How to make an apple pie/i }));
+        expect(spy).toHaveBeenCalled();
+    }));
+    it('should apply titleProps appropriately', () => {
+        render(_jsx(SourcesCard, { sources: [{ title: 'How to make an apple pie', link: '', titleProps: { className: 'test' } }] }));
+        expect(screen.getByRole('link', { name: /How to make an apple pie/i })).toHaveClass('test');
+    });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/chatbot",
-  "version": "6.3.0-prerelease.20",
+  "version": "6.3.0-prerelease.22",
   "description": "This library provides React components based on PatternFly 6 that can be used to build chatbots.",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/patternfly-docs/content/extensions/chatbot/examples/Messages/BotMessage.tsx

@@ -225,14 +225,6 @@ _Italic text, formatted with single underscores_
         content="This bot has a square avatar. You can further customize the avatar by applying an additional class or passing [PatternFly avatar props](/components/avatar) to the `<Message>` component via `avatarProps`."
         hasRoundAvatar={false}
       />
-      <Message
-        name="Bot"
-        role="bot"
-        avatar={patternflyAvatar}
-        content={`Text-based message from a bot named "Bot," with updated timestamp`}
-        timestamp="1 hour ago"
-      />
-      <Message name="Bot" role="bot" avatar={patternflyAvatar} content="Example content" isLoading />
       <Select
         id="single-select"
         isOpen={isOpen}

package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithCustomResponseActions.tsx

@@ -3,7 +3,6 @@ import { FunctionComponent } from 'react';
 import Message from '@patternfly/chatbot/dist/dynamic/Message';
 import patternflyAvatar from './patternfly_avatar.jpg';
 import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
-import DownloadIcon from '@patternfly/react-icons/dist/esm/icons/download-icon';
 import RedoIcon from '@patternfly/react-icons/dist/esm/icons/redo-icon';
 
 export const CustomActionExample: FunctionComponent = () => (
@@ -22,15 +21,6 @@ export const CustomActionExample: FunctionComponent = () => (
         clickedTooltipContent: 'Regenerated',
         icon: <RedoIcon />
       },
-      download: {
-        ariaLabel: 'Download',
-        clickedAriaLabel: 'Downloaded',
-        // eslint-disable-next-line no-console
-        onClick: () => console.log('Clicked download'),
-        tooltipContent: 'Download',
-        clickedTooltipContent: 'Downloaded',
-        icon: <DownloadIcon />
-      },
       info: {
         ariaLabel: 'Info',
         // eslint-disable-next-line no-console

package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithResponseActions.tsx

@@ -17,7 +17,7 @@ export const ResponseActionExample: FunctionComponent = () => (
       // eslint-disable-next-line no-console
       copy: { onClick: () => console.log('Copy') },
       // eslint-disable-next-line no-console
-      share: { onClick: () => console.log('Share') },
+      download: { onClick: () => console.log('Download') },
       // eslint-disable-next-line no-console
       listen: { onClick: () => console.log('Listen') }
     }}

package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithActions.tsx

@@ -7,8 +7,8 @@ import { Checkbox, DropdownItem, DropdownList } from '@patternfly/react-core';
 
 const menuItems = [
   <DropdownList key="list-1">
-    <DropdownItem value="Share" id="Share">
-      Share
+    <DropdownItem value="Download" id="Download">
+      Download
     </DropdownItem>
     <DropdownItem value="Rename" id="Rename">
       Rename

package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithSelection.tsx

@@ -7,8 +7,8 @@ import { Checkbox, DropdownItem, DropdownList } from '@patternfly/react-core';
 
 const menuItems = [
   <DropdownList key="list-1">
-    <DropdownItem value="Share" id="Share">
-      Share
+    <DropdownItem value="Download" id="Download">
+      Download
     </DropdownItem>
     <DropdownItem value="Rename" id="Rename">
       Rename

package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotWelcomeInteraction.tsx

@@ -80,7 +80,7 @@ export const ChatbotWelcomeInteractionDemo: FunctionComponent = () => {
           // eslint-disable-next-line no-console
           copy: { onClick: () => console.log('Copy') },
           // eslint-disable-next-line no-console
-          share: { onClick: () => console.log('Share') },
+          download: { onClick: () => console.log('Download') },
           // eslint-disable-next-line no-console
           listen: { onClick: () => console.log('Listen') }
         }

package/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.tsx

@@ -132,7 +132,7 @@ const initialMessages: MessageProps[] = [
       positive: { onClick: () => tracking.trackSingleItem(actionEventName, { response: 'Good response' }) },
       negative: { onClick: () => tracking.trackSingleItem(actionEventName, { response: 'Bad response' }) },
       copy: { onClick: () => tracking.trackSingleItem(actionEventName, { response: 'Copy' }) },
-      share: { onClick: () => tracking.trackSingleItem(actionEventName, { response: 'Share' }) },
+      download: { onClick: () => tracking.trackSingleItem(actionEventName, { response: 'Download' }) },
       listen: { onClick: () => tracking.trackSingleItem(actionEventName, { response: 'Listen' }) }
     }
   }
@@ -269,7 +269,7 @@ export const ChatbotDemo: FunctionComponent = () => {
           positive: { onClick: () => tracking.trackSingleItem(actionEvent2, { response: 'Good response' }) },
           negative: { onClick: () => tracking.trackSingleItem(actionEvent2, { response: 'Bad response' }) },
           copy: { onClick: () => tracking.trackSingleItem(actionEvent2, { response: 'Copy' }) },
-          share: { onClick: () => tracking.trackSingleItem(actionEvent2, { response: 'Share' }) },
+          download: { onClick: () => tracking.trackSingleItem(actionEvent2, { response: 'Download' }) },
           listen: { onClick: () => tracking.trackSingleItem(actionEvent2, { response: 'Listen' }) }
         }
       });

package/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotCompact.tsx

@@ -117,7 +117,7 @@ const initialMessages: MessageProps[] = [
       // eslint-disable-next-line no-console
       copy: { onClick: () => console.log('Copy') },
       // eslint-disable-next-line no-console
-      share: { onClick: () => console.log('Share') },
+      download: { onClick: () => console.log('Download') },
       // eslint-disable-next-line no-console
       listen: { onClick: () => console.log('Listen') }
     }
@@ -256,7 +256,7 @@ export const ChatbotDemo: FunctionComponent = () => {
           // eslint-disable-next-line no-console
           copy: { onClick: () => console.log('Copy') },
           // eslint-disable-next-line no-console
-          share: { onClick: () => console.log('Share') },
+          download: { onClick: () => console.log('Download') },
           // eslint-disable-next-line no-console
           listen: { onClick: () => console.log('Listen') }
         }

package/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotInDrawer.tsx

@@ -130,7 +130,7 @@ const initialMessages: MessageProps[] = [
       // eslint-disable-next-line no-console
       copy: { onClick: () => console.log('Copy') },
       // eslint-disable-next-line no-console
-      share: { onClick: () => console.log('Share') },
+      download: { onClick: () => console.log('Download') },
       // eslint-disable-next-line no-console
       listen: { onClick: () => console.log('Listen') }
     }
@@ -266,7 +266,7 @@ export const EmbeddedChatbotDemo: FunctionComponent = () => {
           // eslint-disable-next-line no-console
           copy: { onClick: () => console.log('Copy') },
           // eslint-disable-next-line no-console
-          share: { onClick: () => console.log('Share') },
+          download: { onClick: () => console.log('Download') },
           // eslint-disable-next-line no-console
           listen: { onClick: () => console.log('Listen') }
         },

package/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotScrolling.tsx

@@ -122,7 +122,7 @@ const initialMessages: MessageProps[] = [
       // eslint-disable-next-line no-console
       copy: { onClick: () => console.log('Copy') },
       // eslint-disable-next-line no-console
-      share: { onClick: () => console.log('Share') },
+      download: { onClick: () => console.log('Download') },
       // eslint-disable-next-line no-console
       listen: { onClick: () => console.log('Listen') }
     }
@@ -283,7 +283,7 @@ export const ChatbotScrollingDemo: React.FunctionComponent = () => {
           // eslint-disable-next-line no-console
           copy: { onClick: () => console.log('Copy') },
           // eslint-disable-next-line no-console
-          share: { onClick: () => console.log('Share') },
+          download: { onClick: () => console.log('Download') },
           // eslint-disable-next-line no-console
           listen: { onClick: () => console.log('Listen') }
         }

package/patternfly-docs/content/extensions/chatbot/examples/demos/EmbeddedChatbot.tsx

@@ -128,7 +128,7 @@ const initialMessages: MessageProps[] = [
       // eslint-disable-next-line no-console
       copy: { onClick: () => console.log('Copy') },
       // eslint-disable-next-line no-console
-      share: { onClick: () => console.log('Share') },
+      download: { onClick: () => console.log('Download') },
       // eslint-disable-next-line no-console
       listen: { onClick: () => console.log('Listen') }
     }
@@ -257,7 +257,7 @@ export const EmbeddedChatbotDemo: FunctionComponent = () => {
           // eslint-disable-next-line no-console
           copy: { onClick: () => console.log('Copy') },
           // eslint-disable-next-line no-console
-          share: { onClick: () => console.log('Share') },
+          download: { onClick: () => console.log('Download') },
           // eslint-disable-next-line no-console
           listen: { onClick: () => console.log('Listen') }
         },

package/patternfly-docs/content/extensions/chatbot/examples/demos/EmbeddedComparisonChatbot.tsx

@@ -86,7 +86,7 @@ export const CompareChild = ({ name, input, hasNewInput, setIsSendButtonDisabled
             // eslint-disable-next-line no-console
             copy: { onClick: () => console.log('Copy') },
             // eslint-disable-next-line no-console
-            share: { onClick: () => console.log('Share') },
+            download: { onClick: () => console.log('Download') },
             // eslint-disable-next-line no-console
             listen: { onClick: () => console.log('Listen') }
           },

package/src/Message/Message.test.tsx

@@ -428,6 +428,8 @@ describe('Message', () => {
           // eslint-disable-next-line no-console
           share: { onClick: () => console.log('Share') },
           // eslint-disable-next-line no-console
+          download: { onClick: () => console.log('Download') },
+          // eslint-disable-next-line no-console
           listen: { onClick: () => console.log('Listen') }
         }}
       />
@@ -454,6 +456,8 @@ describe('Message', () => {
           // eslint-disable-next-line no-console
           share: { onClick: () => console.log('Share') },
           // eslint-disable-next-line no-console
+          download: { onClick: () => console.log('Download') },
+          // eslint-disable-next-line no-console
           listen: { onClick: () => console.log('Listen') }
         }}
       />

package/src/ResponseActions/ResponseActions.test.tsx

@@ -45,6 +45,7 @@ const ALL_ACTIONS_DATA_TEST = [
   { type: 'negative', label: 'Bad response', dataTestId: 'negative' },
   { type: 'copy', label: 'Copy', dataTestId: 'copy' },
   { type: 'share', label: 'Share', dataTestId: 'share' },
+  { type: 'download', label: 'Download', dataTestId: 'download' },
   { type: 'listen', label: 'Listen', dataTestId: 'listen' }
 ];
 
@@ -60,6 +61,7 @@ describe('ResponseActions', () => {
           negative: { onClick: jest.fn() },
           copy: { onClick: jest.fn() },
           share: { onClick: jest.fn() },
+          download: { onClick: jest.fn() },
           listen: { onClick: jest.fn() }
         }}
       />
@@ -68,8 +70,9 @@ describe('ResponseActions', () => {
     const badBtn = screen.getByRole('button', { name: 'Bad response' });
     const copyBtn = screen.getByRole('button', { name: 'Copy' });
     const shareBtn = screen.getByRole('button', { name: 'Share' });
+    const downloadBtn = screen.getByRole('button', { name: 'Download' });
     const listenBtn = screen.getByRole('button', { name: 'Listen' });
-    const buttons = [goodBtn, badBtn, copyBtn, shareBtn, listenBtn];
+    const buttons = [goodBtn, badBtn, copyBtn, shareBtn, downloadBtn, listenBtn];
     buttons.forEach((button) => {
       expect(button).toBeTruthy();
     });
@@ -166,6 +169,7 @@ describe('ResponseActions', () => {
       { type: 'negative', ariaLabel: 'Thumbs down' },
       { type: 'copy', ariaLabel: 'Copy the message' },
       { type: 'share', ariaLabel: 'Share it with friends' },
+      { type: 'download', ariaLabel: 'Download your cool message' },
       { type: 'listen', ariaLabel: 'Listen up' }
     ];
     actions.forEach(({ type, ariaLabel }) => {

package/src/ResponseActions/ResponseActions.tsx

@@ -5,7 +5,8 @@ import {
   VolumeUpIcon,
   OutlinedThumbsUpIcon,
   OutlinedThumbsDownIcon,
-  OutlinedCopyIcon
+  OutlinedCopyIcon,
+  DownloadIcon
 } from '@patternfly/react-icons';
 import ResponseActionButton from './ResponseActionButton';
 import { ButtonProps, TooltipProps } from '@patternfly/react-core';
@@ -47,13 +48,14 @@ export interface ResponseActionProps {
     negative?: ActionProps;
     copy?: ActionProps;
     share?: ActionProps;
+    download?: ActionProps;
     listen?: ActionProps;
   };
 }
 
 export const ResponseActions: FunctionComponent<ResponseActionProps> = ({ actions }) => {
   const [activeButton, setActiveButton] = useState<string>();
-  const { positive, negative, copy, share, listen, ...additionalActions } = actions;
+  const { positive, negative, copy, share, download, listen, ...additionalActions } = actions;
   const responseActions = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
@@ -152,6 +154,24 @@ export const ResponseActions: FunctionComponent<ResponseActionProps> = ({ action
           aria-controls={share['aria-controls']}
         ></ResponseActionButton>
       )}
+      {download && (
+        <ResponseActionButton
+          {...download}
+          ariaLabel={download.ariaLabel ?? 'Download'}
+          clickedAriaLabel={download.ariaLabel ?? 'Downloaded'}
+          onClick={(e) => handleClick(e, 'download', download.onClick)}
+          className={download.className}
+          isDisabled={download.isDisabled}
+          tooltipContent={download.tooltipContent ?? 'Download'}
+          clickedTooltipContent={download.clickedTooltipContent ?? 'Downloaded'}
+          tooltipProps={download.tooltipProps}
+          icon={<DownloadIcon />}
+          isClicked={activeButton === 'download'}
+          ref={download.ref}
+          aria-expanded={download['aria-expanded']}
+          aria-controls={download['aria-controls']}
+        ></ResponseActionButton>
+      )}
       {listen && (
         <ResponseActionButton
           {...listen}

package/src/SourcesCard/SourcesCard.test.tsx

@@ -242,4 +242,18 @@ describe('SourcesCard', () => {
     );
     expect(screen.getByRole('region')).toHaveAttribute('class', 'pf-v6-c-expandable-section__content');
   });
+
+  it('should call onClick appropriately', async () => {
+    const spy = jest.fn();
+    render(<SourcesCard sources={[{ title: 'How to make an apple pie', link: '', onClick: spy }]} />);
+    await userEvent.click(screen.getByRole('link', { name: /How to make an apple pie/i }));
+    expect(spy).toHaveBeenCalled();
+  });
+
+  it('should apply titleProps appropriately', () => {
+    render(
+      <SourcesCard sources={[{ title: 'How to make an apple pie', link: '', titleProps: { className: 'test' } }]} />
+    );
+    expect(screen.getByRole('link', { name: /How to make an apple pie/i })).toHaveClass('test');
+  });
 });

package/src/SourcesCard/SourcesCard.tsx

@@ -6,6 +6,7 @@ import { useState } from 'react';
 // Import PatternFly components
 import {
   Button,
+  ButtonProps,
   ButtonVariant,
   Card,
   CardBody,
@@ -31,11 +32,20 @@ export interface SourcesCardProps extends CardProps {
   paginationAriaLabel?: string;
   /** Content rendered inside the paginated card */
   sources: {
+    /** Title of sources card */
     title?: string;
+    /** Link to source */
     link: string;
+    /** Body of sources card */
     body?: React.ReactNode | string;
+    /** Whether link is external */
     isExternal?: boolean;
+    /** Whether sources card is expandable */
     hasShowMore?: boolean;
+    /** onClick event applied to the title of the Sources card */
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+    /** Any additional props applied to the title of the Sources card  */
+    titleProps?: ButtonProps;
   }[];
   /** Label for the English word "source" */
   sourceWord?: string;
@@ -107,6 +117,8 @@ const SourcesCard: FunctionComponent<SourcesCardProps> = ({
             isInline
             rel={sources[page - 1].isExternal ? 'noreferrer' : undefined}
             target={sources[page - 1].isExternal ? '_blank' : undefined}
+            onClick={sources[page - 1].onClick ?? undefined}
+            {...sources[page - 1].titleProps}
           >
             {renderTitle(sources[page - 1].title)}
           </Button>